{"id":14139,"url":"\/distributions\/14139\/click?bit=1&hash=00b24e988e1dc59bd4663b03b9a768598c65c83e190d2c3c54b8174356d44891","title":"100 000 000 \u0440\u0443\u0431\u043b\u0435\u0439 \u2014 \u043a\u0442\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442 \u0441\u0442\u043e\u043b\u044c\u043a\u043e?","buttonText":"\u0423\u0437\u043d\u0430\u0442\u044c","imageUuid":"5a117d4b-670b-5264-b1c5-3a5825131067"}

Цвет в веб-дизайне и его влияние на целевую аудиторию

Первое, о чем стоит задуматься при создании цветовой схемы любого продукта, будь то посадочная страница, многостраничный сайт, приложение, визуал странички социальной сети или интернет-магазин — это выбор основного акцентного цвета. Белый, черный, серый и их оттенки зачастую используются в качестве базовых и дают нам возможность создавать так называемые «ритм” и »воздух” на странице. Хотя и они, безусловно, могут стать акцентными. Самый яркий, запоминающийся цвет влияет на психику больше всего.

Психологи давно изучили вопросы, связанные с влиянием цвета на восприятие человека и даже умудрились использовать эти знания для создания различных диагностических тестов. А что остается дизайнерам? Пользоваться данными этих исследований и применять на практике.

Красный цвет

Эмоции: возбуждение, опасность, аппетит, стресс.

Плюсы: привлекает внимание больше, чем какой-либо другой цвет.

Минусы: при использовании в больших количествах вызывает переутомление и негативные эмоции.

Применение: только в качестве акцента и в небольшом количестве.

Примеры:

Здесь красный используется намеренно, именно в негативном ключе. Сайт про фильмы ужасов в красном цвете? Это просто гениально!
А вот применение красного в качестве акцентного цвета. Он совсем не давит и воспринимается позитивно. 

Оранжевый цвет

Эмоции: уверенность, успех, общительность.

Плюсы: усиливает концентрацию внимания, более дружелюбен, чем красный. Способствует появлению аппетита.

Минусы: Иногда может вызывать чувство недоверия (баланс между чувством безопасности и угрозы у этого цвета очень шаткий) .

Применение: также подходит только к качестве акцентного цвета, но процент использования выше.

Примеры:

Магазины Home Depot

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

Сайт Фанты

Здесь оттенок более приглушенный и при этом занимает значительно меньше пространства. Эффект гораздо лучше.

Желтый цвет

Эмоции: счастье, удовлетворение, гармония, творчество.

Плюсы: цвет в основе своей “положительный”. Ассоциируется с интеллектом и какой-то творческой деятельностью.

Минусы: может вызывать чувство тревоги, казаться лживым и обманчивым (ассоциация с оградительной лентой, "желтой прессой" и т.д.).

Применение: гораздо шире, чем у красного и желтого, но стоит быть осторожным в контексте.

Примеры:

Приложение SnapChat

Черный с желтым, пожалуй, можно по праву считать классикой дизайна.
Желтый с оттенком ближе к золотому хорошо считывается в комбинации с золотыми монетками. И достаточно узнаваемо.

Зеленый цвет

Эмоции: спокойствие, умиротворение, гармония с природой.

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

Минусы: если цвет “грязный” - ассоциируется с плесенью, затхлостью, грязью.

Применение: очень широкое. Может применяться в качестве базового. Важно следить за чистотой цвета!

Примеры:

Пиво Carlsberg

Довольно интересный ход с наполнением бокала отменным пенным напитком. И зеленый цвет здесь нисколько не вредит)

Консалтинговая компания Altermind

Темно-изумрудный оттенок намекает нам, что компания ориентирована на VIP-клиентов.

Компания по переработке отходов Recycl8

Название+зеленый цвет - 100% попадание в цель. Не нужно знать перевод, чтобы понять о чем здесь пойдет речь.

Синий цвет

Эмоции: доверие, мир, богатство, профессионализм, свежесть.

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

Минусы: при уходе в холодные оттенки - вызывает чувство отчуждения, ощущения хладнокровности.

Применение: чаще можно встретить в медицинской сфере или в люксовых брендах. Важно сохранять цвет “теплым”.

Примеры:

Зубная щетка Орал-Би

Яркий цвет, но при этом не раздражающий глаз. Удивительное свойство синего.

Школа английского языка Skyeng

Цвет супер живой, немного даже детский - как бы говорит нам: "Эй, не бойся, с нами всё легко и просто. Никаких занудных уроков."

Фиолетовый цвет

Эмоции: царственность, амбиции, мистика, богатство.

Плюсы: яркий цвет, привлекает внимание.

Минусы: может казаться инфантильным при использовании в больших количествах. Ориентирован больше на женскую аудиторию.

Применение: только в качестве акцентного цвета.

Примеры:

Неожиданно хорошо и свежо. По сути, это не просто акцентный цвет -  он здесь занимает почти 90% процентов экрана. И не раздражает, смотри-ка.)

Служба доставки Fedex

А вот тут буквально вкрапления фиолетового и яркое сочетание с оранжевым цветом. Удачное решение, выделяет их на фоне конкурентов.

Коричневый цвет

Эмоции: стабильность, традиции, уют, доверие.

Плюсы: цвет шоколада и кофе. Ассоциируется со стариной, книгами и музеями.

Минусы: плохо сочетается с другими цветами, может быть “занудным” в больших количествах.

Применение: удачен в сфере продуктов питания и кофейном производстве, банковской сфере. Осторожно добавляем этот цвет в палитру, помним о его несовместимости со многими другими цветами.

Примеры:

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

Интернет магазин Golden Triangle

Магазин мебели, декора для дома, который крепко ассоциируется с искусством и антиквариатом, что дает нам подсказку о специфике товаров.

Розовый цвет

Эмоции: инфантильность, сладость, наивность, глупость.

Плюсы: снижает уровень агрессии. Привлекает женскую аудиторию.

Минусы: может выглядеть нелепо, если используется вне контекста.

Применение: сайты парфюмерных компаний, женские клубы, детские товары.

Примеры:

Магазин нижнего белья Victoria’s Secret

Узнаваемый бренд, девчачьи цвета и сладкий аромат духов при входе в бутик. Это значит что? Значит, фирменный стиль хорошо продуман.
Несмотря на розовый цвет, бренд не выглядит пошлым или дешевым. Оттенок подобран так, что он больше напоминает бархат или ассоциируется с дорогими тканями. Что еще раз подтверждает: выбор оттенка решает!

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

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

В следующий раз поговорим о цветовых схемах и удобных приложениях для подбора цвета.

See you next week!)

*Все права принадлежат правообладателям.

0
Комментарии
-3 комментариев
Раскрывать всегда
null