Как подобрать цвета для сайта

Тема оказалась актуальнее, чем я изначально предполагала. Не только у джунов, но и уже у немного опытных дизайнеров. 

Видимо главный затык заключается в том, что подборка цвета не представляется чем-то существенным или сложным. Все мы умеет подбирать цвета с детства и не считаем это наукой, а потом и относимся немного наплевательски. 

Сразу хочу сказать, что это далеко не так и без грамотно подобранных цветов ни че то у вас не выйдет, лучата, вот так, цвет зарешал. Даже совсем незаметная на первый взгляд замена цвета может кардинально изменить впечатление пользователя на вообще весь проект. 

Другой вопрос, как исследовать этот момент. Чтобы провести глубинное исследование необходимо проводить опросы-тысячники у целковиков, что в реалиях практически невозможно. Поэтому не рекомендую вам романтизировать эту тему, лучше использовать прикладные способы о которых я вам сейчас и расскажу. 

1 шаг

Анализ аналогов разумеется.

Итак, все мы знаем, что первый шаг у любого исследования это анализ аналогов и сейчас тоже не исключение. 

Открываем первые 15 сайтов топа яндекса смежной тематики и анализируем, выписываем все цвета, которые используют другие. Прям прописываем сколько раз, какой цвет, чтобы создать свой топ. 

Часто такое бывает, что конкуренты использует цвет, который по вашему мнений вообще никак с темой не вяжется, не упускаем эти моменты, все фиксируем. 

В итоге у вас должна получиться подборка цветов, со скриншотами сайтов-конкурентов. Все сохраняйте, вы сможете эти данные использовать при презентации своего дизайна, чтобы аргументировать свою точку зрения перед заказчиком. 

2 шаг

Опрос дружбанов и мамашек.

Если вы работаете не в офисе, а дома, то можно просто спросить у своих ближних, что они думают. Только не предлагайте им варианты, просто назовите тему и предложите им назвать первую цветовую ассоциацию. В офисе, конечно, это сделать проще. Тут будет достаточно всего пары мнений, внесите их в свой цветовую таблицу. 

Таким образом у вас должны появиться 1-2 лидера, это есть титулованный счастливчики. 

Если у заказчика есть мнение, то лучше ориентироваться на него, потому что в итоге он все равно вас заставит свое мнение оживить. 

3 шаг

Добор цветов 

Редко, когда одного цвета достаточно, обычно нужно 2 или даже 3, больше я не рекомендую использовать, а то будет чунга-чанга. Итак, как же подобрать эти добавочные цвета, ну ясно ж на глаз! Ага, ни за что, не смейте этого делать. Еще раз напишу, подбор цвета - это важнейший шаг при разработке дизайна, никогда нельзя им пренебрегать и что-то хреначить на свой глаз.

Так вот никаких вам спектральных кругов тоже. Они в жизни не помогут и вообще на web не ориентированы. Вот что вам может помочь так это дрибл, чуваки реально все сделали для вас. 

Список действий:

1. Открываете поиск по дриблу, вкладка web-дизайн
2. Жмете на фильтр, открываются доп кнопки
3. Выбираете свой ключевой цвет 
4. Смотрите все подборки дрибла с вашим цветом
5. Выбираете самую подходящую из топа ваших цветов, с пропорциями чтобы основного цвета было больше других
6. Выбираете 2-3 красивых цветовых топовых рефа, только не каких-то no name, нужны рефы именно в топе
7. Вставляете их скрины к себе в фигму
8. Пипеткой цепляете цвета, вообще все и фона, и шрифта, и все дополнительные цвета 
9. У вас не должно остаться ни одного цвета не из выбранного рефа, это должна быть полностью цветовая копия с сохранением пропорций цвета 
10. Делаете 2-3 варианта с помощью разных рефов 

Напишите мне, большое спасибо, теперь у меня красивые цвета!

Да не за что..