Googleが新しく発表したチャートデザインの6つの原則とは

この記事は、GoogleのデザインリードManuel Lima氏のブログ記事を公式に許可をいただき翻訳させていただいたものです。

Googleがデータビジュアライズの新ガイドライン導入

2017年8月、Googleのデザイナー、リサーチャー、エンジニアの有志が集まり、データビジュアライズに関する総合的なガイドラインを作成した。

このガイドラインでは、色、形状、タイポグラフィ、図解、インタラクション、モーションなどデータビジュアライズに関するすべての分野を網羅している。本ガイドライン制作の成果から、2018年5月、Google初のデータビジュアライズに特化した“データビジュアライゼーション”チームがスタートした。

本記事では、その取り組みから得た知見をシェアしたい。

正直であること

データの正確さと誠実さを最優先にする。情報を歪曲し、混乱させたり、演出したり、公平さを欠くものにしてはならない。明確さと透明性が重要である。

ビジュアライズされたデータを理解するために、必要となる情報の提供は不可欠だ。わかりやすいラベル、正確な主軸と基準値を使い、補足説明や凡例によって、ビジュアライズされたデータを最大限に誠実なものにする。

モーショングラフィックはデータの関連性をよりわかりやすくするために使い、決してデータを歪めてはならない。また、採用したデータセットについては、出典、収集方法、扱われ方など、その透明性を維持することを忘れないこと。

救いの手となること

データの文脈を提供し、ユーザーがデータを活用できるようにする。データの比較、検討を最優先とするアフォーダンスを構築すること。

ユーザーのメンタルモデルを念頭に置いたデザインをし、チャートにある情報を読み取りやすくすること。選択やズーム、パン、フィルタリングといったコア機能を発見しやすくする視覚的要素、アフォーダンスを設けよう。

モーションデザインとインタラクションデザインは、データの文脈、データの持つインサイト、各データの関連性を明らかにし、ユーザーの理解をサポートするものでなければならない。

ユーザーに喜んでもらうこと

常に期待を超えよう。パフォーマンス、洗練さ、意外性、イノベーションについて考え、ダイナミックで、すばやく、知的な経験を提供すること。

素晴らしい視覚体験を生み出す。それを、ユーザーの想像を超えるレベルで積み重ねていこう。ユーザーが求める代表的なな機能を採用したり、特徴や小さな喜びの瞬間を、適切に取り入れることが必要だ。

スピードは優れたグラフィックと同等に評価される。遷移時のモーションやタイミングがよいだけで、ユーザーにとってはすばやく反応するシステムであるという認識につながるはずだ。

フォーカスをはっきりさせること

認知負荷を減らし、重要な部分にフォーカスすること。あらゆるモーション、色、視覚的要素はデータの分析、洞察、理解をサポートするものでなければならない。

ユーザーが欲しい情報に焦点を当てれば、すべてはうまく回るはずだ。ユーザーが最も必要としている情報に、できるだけすばやくアクセスできるようにしよう。データを示すために必要な色の量は最小限とし、関係のないグラフィックは使わない。

たとえば、ラベル、グループ、ハイライト、単位などにおける色の使い方は、グラフの理解に役立つものとする。モーションの使用は控えめにし、ユーザーの階層、方向性、関連性の理解を助ける必要最低限の遷移や合図のみとすること。

スケールを採用すること

どんなコンテクストにも拡張、適応できるシステムにすること。データの深さ、複雑さ、様式において、さまざまなユーザーのニーズを配慮すること。

どのチャートも、できるだけ幅広く利用可能なものでなければならない。さまざまなユーザーのニーズ、スクリーンサイズ、データタイプ（伝えるデータが一つの場合から複数のデータが混在する場合など）に応えるために、チャートの要素（色、パターン、フィルターの構造、軸など）の調整方法を考慮すること。

変更不可能な部分より変更可能な範囲について考える。ユーザーがデータに対する深い洞察を可能にするため、段階的に情報の詳細を開示する、ユーザーが視点を変えられるようにする、他のグラフと関連づけるなど、複雑さを最小限に抑え、ユーザーにとってわかりやすいビジュアライズを心がけよう。

構造を提供すること

階層の伝達、構造の提供、一貫性の向上ために、視覚的な属性を利用する。それらは、直感的かつ簡単に使用できるものでなければならない。

一貫性はわかりやすさに直結する。グラフィック（形、色、図、タイポグラフィ）と対応するインタラクションパターン（選択、フィルター、ホバーした状態、展開）は統一すること。モーションは、反応を待っている間もユーザーがコントロールできていると感じられるものでなければならない。

視覚的な階層、軸の方向性、表示されているデータをユーザーが理解できるように、開始と終了のモーションを考慮すること。遷移時の前後関係をわかりやすくすることで、ユーザーはチャートのどこへ行こうとも、どうやって戻ってくればよいかがわかるだろう。

さらなる考察と方策については、Data Visualization guidelinesを参照いただきたい。

原文：Six Principles for Designing Any Chart

翻訳者：Chocolat Heartnight