フレームワーク活用ガイド
押さえておきたい用語
- ウェイファインディング: ユーザーが「自分がどこにいるか」「どこに行きたいか」「どう行けばいいか」を把握しながら目的地に到達するプロセス
- ランドマーク: 現在地の手がかりになる視覚的な目印。ロゴ、アイコン、色の変化など
- パンくずリスト: 階層構造の現在位置を示すナビゲーション要素
- プログレッシブ・ディスクロージャー: 情報を段階的に開示し、認知負荷を軽減する手法
1
ナビゲーション監査
現状のサイト構造と導線を洗い出す → 迷子ポイントの特定
こんな悩みに効く#
- 「ユーザーが目的のページにたどり着けず離脱している」
- 「サイト構造が複雑になり、ナビゲーションが分かりにくくなった」
- 「検索に頼るユーザーが多く、ナビゲーション経由の回遊が少ない」
使い方#
4つの問いでページを監査する
サイトの主要ページそれぞれで「ここはどこか」「何があるか」「どう行けばいいか」「目的地に着いたか」に答えられるかを確認する。答えられないページは誘導要素が不足している。
迷子ポイントを特定する
Google Analyticsの離脱率・直帰率が高いページ、ヒートマップで「迷い行動」（行ったり来たり、スクロールの往復）が多いページを特定する。セッション録画ツールで実際の迷い行動を観察すると原因が具体的に見える。
ランドマークとパンくずを配置する
セクションごとの色分け、アイコン、ページタイトルの明示で「ここはどこか」を伝える。パンくずリストで階層構造を可視化し、グローバルナビの現在位置をハイライトする。ユーザーが「戻る」操作に頼らずに移動できる状態が理想だ。
到着と次の行動を明示する
タスク完了時に「完了しました」の明確なフィードバックと「次にやること」の導線を提示する。「目的地に着いた」ことが分からないと、ユーザーは不安になりさらに探索を続けてしまう。
具体例#
ECサイト — カテゴリナビゲーションの改善
状況: 商品カテゴリが200以上あるECサイトで、検索利用率が65%。ナビゲーション経由の購入率が検索経由の半分以下だった。ユーザーが「欲しい商品がどのカテゴリにあるか分からない」という声が多数。
適用プロセス:
- 4つの問い監査で「何がある？」が最弱と判明。カテゴリ名が専門的で、一般ユーザーに伝わっていなかった
- カテゴリ名を「用途別」に再編成（「スキンケア」→「保湿したい」「日焼け対策」）。各カテゴリにアイコンとサムネイル画像を追加
- パンくずリストを全ページに表示し、「今見ている商品はこのカテゴリの中にある」を明確に
成果: ナビゲーション経由の購入率が2.3倍に向上。検索利用率が65%→40%に低下し、回遊率が28%改善された。
SaaS — 複雑な管理画面のウェイファインディング
状況: HR管理システムの管理画面がメニュー階層4段、ページ数300以上。新規ユーザーの初回タスク完了率が32%で、操作マニュアルへの問い合わせが月500件。
適用プロセス:
- セッション録画で「設定画面を探して平均4回の誤クリック」が発生していることを発見
- メニュー構造を「人事」「給与」「勤怠」の3セクションに色分けし、各セクションのランドマーク（アイコン＋カラーバー）を統一
- 全ページにパンくずリスト＋「よく使う機能」ショートカットを配置。初回利用時のガイドツアーも追加
成果: 初回タスク完了率が32%→71%に改善。操作マニュアルへの問い合わせが月500件→120件に減少した。
自治体サイト — 高齢者向けナビゲーション
状況: 市役所サイトのリニューアルで、高齢者からの「目的の手続きページが見つからない」という電話問い合わせが月800件。サイト構造は部署ごとの分類で、住民目線になっていなかった。
適用プロセス:
- 「何がある？」の問い監査で、トップページのメニューが部署名（「市民課」「福祉課」）で住民には意味不明と判明
- メニューを「届出・証明」「子育て」「介護・福祉」「税金」のライフイベント別に再編。各カテゴリに大きなアイコンと説明文を追加
- 「よくある手続きトップ10」をトップページに配置し、2クリック以内で到達可能に
成果: 電話問い合わせが月800件→250件に減少。60歳以上のユーザーのタスク成功率が45%→78%に改善した。
うまくいかないパターン#
| パターン | 問題点 | 対処法 |
|---|---|---|
| 組織構造をそのままメニューにする | ユーザーは社内の部署名を知らない | ユーザーの目的・タスク別にメニューを構成する |
| ランドマークの統一感がない | ページごとにデザインが異なると位置感覚が崩れる | セクションごとの色・アイコンを統一する |
| 階層が深すぎる | 3クリック以上の深さは離脱リスクが高い | フラットな構造と検索の併用で到達距離を短縮する |
| 到着フィードバックがない | タスク完了が分からずユーザーが不安になる | 完了メッセージと次のステップを必ず表示する |
まとめ#
ウェイファインディングは 「ここはどこか」 「何があるか」「どう行くか」「着いたか」の4つの問いにユーザーが常に答えられる状態を作る技術だ。建築の誘導設計をデジタルUIに応用し、ランドマーク・パンくず・色分け・CTA導線で 「迷わない体験」 を設計する。ナビゲーションの改善は目立たない施策に見えるが、離脱率・タスク成功率・問い合わせ件数に直結するため、ROIの高い改善領域になる。