Один из самых простых способов заставить свой фейк-дизайн работать – это грамотно работать с цветовой палитрой. Все же знают, что цвета играют огромную роль в рекламной кампании, вызывают у пользователей приступы определенных эмоций и писали слово «распродажа» большими красными буквами? Райян Маккреди (Ryan McCready) рассказал, как на протяжении уже трех лет пускает всем пыль в глаза и мимикрирует под про на самом сложном примере – составлении инфографик. Ну, что, посмотрим что-ли?
Когда ты начинаешь делать новый креатив, сайт или инфографику, то, возможно, хочешь покончить с этим поскорее. Но, если ты выходишь на старт без Продуманного Плана, то в итоге получается либо:
Только посмотри на эти куски инфографики ниже. Мало того, что они врут, как сивый мерин, они еще и полностью облажались с цветами. Казалось бы, раз уж мы говорим про политические партии, то с палитрой даже выбор не стоит – республиканцы красненькие, демократы синенькие. Вторая же часть, она в прямом смысле про цвета – вот синий, красный зеленый, все остальные… но дизайнеры, настоящие креативные дизайнеры, решили соригинальничать и выбрали самый скучный пень во всем мире: вот такой латентный серый.
В общем, не будь таким дизайнером. Есть миллионы цветов, которые можно использовать. Причем буквально миллионы – целых 16 777 216 оттенков. А серые и черные вообще даже не цвета, так что, если они остались наедине, то тут уже пахнет тоской и отчаянием.
Это один из самых простых приемов, который почему-то часто упускают из виду, особенно новички. Если мы имеем на руках уже проверенные цвета бренда, которые прописаны в брендбуке, активно использовались в официальных промо, испытаны в битве и закалены временем, то не нужно изобретать велосипед – берем пипетку и стрил+с-стрил+в на свои творения. Вот, например, инфографика L2Inc о Snapchat, которая извращается над желтым из их логотипа. А главное, сразу понятно, о чем речь: либо потребление сыра, либо снапчатец.
Наверняка ты хочешь, чтобы твой потрясающий дизайн привлекал внимание пользователей, производил впечатление и отпечатывался в мозгу. Но мы тут собрались не для того, чтобы обсуждать шокирующие тенденции в рекламе. Мы здесь для того, чтобы донести до аудитории твой рекламный посыл, рассказать историю и, конечно же, продавать. Если цвета этому мешают, надо менять. А то получится, как в анти-примерной инфографике ниже: отвлекает, сводит с ума, ничего не понятно, пойду покурю.
Вот такая куча маленьких штук в 7 ярких цветах вообще ничего никому не говорит. Если честно, даже 50 оттенков серого выглядели бы лучше, потому что помогли бы сфокусироваться на самой большой секции, о которой идет весь разговор. Эх, судьба писателей…
Вот самый простой лайфхак, который поможет тебе слепить что-то красивое, приличное и органичное бесплатно, без регистрации и смс. Итак, записывай рецепт: в первую очередь тебе понадобится базовый цвет – например, в случае ниже это голубой #93BEDF. Берем цветовой код, ставим его в микроволновку и вуаля – всего через секунду ты получаешь 20 красивых, замечтательных и самых разных цветов, которые превосходно сочетаются друг с другом в любом порядке.
Довольно частая ошибка, с которой часто сталкиваются недодизайнеры в начале своей псевдо-дизайнерской карьеры – это желание сделать каждый кусок своей визуализации уникальным, вычурным и вау. Но, так как мы собрались здесь не для того, чтобы обсуждать шокирующие тенденции в рекламе (см. п. 3), ПОСЛЕДОВАТЕЛЬНОСТЬ ВАЖНЕЕ УНИКАЛЬНОСТИ. Сохраняя последовательность, ты также делаешь свой дизайн простым и аккуратным. И, если ты даже не ходил в художку в детстве, то должен добиваться простоты и аккуратности любой ценой.
Кстати, ты заметил, что в примерах стало слишком много сине-голубого? Дело в том, что синий очень универсальный цвет, который дарит ощущение траста и стабильности, а также выглядит очень чисто и профессионально даже на простом белом фоне. Но самое главное, если ты нашел какой-то свой цвет, с которым любишь работать, и видишь, что он смотрится реально классно, то можешь сохранить его в коллекцию и бессовестно юзать раз за разом, избавляя себя от мук творчества.
Цветовой круг может казаться пугающим (нет), но на самом деле он твой главный друг, товарищ и помощник, когда дело касается подбора цветов. Учитывая количество доступных инструментов для составления мольбертов, старый-добрый круг может показаться технологически отсталым, но контекст тоже воспринимают, как прошлый век, тем не менее, все им пользуются и все довольны. И конечно, не стоит забывать, что нынешние колеса, как и видавший вид контекст, идут в ногу со временем.
Итак, если ты хотя бы смутно помнишь школьную программу, то наверняка в курсе, что есть три основных способа найти гармоничное сочетание цветов. Конечно, есть еще несколько, но эти три самые простые, надежные и классика:
Во-первых, одноцветное или монохромное сочетание, когда мы используем разные тона одного цвета – мы о нем уже говорили.
Во-вторых, последовательное сочетание или аналогичная триада – берем 3 цвета, которые находятся рядом друг с другом на колесе.
И в-третьих, комплементарное сочетание или дополнительные цвета – берем 2 противоположных цвета, которые лежат друг напротив друга.
Как ты помнишь цвета играют огромную роль в рекламной кампании, вызывают у пользователей приступы определенных эмоций и множество смысловых ассоциаций. Другими словами, когда ты добавляешь те или иные краски, то не только задаешь настроение и гонишься за гармонией, но и негласно высказываешь свою позицию, считаясь с определенными правилами игры. Ну, наверняка все видели вот эту инфографику. Да? ДА?
Поэтому, когда мы говорим о развитии, росте, деньгах и экологии – что может быть лучше зеленого?
А если речь зашла о реальных аккаунтах твиттера и фейках, то боты всегда будут красными стоп-сигналами.
А если ты сравниваешь Twitter со Snapchat… но в примере ниже дизайнер явно что-то не уловил, да.
1. Adobe Color ---> https://color.adobe.com/ и Paletton ---> http://paletton.com/
2. ColorCodeHex ---> https://www.colorcodehex.com/
3. Coolors ---> https://coolors.co/
4. Material UI Сolors ---> http://materialuicolors.co/
5. BrandColors ---> https://brandcolors.net/
Перед тем, как начнем
Когда ты начинаешь делать новый креатив, сайт или инфографику, то, возможно, хочешь покончить с этим поскорее. Но, если ты выходишь на старт без Продуманного Плана, то в итоге получается либо:
- негармоничный бардак – приходится все переделывать/кампания не цепляет взгляд, не трогает души людей и не выжимает все ROI, на которое потенциально способна;
- лишняя трата времени – то есть в итоге ты тратишь больше времени на попробовать-так-попробовать-сяк, чем если бы пошел пить чай и за 5 минут раскидал все на бумажке. В общем, планируй, пей хороший чай и ешь орехи. А, чтобы не было так грустно, вот тебе 30 цветовых схем для вдохновения, которые не стыдно юзать на людях. А теперь к делу.
Не используй вот такие цвета
Только посмотри на эти куски инфографики ниже. Мало того, что они врут, как сивый мерин, они еще и полностью облажались с цветами. Казалось бы, раз уж мы говорим про политические партии, то с палитрой даже выбор не стоит – республиканцы красненькие, демократы синенькие. Вторая же часть, она в прямом смысле про цвета – вот синий, красный зеленый, все остальные… но дизайнеры, настоящие креативные дизайнеры, решили соригинальничать и выбрали самый скучный пень во всем мире: вот такой латентный серый.
В общем, не будь таким дизайнером. Есть миллионы цветов, которые можно использовать. Причем буквально миллионы – целых 16 777 216 оттенков. А серые и черные вообще даже не цвета, так что, если они остались наедине, то тут уже пахнет тоской и отчаянием.
Лучше используй цвета бренда
Это один из самых простых приемов, который почему-то часто упускают из виду, особенно новички. Если мы имеем на руках уже проверенные цвета бренда, которые прописаны в брендбуке, активно использовались в официальных промо, испытаны в битве и закалены временем, то не нужно изобретать велосипед – берем пипетку и стрил+с-стрил+в на свои творения. Вот, например, инфографика L2Inc о Snapchat, которая извращается над желтым из их логотипа. А главное, сразу понятно, о чем речь: либо потребление сыра, либо снапчатец.
Не позволяй цветам отвлекать от смысла
Наверняка ты хочешь, чтобы твой потрясающий дизайн привлекал внимание пользователей, производил впечатление и отпечатывался в мозгу. Но мы тут собрались не для того, чтобы обсуждать шокирующие тенденции в рекламе. Мы здесь для того, чтобы донести до аудитории твой рекламный посыл, рассказать историю и, конечно же, продавать. Если цвета этому мешают, надо менять. А то получится, как в анти-примерной инфографике ниже: отвлекает, сводит с ума, ничего не понятно, пойду покурю.
Вот такая куча маленьких штук в 7 ярких цветах вообще ничего никому не говорит. Если честно, даже 50 оттенков серого выглядели бы лучше, потому что помогли бы сфокусироваться на самой большой секции, о которой идет весь разговор. Эх, судьба писателей…
Лучше используй различные тона одного цвета
Вот самый простой лайфхак, который поможет тебе слепить что-то красивое, приличное и органичное бесплатно, без регистрации и смс. Итак, записывай рецепт: в первую очередь тебе понадобится базовый цвет – например, в случае ниже это голубой #93BEDF. Берем цветовой код, ставим его в микроволновку и вуаля – всего через секунду ты получаешь 20 красивых, замечтательных и самых разных цветов, которые превосходно сочетаются друг с другом в любом порядке.
Сохраняй последовательность
Довольно частая ошибка, с которой часто сталкиваются недодизайнеры в начале своей псевдо-дизайнерской карьеры – это желание сделать каждый кусок своей визуализации уникальным, вычурным и вау. Но, так как мы собрались здесь не для того, чтобы обсуждать шокирующие тенденции в рекламе (см. п. 3), ПОСЛЕДОВАТЕЛЬНОСТЬ ВАЖНЕЕ УНИКАЛЬНОСТИ. Сохраняя последовательность, ты также делаешь свой дизайн простым и аккуратным. И, если ты даже не ходил в художку в детстве, то должен добиваться простоты и аккуратности любой ценой.
Советуем почитать —
Чему Netflix может научить нас о низкочастотных ключевых словах с длинным хвостом
Кстати, ты заметил, что в примерах стало слишком много сине-голубого? Дело в том, что синий очень универсальный цвет, который дарит ощущение траста и стабильности, а также выглядит очень чисто и профессионально даже на простом белом фоне. Но самое главное, если ты нашел какой-то свой цвет, с которым любишь работать, и видишь, что он смотрится реально классно, то можешь сохранить его в коллекцию и бессовестно юзать раз за разом, избавляя себя от мук творчества.
Не бойся цветового круга
Цветовой круг может казаться пугающим (нет), но на самом деле он твой главный друг, товарищ и помощник, когда дело касается подбора цветов. Учитывая количество доступных инструментов для составления мольбертов, старый-добрый круг может показаться технологически отсталым, но контекст тоже воспринимают, как прошлый век, тем не менее, все им пользуются и все довольны. И конечно, не стоит забывать, что нынешние колеса, как и видавший вид контекст, идут в ногу со временем.
Итак, если ты хотя бы смутно помнишь школьную программу, то наверняка в курсе, что есть три основных способа найти гармоничное сочетание цветов. Конечно, есть еще несколько, но эти три самые простые, надежные и классика:
Во-первых, одноцветное или монохромное сочетание, когда мы используем разные тона одного цвета – мы о нем уже говорили.
Во-вторых, последовательное сочетание или аналогичная триада – берем 3 цвета, которые находятся рядом друг с другом на колесе.
И в-третьих, комплементарное сочетание или дополнительные цвета – берем 2 противоположных цвета, которые лежат друг напротив друга.
Не забывай о теме и цели
Как ты помнишь цвета играют огромную роль в рекламной кампании, вызывают у пользователей приступы определенных эмоций и множество смысловых ассоциаций. Другими словами, когда ты добавляешь те или иные краски, то не только задаешь настроение и гонишься за гармонией, но и негласно высказываешь свою позицию, считаясь с определенными правилами игры. Ну, наверняка все видели вот эту инфографику. Да? ДА?
Поэтому, когда мы говорим о развитии, росте, деньгах и экологии – что может быть лучше зеленого?
А если речь зашла о реальных аккаунтах твиттера и фейках, то боты всегда будут красными стоп-сигналами.
А если ты сравниваешь Twitter со Snapchat… но в примере ниже дизайнер явно что-то не уловил, да.
И напоследок: полезные инструменты в библиотеку
1. Adobe Color ---> https://color.adobe.com/ и Paletton ---> http://paletton.com/
2. ColorCodeHex ---> https://www.colorcodehex.com/
3. Coolors ---> https://coolors.co/
4. Material UI Сolors ---> http://materialuicolors.co/
5. BrandColors ---> https://brandcolors.net/