iOSアプリをデザインする際に必須で抑えるべき「ヒューマンインターフェースガイドライン」について紹介します。目次はじめにiOSのヒューマンインターフェースを理解するためにはAppleが発表しているガイドラインを読む必要があります。ここにはデザインの原則と理由、どのように活用していくのかがまとまっています。https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/理想は全文読んでからデザインを行うことですが、時間がない方向けに要点だけをかいつまんでご紹介します。デザイン原則インタラクティブ性読みやすさグラフィック明確さこの4つの法則を守っていればiOSデザインはバッチリです。簡単に各項目の内容を説明していきます。インタラクティブ性コンテンツの表示形態iOS デバイスの画面に合ったレイアウトで作成します。主要なコンテンツは、ユーザがズームや横スクロールしなくても表示できるようにしましょう。↓各デバイスのサイズ一覧↓・レイアウトガイドと安全な領域レイアウトガイドは、実際には画面上に表示されない長方形の領域のことです。安全な領域を確保しておくとコンテンツの配置、配置、および間隔に役立ちます。↓セーフエリア一覧↓読みやすさ・タイポグラフィと間隔iOSでは基本的にサンフランシスコを使用します。この書体のフォントはテキストに比類のない読みやすさ、明快さ、そして一貫性を与えるように最適化されています。apple公式からダウンロードできるので、ダウンロードしておきましょう。また、フォントサイズや間隔についても細かくサイズ指定があるので、下記URLから確認しましょう。%3Cdiv%20class%3D%22iframely-embed%22%3E%3Cdiv%20class%3D%22iframely-responsive%22%20style%3D%22height%3A%20140px%3B%20padding-bottom%3A%200%3B%22%3E%3Ca%20href%3D%22https%3A%2F%2Fdocs.developer.apple.com%2Fdesign%2Fhuman-interface-guidelines%2Ftypography%22%20data-iframely-url%3D%22%2F%2Fiframely.net%2FeCBoBXt%3Fcard%3Dsmall%22%3E%3C%2Fa%3E%3C%2Fdiv%3E%3C%2Fdiv%3E%3Cscript%20async%20src%3D%22%2F%2Fiframely.net%2Fembed.js%22%3E%3C%2Fscript%3E・色カラーはそのアプリにあった色味を使うのもそうですが、iOSの基準のカラーパレットを参考に色味の選定をするとより良いものになります。また、色味はユーザーに与える影響がもっとも大きい要素の一つになります。選定は慎重に行いましょう。色は、活力を与え、視覚的な継続性を与え、ステータス情報を伝え、ユーザーの行動に応じてフィードバックを与え、そして人々がデータを視覚化するのを助けるための素晴らしい方法です。グラフィック・画像サイズと解像度すべての画像アセットに、高解像度 (2 倍) バージョンを用意してください。2 倍の解像度のバージョンがない画像は、Retina ディスプレイでぼやけて表示されてしまいます。また、歪みが発生しないように、画像は必ず本来のアスペクト比で表示させるようにしましょう。↓各デバイスに合わせた倍率一覧↓明確さ・画面構成iOSでは、ナビゲーションには主に3つのスタイルがあります。コントロール部品は操作するコンテンツの近くに配置し、認識しやすいレイアウトにしましょう。・階層ナビゲーション目的地に到着するまで、画面ごとに1つ選択してください。別の目的地に行くには、自分のステップをたどるか最初からやり直して別の選択をする必要があります。設定とメールはこのナビゲーションスタイルを使用します。・フラットナビゲーション複数のコンテンツカテゴリを切り替えます。Music and App Storeではこのナビゲーションスタイルを使用しています。・コンテンツ主導または経験主導のナビゲーションコンテンツ内を自由に移動するか、コンテンツ自体がナビゲーションを定義します。ゲーム、書籍、およびその他の没入型アプリは通常、このナビゲーションスタイルを使用します。一部のアプリは複数のナビゲーションスタイルを組み合わせたりしています。たとえば、フラットナビゲーションを使用するアプリでは、各カテゴリ内に階層型ナビゲーションを実装していたりと、部分的にスタイルを変更しているアプリもあります。またそれに合わせて、テキスト、画像、ボタンを適切に配置して、 それぞれの情報の関連性を認識しやすくしてください。まとめ今回紹介した4つの法則は必要最低限をまとめたものになりますのでお時間のある方はぜひAppleが発表しているガイドラインを読んでみてください。