データ可視化のための色選び

 (blog.datawrapper.de)
16 ポイント 投稿者 xguru 2020-09-07 | 1件のコメント | WhatsAppで共有

よくある色選びのミスと、その避け方。

例がうまく示されていて見やすく、UI/UX やプレゼン資料を作るときにも役立つ記事

  • カラーホイール全体を使わないこと

  • 彩度と明度を使って色相を表現する

  • 暖色と青を使う

  • 緑を使うときは黄色寄りか青寄りにする

  • 純色は避けること

  • 明るく、彩度の高い色は避けること

  • 明度の異なる色を組み合わせる

  • 似ているが多様な色を活用する

  • 背景とのコントラストが少なすぎたり多すぎたりするのは避けること

  • 色を他からコピーしたり、理解して使う

関連記事

1件のコメント

 
xguru 2020-09-07

最後の項目である色のコピーで紹介されていたツールが便利ですね。（やっぱり Copy & Paste！）

http://tristen.ca/hcl-picker/#/hlc/6/1.05/CAF270/433348 - データ可視化用パレット生成ツール

https://learnui.design/tools/data-color-picker.html#palette - データ用カラーピッカー。開始色と終了色を選ぶと、その間の色を選択してパレットを生成

https://medialab.github.io/iwanthue/ - HUE ベースのパレット生成器

https://colorbrewer2.org/#type=sequential&scheme=BuGn&n=3 - 地図作成＆エリアグラフ用パレットの提案

https://carto.com/carto-colors/ Data-driven color schemes

https://image-color.com/ - アップロードした写真から主要な色を抽出してくれます

https://www.degraeve.com/color-palette/ - アップロードした写真でパレットを生成

https://moviesincolor.com/ - 有名な映画のシーンからパレットを推薦

https://wesandersonpalettes.tumblr.com/ - ウェス・アンダーソンの映画からパレットを推薦