Цветовые схемы для визуализации данных (HEX-коды, sketch-файл и палитра)

Tatiana Cherniavskaia
2 min readNov 13, 2017

--

Sketch-файл со всеми цветовыми схемами, HEX-кодами цветов и настроенной палитрой Document Colors

Перед каждой новой задачей по визуализации данных испытываю творческие муки при подборе цветовых схем. Какие цвета выбрать для диаграмм, dash-board-ов и инфографики, чтобы решение выглядело стильно, смысловые блоки четко различались, а общая картинка не вызывала боли в глазах?

На сайте платформы визуализации гео-данных CARTO увидела цветовые схемы, подходящие под разные задачи и данные:

Sequential schemes (последовательные) — подходят для визуализации возрастания или убывания измеряемой величины, например, степени лояльности пользователей сервиса. От цвета к цвету меняются яркость и/или насыщенность и иногда тон (в рамках родственных цветов).

Sequential (последовательные) схемы

Diverging schemes (расходящиеся) — подходят для визуализации среднего значения и полюсов измеряемой величины, например нейтральной и положительной / отрицательной оценки. От центра схемы в стороны меняется тон и увеличиваются яркость и/или насыщенность цвета. В итоге на разных полюсах палитры получаются дополнительные цвета.

Diverging (расходящиеся) схемы

Qualitative schemes (количественные) — подходят для визуализации отдельных категорий. Цвета разные по тону, есть более или менее насыщенные и яркие варианты.

Qualitative (количественные) схемы

На странице Data-driven color schemes сайта CARTO можно рассмотреть палитры поближе и скопировать HEX-коды цветов любой из понравившихся схем.

Для удобства использования сделала sketch-файл с палитрами и HEX-кодами цветов (скриншоты в заметке сделаны с этого файла). А также sketch-палитру со всеми цветами, которую можно загрузить в sketch-файл с помощью плагина Sketch Palettes (скачать плагин на GitHub). Плагин прост в использовании, почитать о нем можно в статье на сайте sketchapp.me — Плагин для работы с палитрой цветов Sketch Palettes.

--

--

Tatiana Cherniavskaia

Designer (UX, product), Researcher, Analyst (business, product)