Navigation
Navigation - App Architecture - iOS - Human Interface Guidelines - Apple Developer
Navigation
ナビゲーション
People tend to be unaware of an app’s navigation until it doesn’t meet their expectations. Your job is to implement navigation in a way that supports the structure and purpose of your app without calling attention to itself. Navigation should feel natural and familiar, and shouldn’t dominate the interface or draw focus away from content. In iOS, there are three main styles of navigation.
人々は、不満が生じない限りアプリのナビゲーションに意識を向けない傾向があります。 あなたの仕事は、ナビゲーションに意識を向けさせずにアプリの構築と目的達成をサポートできるように、実装することです。 ナビゲーションは自然で親しみを感じられるべきであり、インターフェースを支配したり、コンテンツからフォーカスを引き離したりしてはなりません。 iOSでは、3つの主要なナビゲーションスタイルがあります。
Hierarchical Navigation
階層的ナビゲーション
Make one choice per screen until you reach a destination. To go to another destination, you must retrace your steps or start over from the beginning and make different choices. Settings and Mail use this navigation style.
あなたが目的地に達するまで、各画面ごとに用意された選択肢から1つ選択します。 別の目的地に行くにはステップを巻き戻るか、最初からやり直して別の選択肢を選ぶ必要があります。 設定とメールはこのナビゲーションスタイルを使用しています。
Flat Navigation
フラットナビゲーション
Switch between multiple content categories. Music and App Store use this navigation style.
複数のコンテンツカテゴリを切り替えます。 音楽とApp Storeはこのナビゲーションスタイルを使用しています。
Content-Driven or Experience-Driven Navigation
コンテンツドリブン、または体験ドリブンのナビゲーション
Move freely through content, or the content itself defines the navigation. Games, books, and other immersive apps generally use this navigation style.
コンテンツ間を自由に移動するか、コンテンツ自体がナビゲーションを定義します。 ゲーム、書籍、その他の没入型アプリでは、一般にこのナビゲーションスタイルが使用されます。
Some apps combine multiple navigation styles. For example, an app that uses flat navigation may implement hierarchical navigation within each category.
いくつかのアプリは複数のナビゲーションスタイルを組み合わせています。 たとえば、フラットナビゲーションを使用するアプリは、各カテゴリ内で階層ナビゲーションを実装できます。
Always provide a clear path. People should always know where they are in your app and how to get to their next destination. Regardless of navigation style, it’s essential that the path through content is logical, predictable, and easy to follow. In general, give people one path to each screen. If they need to see a screen in multiple contexts, consider using an action sheet, alert, popover, or modal view. To learn more, see Action Sheets, Alerts, Popovers, and Modality.
常に明確な経路を提供してください。 ユーザは常にアプリのどこにいるのかと、次の目的地に行く方法を知っておくべきです。 ナビゲーションスタイルにかかわらず、コンテンツの経路は論理的で予測可能であり、追跡が容易であることが不可欠です。 一般に、各スクリーンに至るパスは1つです。 複数のコンテキストで画面を表示する必要がある場合は、アクションシート、アラート、ポップオーバー、またはモーダルビューの使用を検討してください。 詳細は、アクションシート、アラート、ポップオーバー、モダリティを参照してください。
Design an information structure that makes it fast and easy to get to content.Organize your information structure in a way that requires a minimum number of taps, swipes, and screens.
コンテンツにすばやく簡単にアクセスできるようにするための情報構造を設計します。タップ、スワイプ、および経由する画面数が最小で済むように情報構造を構成します。
Use touch gestures to create fluidity. Make it easy to move through your interface with minimum friction. For example, you could let people swipe from the side of the screen to return to the previous screen.
流動性を備えるためにタッチジェスチャーを使用してください。 最低限のスワイプ量でインターフェイスを簡単に移動できるようにしてください。 たとえば、画面の横からスワイプして前の画面に戻す、等。
Use standard navigation components. Whenever possible, use standard navigation controls such as page controls, tab bars, segmented controls, table views, collection views, and split views. Users are already familiar with these controls, and will intuitively know how to get around your app.
標準ナビゲーションコンポーネントを使用します。 可能な限り、ページコントロール、タブバー、セグメントコントロール、テーブルビュー、コレクションビュー、分割ビューなどの標準のナビゲーションコントロールを使用します。 ユーザーは既にこれらのコントロールに精通しており、直感的にアプリを扱う方法を知ることができます。
Use a navigation bar to traverse a hierarchy of data. The navigation bar’s title can show the current position in the hierarchy, and the back button makes it easy to return to the previous location. For specific guidance, see Navigation Bars.
ナビゲーションバーを使用して、データの階層を遷移します。 ナビゲーションバーのタイトルに階層内の現在の位置が表示され、戻るボタンで前の場所に戻ります。 具体的なガイダンスについては、ナビゲーションバーを参照してください。
Use a tab bar to present peer categories of content or functionality. A tab bar lets people quickly and easily switch between categories, regardless of the current location. For specific guidance, see Tab Bars.
タブバーを使用して、コンテンツまたは機能の同階層カテゴリを表示します。 タブバーを使用すると、現在の場所に関係なく、カテゴリをすばやく簡単に切り替えることができます。 具体的なガイダンスについては、タブバーを参照してください。
Use a page control when you have multiple pages of the same type of content. A page control clearly communicates the number of pages available and which one is currently active. The Weather app uses a page control to show location-specific weather pages. For specific guidance, see Page Controls.
同種のコンテンツのページが複数ある場合は、ページコントロールを使用します。 ページコントロールは、利用可能なページ数と現在アクティブなページ数を明確に伝えます。 天気アプリケーションは、ページコントロールを使用して、場所固有の天気のページを表示します。 具体的なガイダンスについては、ページコントロールを参照してください。
TIPSegmented controls and toolbars don’t enable navigation. Use a segmented control to organize information into different categories. Use a toolbar to provide controls for interacting with the current context. For additional information on these types of elements, see Segmented Controls and Toolbars.
チップ
セグメンテドコントロールとツールバーの表示時はナビゲーションを使えません。セグメンテドコントロールを使用して、異なるカテゴリへ情報を区分けます。 ツールバーを使用して、現在のコンテキストと対話するためのコントロールを提供します。 これらの要素の種類の詳細については、セグメンテドコントロールとツールバーを参照してください。
（最終更新日：2018.9.7）
