Почему Facebook синий, и какое значение имеет цвет в маркетинге, дизайне и продвижении

https://medium.com/@hemeon/the-button-test-77eb4f9a439d
https://medium.com/@hemeon/the-button-test-77eb4f9a439d
Поче­му Facebook и ссыл­ки в Интер­не­те синие? Какие эмо­ции у нас вызы­ва­ют раз­ные цве­та, и как мож­но эффек­тив­нее исполь­зо­вать их в вашей рабо­те?

Поче­му Facebook синий?

The New Yorker дает на этот вопрос очень про­стой ответ: Марк Цукер­берг, созда­тель этой соци­аль­ной сети, пло­хо раз­ли­ча­ет крас­ные и зеле­ные цве­та, что дела­ет синий тем цве­том, кото­рый Марк видит луч­ше все­го:

«Синий – самый насы­щен­ный цвет для меня, я могу раз­ли­чить мно­же­ство его оттен­ков».

Конеч­но, это не очень похо­же на науч­ный под­ход к выбо­ру цве­та. Но давай­те отвле­чем­ся от Facebook и посмот­рим на дру­гие при­ме­ры того, как цвет вли­я­ет на наш выбор про­дук­тов или сер­ви­сов.

Зре­ние – одно из самых силь­ных наших чувств, на 90% опре­де­ля­ю­щее наше жела­ние попро­бо­вать какой-либо про­дукт. Итак, как цве­та исполь­зу­ют­ся в мар­ке­тин­ге?

Можете ли вы определить бренд по цветам?

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

При­мер 1 (лег­кий):

При­мер 2 (лег­кий):

Пример 2
При­мер 2

При­мер 3 (сред­ний):

Пример 3
При­мер 3

При­мер 4 (слож­ный):

Пример 4
При­мер 4

Эти при­ме­ры от дизай­не­ра из YouTube (Marc Hemeon) демон­стри­ру­ют, насколь­ко силь­но у нас рабо­та­ют ассо­ци­а­ции, свя­зан­ные с цве­том. Сколь­ко брен­дов вы смог­ли уга­дать? Пра­виль­ные отве­ты вы може­те най­ти в кон­це это­го поста.

Какие чувства у нас вызывают разные цвета?

Каж­дый цвет вызы­ва­ет у нас ту или иную эмо­цию. The Logo Company про­ве­ли иссле­до­ва­ние и выяс­ни­ли, для чего луч­ше все­го под­хо­дят раз­ные цве­та. Напри­мер:

Чер­ный:

Свойства черного цвета
Свой­ства чер­но­го цве­та

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

Зеле­ный: 

Свойства зеленого цвета
Свой­ства зеле­но­го цве­та

Свой­ства: ней­траль­ный, орга­ни­че­ский, обра­зо­ва­ние, при­клю­че­ния, эко­ло­гия, спо­кой­ствие, при­ро­да.
Под­хо­дит для меди­ци­ны, нау­ки, пра­ви­тель­ства, эко­ло­ги­че­ско­го биз­не­са, туриз­ма, HR.

Синий:

Свойства синего цвета
Свой­ства сине­го цве­та

Свой­ства: надеж­ность, спо­кой­ствие, чисто­та, про­фес­си­о­на­лизм, меди­ци­на, власть, биз­нес.
Под­хо­дит для меди­ци­ны, нау­ки, пра­ви­тель­ства, здра­во­охра­не­ния, IT, кор­по­ра­ций.

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

Цвета логотипов известных брендов
Цве­та лого­ти­пов извест­ных брен­дов

Как использовать цвета?

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

Если вы созда­е­те про­дукт или при­ло­же­ние, ори­ен­ти­ро­ван­ное на жен­щин, вам сле­ду­ет учесть, что:

Жен­щи­ны любят синий, фио­ле­то­вый и зеле­ный.
Жен­щи­ны не любят оран­же­вый, корич­не­вый и серый.

