← コースに戻る
未ログインのため、この講座の進捗は記録されません。ログインすると記録が残るようになります。
モバイル/レスポンシブなダッシュボード設計
ダッシュボードは、PCの大きな画面だけでなく、スマートフォンやタブレットで確認されることも増えている。画面サイズに応じてレイアウトを最適化する設計を意識する必要がある。
モバイル表示を考慮する際のポイントは次の通り。
| ポイント | 内容 |
|---|---|
| 情報の優先順位を明確にする | 小さい画面では表示できる情報が限られるため、PC版よりさらに「最も重要な指標は何か」を絞り込む |
| 縦スクロールを前提にする | 横並びのレイアウトは小さい画面で崩れやすいため、要素を縦に積み重ねる方が扱いやすい |
| タップ操作を意識する | マウスのホバー操作(ツールチップなど)はタッチでは使いにくい。ボタンは指で押しやすい大きさにする |
| モバイル専用レイアウトを設定する | 多くのBIツールでは、PC版の縮小表示ではなくモバイル向けに配置・表示順序を作り直せる |
全ての指標をモバイルでも同じように見せようとするのではなく、「モバイルでは要点だけ、詳細はPCで」といった役割分担を意識すると、それぞれの利用シーンに合ったダッシュボードになる。