概要

階層と構造

Webサイトやアプリケーションは立体的な構造として成り立っている。ページの前後関係を無視してサービスをデザインすることはできない。
例1） Appleの場合、グローバルナビゲーション ＞ ローカルナビゲーション と移動する。
その後、ローカルナビゲーションの見出しはタイトルに変化し、新たな動線も出現する。
例2） ケンブリッジ大学の場合 グローバルナビゲーションは、現在のいる場所と、その下層をしめす。 下層をクリックすると、先ほどいた場所が繰り上がり、表示される。
例3） iOSは1つ前のタイトルが戻るボタンの見出しとなる
人間はある状態から別の状態に変化する時、段階的に変化していくことを自然に感じる
画面の前後関係の理解を補助するためにインタラクションが有効である。 例）

深さと広さ

階層には深さと広さがある。基本的に反比例する。
一般的に、ユーザーは浅く広くの方が探しやすい。なぜなら、階層を上下する方が労力を伴うから。 また階層が広い方が、ラベリングは排他的で具体的に命名しやすくなる。
ラベリングで重要なポイントは、排他的に命名すること。なぜなら、ユーザーを困惑させることになり認知負荷を向上させてしまうため。
階層が狭いと、すっきりとさせることはできるが、ラベリングはわかりにくくなる。
フォローアップとして、各メニューをクリックホバーすると、そのメニューの説明や概要などが表示されることがある。
階層が広いもののデメリットとして、カテゴリ数が多く、構造的にわかりにくさを冗長してしまう。 あと、見た目の判断というか認知負荷はあるかも
スマホアプリにおいて、5タブ構成がよく見られるが、主要な機能以外はある1つにまとめられ、結果として抽象的ラベリングしていることに変わりないものがある。 対策としたは、サブメニュー、ハンバーガーメニューなどでカテゴリ数をさらに設置する。

現在地表記

チェックリスト