Как женщины относятся к разным цветам
Как жен­щи­ны отно­сят­ся к раз­ным цве­там

Если же целе­вая ауди­то­рия ваше­го при­ло­же­ния – муж­чи­ны, то ситу­а­ция с цве­та­ми будет иной:

Муж­чи­ны любят синий, зеле­ный и чер­ный.
Муж­чи­ны не любят корич­не­вый, оран­же­вый и фио­ле­то­вый.

Как мужчины относятся к разным цветам
Как муж­чи­ны отно­сят­ся к раз­ным цве­там

В дру­гом экс­пе­ри­мен­те HubSpot реши­ли выяс­нить, как цвет кноп­ки вли­я­ет на кон­вер­сию сай­та.

Они нача­ли с выбо­ра меж­ду дву­мя цве­та­ми – зеле­ным и крас­ным. Гипо­те­за для зеле­но­го зву­ча­ла так: «Зеле­ный – это «нату­раль­ный» цвет, цвет «окру­жа­ю­щей сре­ды».

Зеле­ный исполь­зу­ет­ся в све­то­фо­рах и пред­по­ла­га­ет «дви­же­ние впе­ред».

Для крас­но­го цве­та гипо­те­за была сле­ду­ю­щая:

«Крас­ный цвет ассо­ци­и­ру­ет­ся со стра­стью, кро­вью и пре­ду­пре­жде­ни­ем. Крас­ный пере­да­ет сиг­нал «стоп», а так­же при­вле­ка­ет к себе мно­го вни­ма­ния».

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

А/В-тестирование кнопок разного цвета
А/В-тести­ро­ва­ние кно­пок раз­но­го цве­та

Резуль­тат экс­пе­ри­мен­та ока­зал­ся неожи­дан­ным – крас­ная кноп­ка по уров­ню кон­вер­сии пре­взо­шла зеле­ную кноп­ку на 21%.

Не счи­тая цве­та кноп­ки, все осталь­ное на сай­те оста­ва­лось преж­ним. Тем не менее посе­ти­те­ли сай­та кли­ка­ли на крас­ную кноп­ку зна­чи­тель­но чаще.

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

И последнее: почему ссылки синие?

Вопрос о том, поче­му ссыл­ки синие, име­ет доста­точ­но про­стое и забав­ное объ­яс­не­ние. Ссыл­ки сине­го цве­та пото­му, что этот цвет дает доста­точ­но кон­тра­ста на сером фоне сай­тов:

Дизайн старого сайта
Дизайн ста­ро­го сай­та

Пол­но­стью исто­рия зву­чит так.

Тим Бер­нерс-Ли, чело­век, кото­рый изоб­рел Веб, счи­та­ет­ся пер­вым, кто сде­лал ссыл­ки имен­но сине­го цве­та. Самый пер­вый бра­у­зер под назва­ни­ем Mosaic отоб­ра­жал все веб-стра­ни­цы с серым (ужас­ным) фоном и чер­ным тек­стом на этом фоне. Самый тем­ный цвет, доступ­ный на тот момент и отли­ча­ю­щий­ся от серо­го и чер­но­го, был синий. Что­бы ссыл­ки отли­ча­лись от основ­но­го чер­но­го тек­ста и были при этом чита­е­мы­ми, их сде­ла­ли сини­ми.

Про­стое изме­не­ние одно­го цве­та может вли­ять на то, как вос­при­ни­ма­ют ваш бренд и на посе­ща­е­мость ваше­го ресур­са. Если у вас есть при­ме­ры того, как выбран­ный вами цвет помог вам (или наобо­рот), при­гла­ша­ем поде­лить­ся ими с нами в ком­мен­та­ри­ях.

Раз­гад­ка к тек­сту про цве­та брен­дов: При­мер 1: Facebook; При­мер 2: Google; При­мер 3: Flickr; При­мер 4: LinkedIn.

По мате­ри­а­лам: Buffer, te-st.ru, newreporter.org.