Како да развиете веб-страница, електронска трговија или шеми на бои за апликации

Развијте шеми на бои за веб-страници, електронска трговија или апликации

Споделивме неколку написи за важноста на бојата во однос на брендот. За веб-локација, локација за е-трговија или мобилна или веб-апликација, тоа е исто толку критично. Боите имаат влијание врз:

  • Почетен впечаток за брендот и неговата вредност - на пример, луксузните стоки често користат црно, црвеното подразбира возбуда итн.
  • Одлуки за купување – довербата на брендот може да биде одредена од контрастот на бојата. Шемите на меки бои може да бидат поженствени и доверливи, суровите контрасти може да бидат поитни и попусти.
  • Употребливост и корисничко искуство - боите имаат психолошки и физиолошкото влијание исто така, што го олеснува или потешко навигацијата низ корисничкиот интерфејс.

Колку е важна бојата?

  • 85% од луѓето тврделе дека бојата има големо влијание врз она што го купуваат.
  • Боите го зголемуваат препознавањето на брендот во просек за 80%.
  • Впечатокот на боја е одговорен за 60% од прифаќањето или отфрлањето на производот.

Кога одредувате шема на бои за веб-локација, има неколку чекори детално во придружниот инфографик:

  1. Примарна боја – Изберете боја која одговара на енергијата на вашиот производ или услуга.
  2. Акциони бои – Ова недостасува во инфографикот подолу, но идентификувањето на примарна акциона боја и секундарна акциона боја е исклучително корисно. Ја едуцира вашата публика да се фокусира на одредени елементи на корисничкиот интерфејс врз основа на бојата.
  3. Aдополнителни бои – Изберете дополнително бои кои се надополнуваат вашата примарна боја, идеално боите што ја прават вашата примарна боја поп.
  4. Бои во позадина – Изберете боја за позадината на вашата веб-локација – можеби помалку агресивна од вашата примарна боја. Имајте на ум и во темни и светли режими.. се повеќе сајтови инкорпорираат шеми на бои на светол или темни режим.
  5. Бои на фонт – Изберете боја за текстот што ќе биде на вашата веб-локација – запомнете дека цврстата црна буква е ретка и не се препорачува.

Како пример, мојата компанија Highbridge разви онлајн бренд за производител на фустани кој сакаше да изгради веб-страница за е-трговија директно до потрошувачите каде што луѓето ќе можат купувајте фустани преку Интернет. Ја разбравме нашата целна публика, вредноста на брендот и – бидејќи брендот беше претежно дигитален, но имаше и физички производ – се фокусиравме на шеми на бои кои функционираат добро на печатење (CMYK), палети за ткаенина (Pantone), како и дигитален (RGB и Hex).

Тестирање шема на бои со истражување на пазарот

Нашиот процес за избор на шема на бои беше интензивен.

  1. Направивме маркетинг истражување за серија основни бои со нашата целна публика што нè сведе на една боја.
  2. Направивме маркетинг истражување за серија секундарни и терцијарни бои со нашата целна публика, каде што ги намаливме некои шеми на бои.
  3. Направивме макети на производи (пакување производи, вратни ознаки и висечки ознаки), како и макети за е-трговија со шеми на бои и им ги дадовме на клиентот, како и на целната публика за повратни информации.
  4. Бидејќи нивниот бренд беше во голема мера зависен од сезонската, ние исто така вградивме сезонски бои во мешавината. Ова може да биде корисно за специфични колекции или визуелни слики за реклами и споделувања на социјалните медиуми.
  5. Поминавме низ овој процес повеќе од половина дузина пати пред да се решиме на конечната шема.

плакарот52 шема на бои

Додека боите на брендот се светло розеви и темно сиви, ние го развивме акциони бои да биде нијанса на зелена боја. Зелената е боја ориентирана кон акција, така што беше одличен избор да ги привлечеме очите на нашите корисници кон елементите ориентирани кон акција. Ја вградивме инверзната зелена боја за нашите секундарни дејства (зелена граница со бела позадина и текст). Ние, исто така, тестираме потемна нијанса на зелена боја на акционата боја за дејства за лебдење.

Откако штотуку ја лансиравме страницата, вградивме следење на глувчето и мапи за топлина за да ги набљудуваме елементите кон кои нашите посетители се привлечени и со кои најмногу комуницираат за да се осигураме дека имаме шема на бои што не само што изгледа добро... таа работи добро.

Бои, бел простор и карактеристики на елементите

Развивањето шема на бои секогаш треба да се постигне со тестирање во целокупниот кориснички интерфејс за да се набљудува интеракцијата на корисниците. За горната локација, вградивме и многу специфични маргини, облоги, контури, радиуси на границите, иконографија и фонтови.

Испорачавме целосен водич за брендирање за компанијата да го дистрибуира внатрешно за какви било материјали за маркетинг или производ. Конзистентноста на брендот е од клучно значење за оваа компанија бидејќи тие се нови и немаат никаква свест во индустријата во овој момент.

Еве ја добиената страница за е-трговија со шема на бои

  • Closet52 - Купете фустани онлајн
  • Страна со збирки Closet52
  • Страна со производ Closet52

Посетете го Closet52

Употребливост на бои и слепило во боја

Не заборавајте за тестирање на употребливост за контраст на бои низ елементите на вашата страница. Можете да ја тестирате вашата шема користејќи го Алатка за тестирање на пристапност на веб-страница. Со нашата шема на бои, знаеме дека имаме некои проблеми со контрастот на кои ќе работиме по патот, или можеби имаме некои опции за нашите корисници. Интересно, шансите за проблеми со бојата кај нашата целна публика се прилично мали.

Далтонизмот е неможност да се согледаат разликите помеѓу некои од боите што можат да ги разликуваат корисниците со оштетен вид без боја. Далтонизмот влијае на околу пет до осум проценти од мажите (приближно 10.5 милиони) и помалку од еден процент од жените.

Употребливост.gov

Тимот на WebsiteBuilderExpert го состави овој инфографик и детална придружна статија за Како да изберете боја за вашата веб-страница тоа е крајно темелно.

Како да изберете шема на бои за вашата веб-страница