Barva v spletnem oblikovanju: kako pri uporabniku vzbuditi prava čustva

2024 Avtor: Malcolm Clapton | [email protected]. Nazadnje spremenjeno: 2023-12-17 04:10

Barva določa čustveno reakcijo uporabnika na spletno mesto, tudi če se sam tega ne zaveda. Kakšne barve uporabiti za ozadje in različne elemente spletnega mesta, da vzbudi določene občutke, in kako pravilno kombinirati barve v spletnem oblikovanju, preberite spodaj.

Skozi zgodovino človeštva so bili slikarski mojstri splošno priznani po svoji sposobnosti dela z barvami. V sodobnem svetu so enako priznani strokovnjaki, ki znajo kombinirati barve v komercialne in poslovne namene – v oglaševanju in spletnem oblikovanju.

Sposobnost uporabe barv se lahko črpa v nedogled. To je pravo brezno možnosti vplivanja na človeka.

Obravnavali bomo osnove barvne teorije in barvne sheme, nato pa se bomo pogovarjali o čustvenem vplivu določenih barv.

Teorija barv

Temi barv je lahko namenjena celotna knjiga, zato je ne bomo obravnavali v celoti, ampak se bomo omejili le na uporabne informacije, ki jih lahko uporabimo pri razvoju zasnove vmesnika.

Teorijo barv lahko razdelimo na tri dele:

Kontrast

Vsak odtenek ima tako rekoč nasprotje svojega "sovražnika", ki predstavlja največji kontrast tej barvi. Če želite poiskati takšno barvo, lahko uporabite barvno kolo. Samo izberite barvo na nasprotni strani kroga.

Dodatek

Te barve niso vedno v nasprotju med seboj. Komplementarne barve se med seboj poudarjajo, v nasprotju s kontrastnimi. V barvnem krogu si te barve sledijo, na primer komplementarne barve lila - modra in roza.

Resonanca

Vsaka barva vzbuja določeno razpoloženje. Svetle tople barve (rdeča, oranžna, rumena) človeka napolnijo z energijo, ga prebudijo, hladni temni odtenki (zelena, modra, vijolična), nasprotno, sproščajo in pomirjajo.

Na primer, uporabljajo rdečo navigacijsko vrstico, da prebudijo bralca in povečajo njegovo vznemirjenje. Glede na specifičnost spletnega mesta - senzacionalne novice - rdeča izgleda kot logična odločitev.

Teorija barv v spletnem oblikovanju je več kot le dekoracija. Barva lahko spremeni dojemanje vašega spletnega mesta in igra ključno vlogo v vašem podjetju.

Čustveno zaznavanje barve

Nihče ne bo zanikal tesnega prepletanja barv in čustev. In seveda, vsak spletni oblikovalec želi uporabiti ta vpliv, da ustvari pravo vzdušje za vsako spletno mesto.

Na podlagi nekaj študij – analize, objavljene na spletnem mestu, in objave o barvah v – bomo razložili, kako barve vplivajo na čustva in pomagajo pri oblikovanju UX dizajna.

Pomembno si je zapomniti, da različne kulture po svetu različno dojemajo barve. Opisali bomo čustvena združenja, ki so edinstvena za zahodno kulturo.

rdeča

Najbolj spodbudna barva, tako energijsko nabita, da lahko celo zviša krvni tlak. Rdeča predstavlja strast in moč ter je barva, ki najbolj pritegne pozornost, zato se pogosto uporablja za pomembna opozorila in objave.

Rdeča barva je na primer zelo primerna za spletno mesto, katerega namen je opozoriti na zaznane grožnje.

Uporaba veliko rdeče na vrhu strani je odlična, saj opozori na pomembne informacije v vašem sporočilu. Hkrati ljudje ponavadi hitro zapustijo rdeče "nevarno območje" in se pomaknejo navzdol. To pa vam omogoča, da uporabniku pokažete več vsebine.

Toda ta barva lahko deluje tudi proti vam, saj lahko povzroči agresijo ali pretirano stimulacijo. Če želite ustvariti bolj sproščujoče vzdušje, poskusite rdečo uporabiti zmerno in izberite svetlejše odtenke rdeče.

Oranžna

Kot najbolj umirjen med toplimi toni lahko oranžna vzbudi vrsto različnih čustev. Kot primarna barva lahko vzbudi zanimanje in poživi, kot sekundarna barva pa lahko ohrani te lastnosti, vendar na bolj nevsiljiv način.

