ダッシュボードデザインにおける重要ポイント3点【レイアウト編】

トップ画像

本記事は、これまでの私のデータ分析・データ視覚化(特にデータ視覚化のUI/UX)の実務経験から、即日効果のあるレイアウトのテクニックを解説した記事です

※ダッシュボードとは?

「ダッシュボード」という言葉自体まだ日本ではそこまで馴染みのある人は実際多くないでしょう。実際、車の「ダッシュボード」を思い浮かべる方の方が多いかもしれません。

データ視覚化における「ダッシュボード」の定義は様々で、例えばプロジェクト進捗、売上成績のモニタリング、WEBマーケティングでのインプレッションを確認しているものなど全てダッシュボードと言えます。ここでは、「情報が一つにまとまり意味を持つもの」として考えていただければOKです。

データ可視化そのものについて知りたい方はこちらの記事からどうぞ。

データ可視化とは?その重要性や手法、よくある課題と解決策を解説

レイアウトで効果的に伝えるための3つのポイント

人間の目が何かを見た時にどう動くのかということは、長らくそして様々な場所で研究されています。

下図はBIソフトウェアの一つであるTableau Softwareのリサーチ&デザインチームがアイトラッキング(目の動き)を調査している様子です。

アイトラッキングの調査の様子

Tableau オフィシャルページより拝借)

1 “Z”や”F”のレイアウトで注意を引きつける

視覚的意識の強さや順番をトラッキングしていくと、ダッシュボードの情報配置戦略のベストプラクティスとしては、下記が導き出されます。

Zの図

この動きに沿いダッシュボードを作成すれば、読み手に対してできる限り負担をかけずに効果的にメッセージを理解してもらうことができます。

また、特にビジネスの場面では、さらに下図のような意識で纏めていくのがリスクの少ない基本的なレイアウトです。基本的なレイアウト

もちろん、さまざまな観点、全体デザインに応じて配置の優先度は変化するものではありますが、ざっくりとした方向性としてこれに沿うと、読み手の認知的負荷を不要に上げずにすみます。

データ視覚化の分野でのコンペティション(コンペ)などでは全くこのレイアウトに沿わないものも多くありますが、ビジネスの場面では基本的なレイアウトに則りましょう。なぜなら、まず伝えたいことがきちんと伝わるようにすることが大切だからです。

下記は、アイトラッキングの検証の様子です。

Tableau オフィシャルページより拝借)

FやZの例

Tableau オフィシャルページより拝借)

2 重要なものは大きく表示する(BANs)

BANs(Big Ass Numbers)は、重要なものは大きく表示せよ、の意です。

データ視覚化において、重要なものを「大きく」表示させるということはシンプルで素晴らしいテクニックです。なぜなら重要な指標をハイライトさせ、個別具体的な成績や数字へストレートに意識を向けることできるからです。

個別具体的な数字を明確に理解させつつ、視覚化されたチャートも見せることで、データの言わんとしていることをユーザーがさらに深く理解しやすくなります。

次は、「BANs」を使いこなすための5つのコツです。

・重要な指標は大きなフォントでめりはりをつける

・色をつける

・動的にすると良い

・余白は十分にとる

下図は、BANsを効果的に使っているLM-7さんの作品例です。右下には、重要な数字を明確で大きな表示にされていますよね。

 

 

BANsをうまく使った作品例

Tableau Public「都道府県人口消失」作成者: LM-7

3 デバイスに合わせて設計する

モバイルで見ることを想定する場合はしっかりとモバイルの特徴に合わせなければなりません。デスクトップ上のPCとモバイルでは、表示すべき情報に加え、レイアウトや操作感も異なるため繊細な調整が必要です。デバイスごとの最適な表示エクスペリエンスを目指しましょう。

下記は、モバイルデバイスでのレイアウトでまずおさえるべき2点です。

3−1 垂直で考える

モバイルデバイスでは基本的に縦方向に設計する必要があります。情報を理解するストーリーは縦であることを意識し、情報を配置していきます。

縦方向のイメージ図

3−2 一番重要なものをトップに配置する

これもシンプルですが意外にできていないことです。重要なもの、早く見たいものを一番トップに配置します。

重要なものを一番上にのせるイメージ図

「データ視覚化/ダッシュボードデザインを成功させる95のチェックリスト」をダウンロードする

まとめ

上記に書いたレイアウトの原則は言われてみれば当たり前のことばかりです。しかし、分析や視覚化に必死になってしまい集中してしまうと忘れがちな3点を紹介しました。意識しているつもりでも、意外にできていなかったりするので、地味ですが重要なポイントです。

より深掘りした内容を、拙著『データ視覚化のデザイン』(4/22発売)に掲載しています。お手にとっていただけますと嬉しいです。

 

データのことなら、高い技術力とビジネス理解を融合させる私たちにご相談ください。

当社では、データ分析/視覚化/データ基盤コンサルティング・PoC支援に加え、ビジュアルアナリティクス、ダッシュボードレビュー研修、役員・管理職向け研修などのトレーニングを提供しています。組織に根付くデータ活用戦略立案の伴走をしています。

データビズラボへ問い合わせする

 

 

無料EBook:データ視覚化/ダッシュボードデザインを成功させる95のチェックリスト

無料EBook:データ視覚化/ダッシュボードデザインを成功させる95のチェックリスト

組織に根付くダッシュボードの作り方やデータビジュアライゼーションの仕方を調べているけれど、よくわからないと悩んでいませんか?

本書は当社やクライアント様がデータ分析/視覚化プロジェクトに取り組み、プロジェクト開始時から最後まで考えている一気通貫のチェックリストです。

  • 組織に根付かせるポイント
  • データ以外の要素と合わせて考える
  • 説得的なダッシュボード構築のテクニック

など、データ分析/視覚化の効果と、具体的な思考の観点・内容を95ポイントに渡って解説しているものです。

ぜひ、貴社のデータ活用にもご活用ください。

 

このEBOOKのレビュー

 

・ご入力頂いたメールアドレス宛に新着記事の紹介やセミナー情報などご迷惑にならない程度(月1−2回程度)にお送りしております。
・今回ご請求頂いた資料のアップデートがあった場合などにお知らせいたします。
・当社からの連絡がご不要な場合は簡単に登録解除が可能です。
・Gmail、Yahooメール、各種プロバイダやブログサービスが提供するフリーメール、携帯電話のキャリアメールなどで登録いただいた場合、資料送付致しかねます。

コメント

お問い合わせ

サービスに関するご質問や講演依頼など、お気軽にお問い合わせください。2営業日以内にお返事いたします。

ビジネスの成果にこだわるデータ分析支援
データ分析/活用にお困りの方はお気軽にお問い合わせください
ビジネスの成果にこだわるデータ分析支援
データ分析/活用にお困りの方は
お気軽にお問い合わせください
お役立ち資料