ポイントで設計するときにiOSのガイドラインに従う方法は？ UI要素のサイズを確認するにはどうすればよいですか？
皆さん、こんにちは。
ここで詳細な回答を提供できる、非常に経験豊富なUXデザイナーの助けが必要です。
IPhoneモバイルアプリ（正確には、毎日のタスクマネージャーアプリ）の設計プロセスについていくつか質問があります。 iOSバージョン9をサポートするiPhoneアプリである必要があります。
一般的な質問：iPhoneデバイス（Iphone 5S（320x568）で2x、6（375x667）でレンダリングする2x、6 +（414x736）でレンダリングする）のモバイルデバイスデザイン（スケッチ）を提供する必要がある場合解決策、適切なプラクティスに従って作業を開始する必要がある（最初からの）サイズは？最初に特定のデバイスに高忠実度のモックアップを提供し、その後、他の1倍のサイズに縮小または拡大するだけですか？追伸：ファイルを開発者に引き渡す場合は、@ 1x、@ 2x、@ 3xのすべてのサイズでエクスポートする必要があります。 Sketchが1xデザインを2xおよび3xにエクスポートすることを知っています。しかし、再び質問は同じです-すべてのデバイスの1xサイズを個別に設計する必要があります-最初に5Sの1xサイズ、6の1xサイズ、6 +の1xサイズ？
私はSketch 3で作業しています。最初に@ 1x for iPhone 6に対して375 * 667ポイントから始めました。 iPhone向けにデザインする必要があるときは、通常、iPhone 6のアートボードを1x（375x667 px）で始めます。これは他のどのアートボードよりも便利だと思いました。ポイントで作業しているときも、IOSガイドライン/標準）を順守する必要がありますか？一般的なルールは、ボタンが44ポイント、小さいテキストが12ポイント、本文が17ポイント、タイトルが20ポイント以上であることを知っています。 。ポイントで作業しているときに、ボタンのサイズが44ptで、セグメント化されたコントロールのサイズと同じように見えるのはなぜですか？明らかにより多くのスペースが必要です。そのような場合、UI要素のサイズにどのように準拠できますか？方法ポイントで設計する場合、GUI標準に従っていますか？
あなたがスケッチで作業していることは素晴らしいです！
1.0）いいえ、デバイスごとに個別に設計しないでください。あなたは確かにこの方法でより忠実度の高いモックアップを作成することができますが、私を信じてください、それは変更を加えるための痛みになります。そして、おそらく多くの変更があるでしょう。
ここにはいくつかの異なる考え方がありますが、コンセンサスは、何よりもまず最も低い解像度で設計する必要があるということです（あなたの場合：320x568、iPhone 5 @ 1xの場合）。たとえば、750x1334（iPhone 6 @ 2x）で開始し、55x55のディメンションの要素を作成した場合、@ 1xにダウンサンプリングしようとすると、小数点（27.5x27.5）が発生するため、 28x28に丸める必要があります。アートワークによっては、これが画像を台無しにする可能性があります。
1.1）ここでの例外は、ビットマップ画像で作業している場合です。おそらくご存じのとおり、ビットマップ画像の拡大は縮小よりも問題が多いため、4x（100％）で作業し、3x（75％）、2x（50％）、1x（25％）にダウンサンプリングする必要があります。
4xを使用すると、ビットマップがAndroid xxxhdpi（4x））に対応できるようになり、3x-> 2xでは画像サイズの66.666666666666％が必要になるため、ピクセルの丸めが最小限に抑えられます。
2.0）使用する最小のデバイス用に設計することをお勧めします。あなたの場合、iPhone5（320x568）。画面の1つをスクロールせずにデバイスに快適に収まるようにしたい場合があります。 iPhone 6から設計を開始すると、iPhone 5で一部のコンテンツが画面外に表示される場合があります。
もう1つは、iPhone 5と6はどちらも@ 2xをレンダリングし、タブバーとナビゲーションバーの高さの高さは同じですが、異なるwidths。したがって、6では快適に見えるタブバーが5で混雑している可能性があります。6に収まるタイトルは、5では切り捨てられる可能性があります。
2.1）ポイントについて：まず、すべてのポイントの推奨事項は@ 1xに対するものです。つまり、iPhone 5または6のボタンは実際には高さが88pxになります。ポイントは開発者と通信するための便利な方法に過ぎないため、何かが100ピクセル幅であると言うのではなく、100ポイント幅であると言うと、@ 2xで200ピクセルが想定されていることがわかります。
2.2）視覚的に、セグメント化されたコントロールの高さは29ポイントのみです。技術的な機能についてはわかりませんが、Appleアプリでは、セグメント化されたコントロール（高さ29ポイント）が高さ44ポイントのエリアに配置されています。したがって、見た目が小さいと、タップ可能な領域は実際には大きくなる可能性があります。
これもデザイン要素のヒットになります。たぶん、24x24の小さな星を、クリック可能なお気に入りアイコンとして使用したいとします。あなたは中央に24x24の星を持つ44x44の画像を作ることができます（そして時にはそうするべきです）。
これの例外は、開発者がタップ可能な最小領域について十分に説明されている場合です。次に、24x24のアイコンを作成し、44x44のタップ可能な領域に表示するように指示できます。
2.3）ただし、場合によっては、HIG（iOSヒューマンインターフェイスガイドライン）を解除する必要がある場合があります。たぶん、小さな24x24のアイコンが必要で、その周りの44x44の領域のためのスペースがありません。それが起こります。しかし、ユーザーとテストして、これらの逸脱が製品の使いやすさを損なわないことを確認することは非常に重要です。