Poleg tega oranžna pomaga ustvariti občutek gibanja in energije. Odlično izgleda na primer na spletni strani podjetja za risanke, ki namiguje na mladost in gibanje. Barva je povezana z ustvarjalnostjo, hkrati pa ohranja občutek znane blagovne znamke.

Rumena

Je ena najbolj vsestranskih barv, čustva, ki jih vzbuja, pa so bolj odvisna od odtenka.

Svetlo rumena dodaja energijo, vendar brez ostrine in ostrine, ki je prisotna v rdeči barvi. Srednje rumene barve vzbujajo občutek udobja, hkrati pa poživljajo. Temni odtenki (vključno z zlati) dajejo občutek antike, napolnijo prostor z brezčasnostjo, modrostjo in radovednostjo.

Na primer, na domači strani agencije za spletno oblikovanje temnejši toni rumene izžarevajo energijo, radovednost in avtoriteto. Ta barva je odlična za podjetja, ki zaslužijo s svetovanjem in želijo poudariti svojo strokovnost.

Zelena barva

Zelena je most med toplimi in hladnimi odtenki, čeprav je ponavadi bolj hladna. To pomeni, da ima zelena sproščujoč učinek modre, ima pa tudi malo energije iz rumene.

Posledično ustvarja zelo uravnoteženo in stabilno vzdušje. Temnejši odtenki zelene dajejo vtis bogastva in obilja, tako kot spletna stran.

Modra barva

Tako kot pri rumeni je učinek modre zelo odvisen od odtenka. Vsi odtenki modre so univerzalni glede sproščenosti in varnosti, vendar so svetli toni povezani s prijaznostjo, temni pa z žalostjo.

Družbena omrežja, kot sta Twitter in Facebook, uporabljajo svetlejše do srednje odtenke modre, medtem ko korporativna spletna mesta dajejo prednost temnejšim odtenkom moči in zanesljivosti.

Odličen primer je agencija za oblikovanje dogodkov. Z modrimi cvetovi za ozadje so vizualno nakazali svoje znanje in veščine v cvetličarstvu ter ustvarili občutek zanesljivosti in zaupanja.

To je zelo pomembno, saj delajo z dogodki, kjer je vizualno zelo pomembno, kot so poroke.

vijolična

Vijolična barva je zgodovinsko povezana s kraljevo veličino, ki namiguje na razkošje. Odtenki vijolične odražajo velikodušnost in bogastvo na splošno, zaradi česar so odlična izbira za modne in luksuzne izdelke (tudi čokoladno, kot je izbira barve blagovne znamke).

Svetlejši odtenki, kot je sivka (vijolična s pridihom roza), vzbujajo misli o romantiki, temnejši odtenki pa se zdijo bolj šik in skrivnostni.

Črna

Najmočnejša od nevtralnih barv, črna, se pojavi na skoraj vseh spletnih mestih. Lahko vzbudi različne asociacije, odvisno od barv, ki ga spremljajo, ali prevladuje nad njimi, če se prekomerno uporablja.

Zaradi moči in nevtralnosti črne je odlična izbira za velike bloke besedila, vendar kot primarna barva lahko ustvari občutek živčnosti ali je celo povezana z zlom.

Za večino spletnih mest se črna barva uporablja za ustvarjanje občutka prefinjenosti. Kombinacija črne in bele barve v minimalističnem dizajnu daje vtis elegance in sloga, tako kot na spletni strani BOSE.

Bela

V zahodni kulturi je bela povezana s čistostjo, prijaznostjo in nedolžnostjo. Ta barva se pogosto uporablja za ozadje minimalističnih in preprostih spletnih mest.

Poleg tega vam nobena posamezna barva ne bo omogočila toliko pozornosti drugim barvam kot bela. Na primer, za zmagovalca Awwwards Kloina Tosheva so vsa njegova dela postavljena na belo ozadje, zaradi česar ilustracije le izstopajo in dajejo vtis elegantne galerije.

Siva barva

Kljub temu, da v nekaterih situacijah siva lahko ustvari mračno in žalostno vzdušje, jo profesionalni oblikovalci še vedno pogosto uporabljajo.

Gre za odtenke: če jih izmenjujete, lahko dobite vsa čustva, ki jih povzročata črna in bela. Skratka, siva je močno orodje v pravih rokah.

In v kombinaciji s svetlejšimi barvami v oblikovanju se sivo ozadje zdi moderno in ne mračno, na primer.

Bež

