クライアントが一度、四半期ダッシュボードの「最終」バージョンを、理事会の会議の3時間前に送ってきました。そのKPIの各ブロックは、すべて同じブルーからレッドのグラデーションを使用しており、低い値では柔らかい空色から、高い値では深い赤まで変化していました。見た目は高級な印象を与えましたが、実際には関連性のない2つの指標——チャーン率とサポートチケットの件数——が、ともにオレンジ帯に入ったため、グラデーションが両者が同調しているように見せかけてしまいました。両者は全く関連していませんでした。 グラデーションの問題は、それが見た目が悪かったり過剰に使われているからではありません。人間の目に求められるのは、グラデーションが連続した色を連続した量として読み取ることですが、人間の目は構造的にその仕事に向いていないのです。 --- **色には内蔵された定規はない** 数字には明確な順序があります。3は2より大きく、4より小さいことは誰もが直感的に理解できます。色はそうではありません。チャートを黄色からオレンジ、そして赤にグラデーションさせると、視聴者の脳が無意識に色相を量の大きさに変換することを頼っていることになりますが、色相はもともとその仕事のために設計されていません。 この批判が、科学的ビジュアライゼーションで「レインボーカラーマップ」を非推奨にした理由です。2007年のIEEE論文で、研究者のデビッド・ボーランドとラッセル・テイラーは、レインボースケールが視聴者を混乱させる理由として、自然な知覚的順序を欠いていること、そしてスケール内の明るさの不均一がデータの実質的な違いを隠したり、存在しない相関を作り出したりすることを指摘しました。明るさが途中で急変するグラデーション——ほとんどのレインボーや多色スケールがそうである——は、実際の数値が完全に均一に変化しているときでも、視覚的な「境界」を作り出してしまいます。 私は、科学的なチャートだけでなく、日常的な売上チャートでもこの現象を見てきました。同じ値で黄色から緑に変化する収益ヒートマップは、視線をその境界に引き寄せ、何か変化があったかのように見せかけます。実際には何も変わっていません。グラデーションは、その範囲の中間に明るいスポットがあるだけです。 --- **チャートはパソコン上では問題なく見える——そして見えなくなる** ここからは、単なるデザインの細かい問題を超えた、より面倒な問題になります。色が正確なモニターで、静かなオフィスで、フルブライトの状態でカリブレーションされたグラデーションは、あなたのオーディエンスが見るものとは全く異なります。 同じスライドを会議室のスクリーンに投影し、照明を半分に下げると、隣接する微妙な色の違い——実際のデータを伝える部分——が最初に消えてしまいます。なぜなら、微妙な色相の変化は、硬い色の境界よりもはるかにコントラストが低いためです。また、ボードパケットとしてグレースケールで印刷すると、これは設計者が想定するよりも頻繁に起こりますが、5段階のグラデーションが2つか3つの視覚的に区別できるブロックに縮小されてしまいます。また、スライドをスクリーンショットに取り、Slackのスレッドに貼り付けると、JPEG圧縮がさらに遷移をぼやかしてしまいます。 これらの問題は、チャートを設計しているときには見えません。会議室で誰かがスクリーンを見つめ、どの地域が実際にパフォーマンスが良かったのか尋ねたときに初めて現れます。そして、正直な答えは、チャートがもうその質問に答えられなくなっているということです。 --- **あなたが設計していない読み手** 色覚異常は、無視できる稀なケースではありません。Color Blind Awarenessによると、男性の場合は約12人に1人、女性の場合は約200人に1人が影響を受けます。つまり、中規模のステークホルダー会議では、色覚異常を持つ人がいる可能性が高く、赤と緑のグラデーションの区別が困難になる可能性があります。赤から緑へのグラデーションは、特に問題で、これは色覚異常が最も曖昧にする色相の区別です。 これは、色のチェックリストの最後に付け加える注意事項ではありません。これは、プロジェクターの問題と同じ根本的な問題の下にあるものです:グラデーションが機能するのは、すべての視聴者が同じ数値を読み取れるときだけです。その意味のある割合の視聴者がそうできない場合、チャートはデータを伝えるのではなく、「暖色と冷色」というよりも鈍い信号を伝えるようになります。これは、あなたが意図したものとは全く異なるものです。 --- **グラデーションが悪者ではない——カテゴリなしで使われたときに悪者になる** これらのことが、グラデーションをすべてのチャートから追放すべき理由にはなりません。適切に構築された連続的なグラデーション——単一の色相で、強度のみが増加するもの、例えば淡い青から深い青まで——は、単一の連続変数に対して実際にその役割を果たし、プロジェクターの光やグレースケール印刷に対しても、多色のレインボーよりもはるかに耐えられます。なぜなら、変化しているのは強度だけで、色相ではないからです。 グラデーションが役に立つのは探索にあり、比較にはありません。大規模なデータセットのクラスタリングを目視で確認するためのヒートマップマトリックスは、10×10のグリッド内の「ホット」な領域が相対的にどこにあるかを把握するのに適しています。これは、視聴者が正確な値を読み取ることを期待しないためです。ヒートマップマトリックステンプレートの多くは、実際の数字を各セルに印刷することで、グラデーションと組み合わせています。色は大まかなパターンをスポットするために使用され、数字が実際の精度を担います。この組み合わせが、正しく使用されたグラデーションの特徴です:色は全体像を、数字は事実を伝えるのです。 グラデーションが失敗するのは、その逆の仕事——特定の2つの値を正確に比較すること、例えば「これらの6つの地域のうち、どれがより速く成長したか」です。これはバーチャートの仕事であり、グラデーションの仕事ではない、なぜならバーチャートは長さを与え、長さはテキストとほぼ同じくらい正確に読み取れる視覚的なエンコーディングの一つだからです。 --- **色の知覚科学を覚えるよりも早いテスト** 次のプレゼンテーションのデッドラインまでに色の知覚科学を覚えることをお勧めしません。より速い直感的なチェックがあります:チャートをグレースケールに変換し、部屋の向こうから眺めてみてください。意味のある違いがある地域がまだ見分けられるなら、グラデーションは実際の情報を伝えています。もしすべてが2つか3つの曖昧なゾーンにぼやけて見えるなら、色は装飾よりも伝達に役立っておらず、小さなセットの明確で名前の付いたカテゴリ、または精度をラベルと数字に委ねる方が良いでしょう。これは、よく構築されたチャートテンプレートがデフォルトで構築する方法と同じです。 最終的に、クライアントのダッシュボードは、地域別の注文量を示すヒートマップスライドではグラデーションを維持し、探索的で適切なものにしました。しかし、理事会が直接比較する必要があるすべての情報については、グラデーションを5つの明確で色覚障害者にチェックされたカテゴリに置き換えました。会議で誰もチャーン率とチケット数を混同することは二度とありませんでした。