Цвета взаимодействуют друг с другом, меняя наше восприятие
Теория цвета Джозефа Альберса, изложенная в книге "Взаимодействие цвета", подчеркивает, как важны контекст и восприятие, когда мы говорим о цвете в дизайне.
Альберс утверждает, что цвет меняется в зависимости от окружения, и понимание этого принципа критично для UX/UI.
Яркие, насыщенные цвета, такие как неоновый розовый или оранжевый, могут вызывать перегруженность восприятия, провоцируя раздражение. Именно из-за таких влияний люди часто меняют окраску стен, даже если они не нуждаются в ремонте — это интуитивное стремление к созданию комфортной психологической среды.
Психология цвета: светлые, темные и яркие оттенки
Цвет имеет мощное влияние на психофизическое состояние пользователя. Светлые цвета, такие как белый и пастельные оттенки, бодрят и способствуют ясности ума. Темные цвета, такие как темно-синий и черный, успокаивают и создают атмосферу уюта, которая может навеивать сон. Излишне яркие цвета вызывают напряжение и раздражение.
Согласно Мортону Уокеру, цвет способен изменить настроение, влияя даже на поведение игроков в спортивной игре.
Например, красные оттенки повышают уровень энергии, что может помочь выиграть спортивное соревнование, а мягкие синие успокаивают и могут использоваться для снижения агрессии.
Удачные комбинации цветов
Исследования говорят о максимальном количестве — пяти — цветов, воспринимаемом человеком. Но это зависит от сложности изображения. Оптимальное же количество цветов в интерфейсе — не более трех-четырех.
- Рядом расположенные цвета на цветовом круге (например, голубой и зеленый) создают гармоничное и спокойное восприятие. Например, синий, голубой и зеленый — их использование подходит для спокойных и естественных дизайнов, позволяя достигать визуального единства.
- Цветовые триады, такие как красный, синий и желтый, придают динамичность и энергию.
- Квадраты цветового круга предлагает более сложные комбинации, такие как оранжевый, зеленый, фиолетовый и синий, создавая живую и креативную палитру.
Фон и предмет
Для фона лучше подходят холодные оттенки, а для передних планов — теплые.
Серый цвет служит нейтральным фоном, который может усиливать или смягчать восприятие других цветов. Он хорошо работает в сочетаниях, где требуется сбалансировать яркость и насыщенность. Серый позволяет акцентировать внимание на контенте, не отвлекая внимание пользователя.
Кстати, насыщенность цвета зависит от объема серого в основном цвете. Чем меньше серого, тем насыщеннее цвет.
Белый цвет символизирует чистоту и минимализм. В UX/UI он используется для создания пространственного ощущения и облегчения восприятия контента.
Яркость определяется процентом белого— тем ярче, чем больше белого.
Цвет в брендинге
Apple и серый цвет
Примером служит рекламная кампания Apple, использующая белый и серый цвета для передачи идеи простоты и инноваций, что подчеркивает технологическую передовую и стилистическую чистоту бренда.
McDonald's и красно-желтый цвет
McDonald's используtт красный и жёлтый для стимулирования аппетита и создания ощущения радости и энергии, опираясь на знания о психологическом воздействии цветов.
Предостережения
🚩 Совмещая насыщенные цвета проявляйте осторожность — насыщенность утомляет.
🚩Учтите символизм цвета в культуре. Желтый цвет у детей ассоцируется с солнцем, а вот у санитарок в госпитале желтый цвет — триггер (для ухаживающего персонала желтизна ассоциируется со сменой белья лежачего больного).
🚩 Не используйте черно-белое для ближайших событий и дешевых товаров. В оттенках серого мы представляем себе далекие события (напр., следующую Олимпиаду). Серый цвет связан не только с хронологией. Что-то доступное кажется нам насыщеннее. Отсюда и дорогие бренды часто выбирают ч/б для рекламы продуктов. Для рекламы майонеза лучше выбирать изображения с максимальной насыщенностью.
Подписывайтесь на новый канал
Запустили канал в Телеграме RE: marketing, где ежедневно делимся тактиками повышения конверсии сайта. Уже опубликовали >149 полезных техник, а впереди — заготовки на >100 постов.
Для подписчиков есть возможность бесплатно заказать юзабилити-аудит в формате экспресс-анализа. Успейте заказать, предложение ограничено загрузкой специалистов.
Источники
- Дж. Альберс. Взаимодействие цвета M.: КоЛибри, 2017,
- И. Иттен, Искусство цвета. М.: Издатель Дмитрий Аронов, 2018.
- Jenny Preece, et al. Human: Computer Interaction, Addison-Wesley, 1994.
- Morton Walker. The Power of Color, Avery Publishing, 1991.