Bež je sama po sebi precej dolgočasna in neizrazita, vendar ima eno izjemno lastnost: bež prevzame značaj cvetov, ki jo obdajajo. Če torej ni namenjena izražanju zadržanosti, bež služi kot ozadje ali druga barva.

Temnejši odtenki bež ustvarjajo občutek tradicije in prizemljenosti, dajejo papirnat občutek, svetlejši odtenki pa delujejo bolj sveže in moderno.

Na primer, na spletnem mestu restavracije svetlo bež barva okoli imena in temnejši robovi dajejo vtis, da je restavracija svež pogled na tradicionalno kuhinjo.

Slonokoščena

Slonokoščena in smetana vzbujata skoraj enaka čustva kot bela. Vendar je slonokoščena toplejša (ali manj sterilna) kot bela, kar ustvarja večji občutek udobja, hkrati pa ohranja minimalizem.

Namesto bele lahko uporabite slonovino, da omilite kontrast med njo in temnejšimi barvami. Na primer, na spletnem mestu so rjavo-oranžni elementi postavljeni na ozadje slonovine (ki je videti sivkasto), da ohranijo občutek topline.

Barvni spekter

Vsako spletno mesto ima barvno shemo, ki uporablja primarne barve, da zapolni več prostora. Kot smo že povedali, uporaba teh barv vpliva na um in razpoloženje človeka predvsem podzavestno. Zato jih previdno izberite.

Čeprav obstaja veliko načinov za kombiniranje barv, se bomo osredotočili na tri najbolj uspešne in pogosto uporabljene.

Triada (trojna harmonija, trikotnik)

Triada je osnovni in najbolj uravnotežen sistem treh barv. Uporablja resonanco in barvno dopolnilo, vendar nima kompleksnega kontrasta, zaradi česar je triada najbolj zanesljiva lestvica.

Na 12-barvnem kolesu izberite katere koli tri 120 stopinj narazen: eno za ospredje in dve za vsebino in navigacijsko vrstico.

Dvojni komplementarni sistem

Ta obseg je težje izvedljiv, vendar je lahko donosna rešitev. Uporabljene so štiri barve: dve kontrastni in dve komplementarni.

Preverite, kako izgleda odlična stran Florida Flourish na podlagi te postavitve. Rdeče in zelene barve so kontrastne v rastlinah in besedilnih blokih, medtem ko modro ozadje in oranžna puščava učinkovito dopolnjujeta sliko.

Analogi (serijski sistem)

Paleta podobnih barv uporablja predvsem komplementarne odtenke. To vam omogoča, da še posebej jasno poudarite nekatere lastnosti in vzbudite določena čustva.

Kombinacija rdeče, oranžne in rumene barve na primer poudarja energijo in vitalnost. Uporaba takšnih lestvic je zelo preprosta, vendar je težko izbrati, katere barve bodo vključene v kombinacijo. Njihov učinek bo pretiran, zato se ne morete motiti.

Na primer, uporaba modre, turkizne in zelene barve pri oblikovanju spletne strani je ustvarila vzdušje miru in spokojnosti. Upoštevajte, kako je bila rumena uporabljena za poudarjanje pomembnih točk.

To so le osnove teorije barv, ki vam lahko pomagajo ustvariti impresivne modele po meri, in ni omejitev, kako daleč lahko greste glede barv na vašem spletnem mestu.

Orodja za pomočnika za izbiro barv

Na srečo je na voljo več orodij, ki vam pomagajo prenesti teorijo barv v prakso. Preizkusite te palete, da vam ni treba začeti iz nič, da bi ustvarili svojo:

1. prej znan kot Adobe Kuler. Je eno najbolj zanesljivih orodij za izbiranje barv.
2. … Če želite s preprostim orodjem čim hitreje izbrati barvo, je Paletton odličen.
3. … Odlično orodje za izbiro barve uporabniškega vmesnika.

In če vam ta orodja ne delujejo, so tu različna orodja za izbiranje barv.

Neposredna povezava med barvo in čustvi

Ne pozabite: uporabniki redko opazijo in cenijo barvo ozadja, navigacijske vrstice, posamezne podrobnosti, vendar to ne pomeni, da barva nanje ne vpliva. To se zgodi samo podzavestno.

Uporabnik ima nekaj čustev, razvije odnos do spletnega mesta ali blagovne znamke, izvaja določena dejanja: pomika navzdol, klikne gumbe, ki sprožijo dejanje, ali, nasprotno, jih ne opazi. In barva igra veliko vlogo pri vsem tem.

Če imate kakršne koli nasvete za uporabo barv v spletnem oblikovanju, jih delite v komentarjih.