配色、アクセシビリティ、アノテーション

🔄 前回のおさらい: レッスン5でダッシュボードの情報ヒエラルキーと5秒テストを学びました。ここでは配色、アクセシビリティ、アノテーションでチャートの伝達力を高めます。

配色の原則

効果的な配色パレット

アクセシビリティ

• 色覚多様性：男性の約8%が赤-緑色覚異常
• 対策1：色＋パターンの併用
• 対策2：色＋ラベル・数値の併用
• 対策3：青-オレンジなどの安全なパレット
• テスト：グレースケールでも判読可能か確認

アノテーションの技法

チャートに直接コンテキストを記載する：

• ポイント注釈：特定データポイントに説明（「新製品発売」）
• 範囲注釈：期間を示す帯（「COVID-19期間」）
• トレンドライン注釈：傾向の変化点に説明
• 目標ライン：KPI目標を水平線で表示

良いアノテーションの条件

• 簡潔（2〜5語）
• データポイントに近い位置
• チャートの主メッセージを補強

✅ 確認クイズ: 虹色のカラーパレット（赤→橙→黄→緑→青→紫）がデータ可視化で推奨されない理由は？→虹色は直感的な順序がなく（緑は赤より「多い」？）、色覚多様性のあるユーザーに判読が困難で、白黒印刷時に完全に情報が失われます。単色のグラデーションが連続値には最適です。

まとめ

• 赤-緑カラーコーディングは男性の約8%に判読困難——青-オレンジなどの安全な代替を使用
• 1チャートの色は最大5〜7色——それ以上はグループ化やトップN強調で対応
• アノテーションで異常値やトレンドにコンテキストを提供——閲覧者がデータの意味を即座に理解
• グレースケールでも判読可能なデザインがアクセシビリティの基本

次のレッスン： インタラクティブ可視化とプレゼンテーション——インタラクティブ機能の適切な活用とデータプレゼンのコツを学びます。