Hoe om webwerf-, e-handel- of toepassingskleurskemas te ontwikkel

Ontwikkel webwerf-, e-handel- of toepassingskleurskemas

Ons het 'n hele paar artikels gedeel oor die belangrikheid van kleur met betrekking tot 'n handelsmerk. Vir 'n webwerf, e-handelswerf of 'n mobiele of webtoepassing is dit net so krities. Kleure het 'n impak op:

  • Aanvanklike indruk van 'n handelsmerk en die waarde daarvan - byvoorbeeld, luukse goedere gebruik dikwels swart, rooi impliseer opwinding, ens.
  • Aankoopbesluite – die vertroue van 'n handelsmerk kan deur die kleurkontras bepaal word. Sagte kleurskemas kan meer vroulik en betroubaar wees, harde kontraste kan dringender en afslaggedrewe wees.
  • Bruikbaarheid en gebruikerservaring – kleure het 'n sielkundige en fisiologiese impak ook, wat dit makliker of moeiliker maak om 'n gebruikerskoppelvlak te navigeer.

Hoe belangrik is kleur?

  • 85% van mense het beweer dat kleur 'n groot invloed het op wat hulle koop.
  • Kleure verhoog handelsmerkherkenning met gemiddeld 80%.
  • Kleurindruk is verantwoordelik vir 60% van die aanvaarding of verwerping van 'n produk.

Wanneer 'n kleurskema vir 'n webwerf bepaal word, is daar 'n paar stappe wat in die meegaande infografika uiteengesit word:

  1. Primêre kleur – Kies 'n kleur wat by die energie van jou produk of diens pas.
  2. Aksie kleure – Dit ontbreek in die infografika hieronder, maar om 'n primêre aksiekleur en sekondêre aksiekleur te identifiseer is uiters nuttig. Dit leer jou gehoor om te fokus op spesifieke gebruikerskoppelvlak-elemente gebaseer op die kleur.
  3. Aaddisionele kleure – Kies bykomende kleure wat komplementeer jou primêre kleur, ideaal kleure wat jou primêre kleur maak Pop.
  4. Agtergrondkleure – Kies 'n kleur vir die agtergrond van jou webwerf – moontlik minder aggressief as jou primêre kleur. Hou ook in die donker en ligte modus in gedagte .. meer en meer webwerwe inkorporeer kleurskemas op lig of donker modus.
  5. Lettertipe kleure – Kies ’n kleur vir die teks wat op jou webwerf gaan wees – onthou dat ’n soliede swart lettertipe skaars is en nie aanbeveel word nie.

As 'n voorbeeld, my maatskappy Highbridge 'n aanlyn handelsmerk ontwikkel vir 'n rokvervaardiger wat 'n direk-na-verbruiker e-handelswerf wou bou waar mense kan koop rokke aanlyn. Ons het ons teikengehoor, die waarde van die handelsmerk verstaan, en – omdat die handelsmerk oorwegend digitaal was, maar ook 'n fisiese produk gehad het – het ons gefokus op kleurskemas wat goed gewerk het oor drukwerk (CMYK), materiaalpalette (Pantone), sowel as digitaal (RGB en Hex).

Toets 'n kleurskema met marknavorsing

Ons proses vir ons kleurskemakeuse was intensief.

  1. Ons het bemarkingsnavorsing oor 'n reeks primêre kleure met ons teikengehoor gedoen wat ons tot 'n enkele kleur verminder het.
  2. Ons het bemarkingsnavorsing oor 'n reeks sekondêre en tersiêre kleure met ons teikengehoor gedoen waar ons 'n paar kleurskemas verklein het.
  3. Ons het produkmodelle (produkverpakking, neketikette en hangetikette) sowel as e-handelsmodelle met die kleurskemas gedoen en dit aan die kliënt sowel as die teikengehoor verskaf vir terugvoer.
  4. Omdat hul handelsmerk grootliks van seisoenaliteit afhanklik was, het ons ook seisoenale kleure by die mengsel ingesluit. Dit kan handig wees vir spesifieke versamelings of beeldmateriaal vir advertensies en sosiale media-delings.
  5. Ons het meer as 'n halfdosyn keer deur hierdie proses gegaan voordat ons op die finale skema besluit het.

closet52 kleurskema

Terwyl die handelsmerkkleure ligpienk en donkergrys is, het ons die ontwikkel aksie kleure om die skakering van groen te wees. Groen is 'n aksie-georiënteerde kleur, so dit was 'n wonderlike keuse om ons gebruikers se oë na aksie-georiënteerde elemente te trek. Ons het die omgekeerde van groen ingesluit vir ons sekondêre aksies (groen rand met wit agtergrond en teks). Ons toets ook 'n donkerder skakering van groen op die aksiekleur vir sweefaksies.

Sedert ons pas die webwerf bekend gestel het, het ons muisnasporing en hittekaarte ingesluit om die elemente waar te neem waarheen ons besoekers aangetrokke is en waarmee ons die meeste interaksie het om te verseker dat ons 'n kleurskema het wat nie net goed lyk nie... dit presteer goed.

Kleure, wit spasie en elementeienskappe

Die ontwikkeling van 'n kleurskema moet altyd bewerkstellig word deur dit in 'n algehele gebruikerskoppelvlak te toets om die gebruikers se interaksie waar te neem. Vir die werf hierbo het ons ook baie spesifieke kantlyne, opvulling, buitelyne, randradies, ikonografie en lettertipes ingesluit.

Ons het 'n volledige handelsmerkgids vir die maatskappy gelewer om intern te versprei vir enige bemarkings- of produkmateriaal. Handelsmerkkonsekwentheid is van kritieke belang vir hierdie maatskappy omdat hulle nuut is en op hierdie stadium geen bewustheid in die bedryf het nie.

Hier is die resulterende e-handelswerf met kleurskema

  • Closet52 - Koop rokke aanlyn
  • Closet52 Versamelings Bladsy
  • Closet52 Produk Bladsy

Besoek Closet52

Kleurbruikbaarheid en Kleurblindheid

Moenie vergeet van bruikbaarheidstoetse vir kleurkontras oor elemente van jou werf nie. Jy kan jou skema toets deur die Webwerftoeganklikheidtoetsinstrument. Met ons kleurskema weet ons dat ons 'n paar kontraskwessies het waaraan ons verder sal werk, of ons het dalk selfs 'n paar opsies vir ons gebruikers. Interessant genoeg is die kanse op kleurkwessies by ons teikengehoor redelik laag.

Kleurblindheid is die onvermoë om verskille tussen sommige van die kleure waar te neem wat nie-kleurgestremde gebruikers kan onderskei. Kleurblindheid raak omtrent vyf tot agt persent van mans (ongeveer 10.5 miljoen) en minder as een persent van vroue.

Usability.gov

Die span by WebsiteBuilderExpert het hierdie infografiese en gedetailleerde meegaande artikel oor Hoe om 'n kleur vir jou webwerf te kies dit is uiters deeglik.

Hoe om 'n kleurskema vir u webwerf te kies