Kako razviti spletno mesto, e-trgovino ali barvne sheme aplikacij

Razvijte spletno mesto, e-trgovino ali barvne sheme aplikacij

Delili smo kar nekaj člankov o pomenu barve glede na blagovno znamko. Za spletno mesto, spletno mesto za e-trgovino ali mobilno ali spletno aplikacijo je prav tako kritično. Barve vplivajo na:

  • Začetni vtis o blagovni znamki in njeni vrednosti – na primer luksuzni izdelki pogosto uporabljajo črno, rdeča pomeni vznemirjenje itd.
  • Odločitve o nakupu – zaupanje blagovne znamke lahko določi barvni kontrast. Mehke barvne sheme so lahko bolj ženstvene in vredne zaupanja, ostri kontrasti pa so lahko bolj nujni in vodijo k popustom.
  • Uporabnost in uporabniška izkušnja – barve imajo psihološko in tudi fiziološki vpliv, kar olajša ali oteži krmarjenje po uporabniškem vmesniku.

Kako pomembna je barva?

  • 85 % ljudi je trdilo, da ima barva velik vpliv na to, kar kupujejo.
  • Barve povečajo prepoznavnost blagovne znamke v povprečju za 80%.
  • Barvni odtis je odgovoren za 60 % sprejetja ali zavrnitve izdelka.

Pri določanju barvne sheme za spletno mesto je nekaj korakov, ki so podrobno opisani v priloženi infografiki:

  1. Primarna barva – Izberite barvo, ki ustreza energiji vašega izdelka ali storitve.
  2. Akcijske barve – To manjka v spodnji infografiki, vendar je prepoznavanje primarne in sekundarne barve dejanja zelo koristno. Vaše občinstvo izobražuje, da se osredotoči na določene elemente uporabniškega vmesnika na podlagi barve.
  3. Adodatne barve – Izberite dodatno barve, ki se dopolnjujejo vaša primarna barva, v idealnem primeru barve, ki tvorijo vašo primarno barvo pop.
  4. Barve ozadja – Izberite barvo za ozadje vašega spletnega mesta – morda manj agresivno kot vaša primarna barva. Upoštevajte tudi temni in svetli način.. vedno več spletnih mest vključuje barvne sheme v svetlem ali temnem načinu.
  5. Barve pisave – Izberite barvo za besedilo, ki bo na vašem spletnem mestu – ne pozabite, da je enobarvna črna pisava redka in ni priporočljiva.

Kot primer moje podjetje Highbridge razvil spletno blagovno znamko za proizvajalca oblek, ki je želel zgraditi spletno mesto za e-trgovino neposredno potrošnikom, kjer bi ljudje lahko kupite obleke na spletu. Razumeli smo svojo ciljno publiko, vrednost blagovne znamke in – ker je bila blagovna znamka pretežno digitalna, a je imela tudi fizični izdelek – smo se osredotočili na barvne sheme, ki so dobro delovale v tisku (CMYK), paletah tkanin (Pantone) in digitalni (RGB in Hex).

Testiranje barvne sheme z raziskavo trga

Naš postopek izbire barvne sheme je bil intenziven.

  1. S ciljno publiko smo opravili marketinško raziskavo o seriji primarnih barv, ki nas je zmanjšala na eno barvo.
  2. Izvedli smo marketinško raziskavo o seriji sekundarnih in terciarnih barv z našo ciljno publiko, pri čemer smo zožili nekaj barvnih shem.
  3. Naredili smo makete izdelkov (embalaža izdelkov, etikete za vrat in viseče oznake) ter makete e-trgovine z barvnimi shemami in jih posredovali tako stranki kot ciljni publiki za povratne informacije.
  4. Ker je bila njihova blagovna znamka v veliki meri odvisna od sezonskosti, smo v mešanico vključili tudi sezonske barve. To je lahko koristno za posebne zbirke ali vizualne elemente za oglase in deljenje v družabnih medijih.
  5. Ta postopek smo šli več kot pol ducata, preden smo se odločili za končno shemo.

omara52 barvna shema

Medtem ko sta barvi blagovne znamke svetlo roza in temno siva, smo razvili akcijske barve biti odtenek zelene. Zelena je akcijsko usmerjena barva, zato je bila odlična izbira, da pritegnemo oči naših uporabnikov k akcijskim elementom. Za naša sekundarna dejanja smo vključili inverzno zeleno (zelena obroba z belim ozadjem in besedilom). Preizkušamo tudi temnejši odtenek zelene na barvi akcije za dejanja lebdenja.

Odkar smo pravkar zagnali spletno mesto, smo vključili sledenje miške in toplotne zemljevide za opazovanje elementov, ki jih obiskovalci pritegnejo, in s katerimi so najbolj v interakciji, da zagotovimo barvno shemo, ki ne le izgleda dobro ... dobro deluje.

Barve, presledki in značilnosti elementov

Razvoj barvne sheme je treba vedno doseči s testiranjem v celotnem uporabniškem vmesniku, da se opazuje interakcija uporabnikov. Za zgornje spletno mesto smo vključili tudi zelo specifične robove, oblazinjenje, obrise, polmere robov, ikonografijo in pisave.

Za podjetje smo zagotovili popoln vodnik za blagovno znamko, ki ga je interno distribuiral za kakršno koli trženjske ali proizvodne materiale. Doslednost blagovne znamke je ključnega pomena za to podjetje, ker so novi in ​​v tej panogi nimajo nobene ozaveščenosti.

Tukaj je rezultat spletnega mesta za e-trgovino z barvno shemo

  • Closet52 - Kupite obleke na spletu
  • Stran zbirk Closet52
  • Stran izdelka Closet52

Obiščite Closet52

Barvna uporabnost in barvna slepota

Ne pozabite na testiranje uporabnosti za barvni kontrast med elementi vašega spletnega mesta. Svojo shemo lahko preizkusite z Orodje za testiranje dostopnosti spletnih mest. Z našo barvno shemo vemo, da imamo nekaj težav s kontrastom, na katerih bomo delali v nadaljevanju, ali pa imamo morda celo nekaj možnosti za naše uporabnike. Zanimivo je, da so možnosti za težave z barvami pri naši ciljni publiki precej majhne.

Barvna slepota je nezmožnost zaznavanja razlik med nekaterimi barvami, ki jih lahko razlikujejo nebarvni uporabniki. Barvna slepota vpliva na približno pet do osem odstotkov moških (približno 10.5 milijona) in manj kot en odstotek žensk.

Uporabnost.gov

Ekipa pri WebsiteBuilderExpert je sestavila to infografiko in podroben spremni članek o Kako izbrati barvo za vaše spletno mesto to je izjemno temeljito.

Kako izbrati barvno shemo za vaše spletno mesto