A téma mindig is érdekelt, de most még fel is kértek egy előadásra, így a mélyére ástam. Két nem titkolt célom van ezzel az írással. Elsősorban szeretném, hogy a megrendelők minél többet áldozzanak a megjelenésükre, másodsorban pedig vegyék nagyon komolyan a designerek munkáját.

Az első benyomás

Ha bárminek a megjelenéséről van szó, akkor az első benyomás mint fogalom megkerülhetetlen. A következő kutatásban azt vizsgálták, hogy mennyi időre van szükség ahhoz, hogy véleményt alkossunk.

A kutatók a résztvevőknek először fél másodpercig mutattak ronda és szép honlapokat, melyeket az alanyok egy skálán értékeltek a nagyon csúnyától a nagyon vonzóig. Ezt a kísérletet ismételték ugyanazokkal a honlapokkal, viszont más alanyokkal. Végül 50 ezredmásodperc elegendőnek bizonyult a véleményformáláshoz. Habár ekkor azért változatosabb lett az eredmény.

Az emberek 50 ezredmásodperc alatt véleményt alkotnak a designról
Gitte Lindgaard 2006.

Ha jobban érzékelni szeretnéd milyen kicsi időpillanat ez: az autókban elöl elhelyezkedő légzsákok kb. ugyanennyi idő alatt reagálnak az ütközésre és fújódnak fel. Vagy például egy szempillantás ~100 ezredmásodpercig tart, szóval egy szempillanatás feléről van szó.

Ehhez szorosan kapcsolódó újabb érdekes adat, hogy…:

Az emberek 38%-a kilép az oldalról, ha annak elrendezése vagy tartalma nem vonzó
State of Content, Adobe, 2015.

Az első benyomás hatással van a későbbi döntésre

Az emberek az első benyomásuk után a véleményüknél ki is tartanak.

Terry Kellard kísérletében az alanyok egy valódi állásinterjún vettek részt. Az interjúztató egy kis potméter segítségével jelezte, hogy tetszik neki, amit érzékel, vagy sem. Ezt egy -100 és +100 közötti értékkel az idő függvényében egy grafikonon ábrázolták. Amikor az interjúk végeztével az interjúztató meghozta a döntését, akkor láthatóvá vált, hogy teljesen megegyezik az első 5 másodpercben kialakult sorrenddel. Ez az eredmény meglepte az interjúztatót is. Ezt a kísérletet többször elvégezték, hasonló eredménnyel.

Az esztétikus web design gerjeszti a vásárlási szándékot az online boltok esetében
Lee and Lee, 2003. & Deng and Poole, 2010.

Holdudvarhatás

Az esztétikus design döntésre való hatása mögött is a halo effektus, vagy holdudvarhatás húzódik meg.

A holdudvarhatás egy olyan kognitív torzítás, amikor egy benyomás valamely személyről, tárgyról vagy dologról befolyásolja a vele kapcsolatos érzéseinket, gondolatainkat és így az adott dologról alkotott teljes ítéletünket.
Wikipédia

Nem csak a fizikai megjelenésre vonatkozik ez a jelenség.
Példának okáért, ha valaki társaságkedvelő, barátkozó alkat, akkor szimpatikusabbnak és intelligensebbnek gondoljuk.

Ha valami szép, akkor ezt a pozitív élményünket kivetítjük más tulajdonságokra is

A webdesign hatását érzékelteti a J.D. Power 2007-es kutatása. 2 hónapon keresztül 10,773 új autót vásárlót kértek meg, hogy értékeljenek 25 márkával kapcsolatos tulajdonságot. Olyan kategóriákba sorolták ezeket a tulajdonságokat, mint teljesítmény, megjelenés, termék, gazdaságosság.

Az akkor megújult Volkswagen website meglátogatása után mind a 25 tulajdonság értékelésében pozitív változás következett be.

Az új website designja kihatott a leendő vásárlók márkával kapcsolatos képére, sőt az autókat technológiailag fejlettebbnek, innovatívabbnak érzékelték.

Ami szép, könnyebben használható

1995-ben bizonyították elsőként az esztétikus design és a használhatóság közötti korrelációt.

ATM-ek felhasználói felületét variálták 26 különböző változatban.
252 alany vett részt a kísérletben, akiket megkértek, hogy értékeljék mennyire szépek a felületek, és mennyire használhatók.

Az eredmények erős korrelációt mutattak az esztétika és a használhatóság között.
Minél tetszetősebb volt számukra egy felület, annál inkább úgy gondolták, hogy az jobban használható.

Az esztétikus design kellemes érzést kelt az egyén (felhasználó) agyában (pozitív érzelmi állapotot idéz elő), ezáltal növeli kreativitását és toleranciáját, így ha később problémával találkozik az alkalmazás használata során, akkor azt könnyebben és hatékonyabban oldja meg.

Más szóval, ha jobban érzed magad, akkor hajlamos vagy átlépni kisebb tervezési, használhatósági hibákon is.

Egy hétköznapi talán sokatok által is már érzékelt példa erre, hogy amikor elviszed az autót és lemosatod, vagy lemosod, majd beülsz és elindulsz vele:
Akkor megvan az az érzés, hogy jobban megy, szinte suhan, ugye?

Az attraktív dolgok jobban működnek
Don Norman, 2002.

Az esztétikusabb tervezésű rendszereket tanulhatóbbnak és hatékonyabban használhatónak érezzük.

Ami szép, megbízható

A web design hitelességre gyakorolt hatását 2002-ben a Stanford Egyetemen vizsgálták.

100 web site-ot 10 kategóriába soroltak. Az alanyok fejenként 2 oldalt kaptak és azokat átnézve írásban kommentelték, hogy mit gondolnak a hitelességükről. Ezeket a kommenteket később átbeszélték az alanyokkal, majd aggregálták.

A cég hitelességének megítélésére 46,1%-ban gyakorol közvetlen hatást a website grafikai megjelenése
B.J. Fogg, Ph.D., Cathy Soohoo, David Danielsen, Stanford University, 2002.

Az esztétikus web design bizalmat épít

Ugyan már… tök szubjektív kinek, mi tetszik…
Gondolod te is, meg sokan és részben igazad is van, de csak részben, hiszen létezik egy univerzális szépség élmény is, amit minden ember a világ minden pontján szépnek érzékel…

Univerzális szépség

Az esztétikai ízlésvilágunk univerzális alapjai az evolúciós folyamat során fejlődött ki és vált agyunk szerves részévé. A szépség nem (csak) ízlés kérdése, hanem mélyen a tudatunkba van vésődve, illetve a szépség eszköz a természet kezében, hogy a háttérből irányítson minket. Az agyunk automatikusan reagál a szépségre a látás és az öröm összekapcsolásával.

Szimmetria

A szimmetriát az állatok és az ember is nagyon szereti. Legfőképpen azért, mert az asszimetria, vagyis a szimmetria hiánya általában betegségek, sérülések, genetikai fejlődési rendellenességek következménye a növény–, és az állatvilágban, csakúgy az embereknél. A szimmetria az egészséget jelzi.

Sir Francis Galton 1878-ban bemutatott egy új technológiát, amivel fotókat tudott összemosni és így kompozit portrékat tudott létrehozni. Az volt az elmélete, hogy ha bűnözők fotóit kombinálja, akkor megtalálja a bűnözés arcát, annak jellemzőjét. Nem árulok el nagy titkot, hogy nem találta meg. Viszont meglepetésére a kompozit fotón kirajzolódó arc gyönyörű lett. Az átlagos és legfőképpen szimmetrikus arcok tipikusan vonzóbbak, mint az egyediek, vagy asszimetrikusak.

A vonzó arc, így a szimmetria is aktiválja az agy jutalmazó és örömközpontjait

Maksymilian Faktorowicz készített is egy eszközt, amit szépség mikrométernek nevezett el. A szerkezet lényege, hogy mértani pontossággal lehet meghatározni vele az arc vonásait, egyenetlenségeit, és ezáltal jobban láthatóvá válik, melyik részt kell feljavítani a sminkmesternek. Az ő cége vezette be a make-up kifejezést, a márkát pedig Max Factor néven ismerjük.

Ami szép, az jó. Ami torz, az rossz.

Az agyunk reflexszerűen társítja a szépet és a jót, ami nem csak emberekre, de tárgyakra is vonatkozik. Mesékben, filmekben, regényekben láthatjuk is ennek példáit: a gonosz torz, csúnya alak, míg a jó mindig szép, szimmetrikus, átlagos arcú és sokszor gyermeki vonásokkal rendelkezik, mint pisze orr, nagy szemek.

Igazságtalan, de így a vonzó emberek mindenféle előnyt élveznek az életben:
intelligensebbnek, hozzáértőbbnek, tisztességesebbnek és barátságosabbnak látjuk, mint a kevésbé vonzó külsejűeket. Főként ezt használják ki a szélhámosok is, akik sok esetben szép külsővel bírnak.

Kifinomultság, mint örömforrás

A szakóca, amit 2,5 millió évvel ezelőtt már készítettek az ember elődei, mind szimmetrikusan hegyesek, levél vagy könnycsepp formájúak. Denis Dutton elmélete szerint a szakócák elkészítéséhez intelligenciára, kézügyességre, tervezőképességre, tudatosságra, és ritka nyersanyagra volt szükség. Nincs nyoma a használatból adódó kopásnak a sérülékeny éleknél.

Hosszú időn át egy szakóca tulajdonosának növelte a státuszát, ezáltal szaporodási előnyét. A homo erectus, aki létrehozta ezeket a tárgyakat még beszélni sem tudott! A szakócák valójában műalkotások, a szimmetriájuk, a tetszetős anyaguk, és aprólékos megmunkálásuk szép a szemnek.

Szépséget találunk abban, ha valami kifinomultan kivitelezett dolgot látunk, érzékelünk

Díszesség

Charles Darwin a természetes szelekció mellé vezette be a nemi szelekció fogalmát a fajok eredete című művében. Amíg a hím egyedek versengenek a női egyedékért, addig az utóbbiak minél egészségesebb utódokat akarnak világra hozni, felnevelni. A díszítettség elősegíti a szaporodás valószínűségét, ellenben hátráltatja az egyedeket a túlélésben. Ez egy olyan luxus, amit kizárólag egy kicsattanóan egészséges egyed engedhet magának, és fordíthat erre külön energiát.

A díszesség felkelti és fenntartja az érdeklődésünket

Tájkép

Az emberek világszerte, a legkülönbözőbb kultúrákban, ugyanahhoz a jól leírható tájtípushoz vonzódnak, ami a pleisztocén kor szavannáihoz hasonló, ahol fajunk kifejlődött. A burjánzó növényzettel és fákkal teli dombok, egy magányosan álló nagy fa, állatok mindenhol, a távolban egy kéklő tó, ahova egy ösvény, vagy út vezet. Ehhez hasonló látványvilág az emberek ugyanazzal a szépségérzettel, örömmel jár. Festményeken, fotókon, képeslapokon, számtalan helyen találkozunk ezzel.

A szépség univerzális és szubjektív

A New York Egyetem kutatásában 109 műalkotás képét mutatták az alanyoknak, melyek különböző kultúrák, korok, stílusok alkotásai. Miközben nézték a műremekeket fMRI segítségével vizsgálták, hogy az agyuk mely területei aktivizálódtak.

Az eredmények azt mutatják, hogy egy műalkotáshoz való mély kapcsolódás mindenki agyának ugyanazt a részét aktiválja.

Az esztétikai élmények mindenkinél egyformán aktiválják az agyat.
Az egyéni preferencia, sajátos ízlésvilág viszont az agy ún. default network mode, a nyugalomban lévő agy aktív hálózatát is aktivizálja, amit a befelé irányuló szemlélődéssel, és önértékeléssel is kapcsolatba hoznak.

Az esztétikai élmények egyaránt egyetemesek és erősen egyéniek

Az esztétikai érzékelésünkre hatással vannak globális, lokális trendek. Éppen ezért fontos, hogy a design a célközönség számára legyen esztétikus.
A tapasztalat pedig azt mutatja, hogy ~4–5 évente a globális trendek megváltoznak, ami miatt viszont célszerű lehet a design átalakítása.

A szépség alapvető receptje

SZÉPSÉG = RENDEZETTSÉG és KOMPLEXITÁS

A szépség valahol a félúton található a rendezettség a komplexitás között.
A rendezettségre jó ránézni, de ha valami túlságosan rendezett, akkor az unalmassá válik. A másik végletet tekintve pedig, ha valami túlságosan komplex, akkor káoszt érzékelünk.

A folyamatos véletlenszerűségnek kitett ember áhítja a rendezettséget, amibe aztán kapaszkodhat. Megnyugvást és örömöt hoz számára.

Érdemes ezért egyszerű és rendezett mintázatokat használni és a minták részleteiben pedig számtalan apró variációval fűszerezni a designt, vagyis alkalmazd egyszerre a rendezettséget és a komplexitást.

Hogyan lehetséges, hogy ronda oldalak népszerűek és jól konvertálnak?

A választ Peter Morville 2004-es ábrája adja meg, ami a jó felhasználói élményhez szükséges összetevőket foglalja egybe. Látható, hogy az esztétikus, vonzó megjelenés egyetlen, de szükséges összetevő.

A legsikeresebb ronda site-ok elképesztően jól használhatóak, könnyűvé és egyértelművé teszik a látogatók számára, amit ajánlanak, és azt hogyan használják a honlapjukat. Ha esztétikusak lennének még jobban teljesíthetnének.

Sok olyan cikkez láttam, ami arra buzdít, hogy legyen csúnya az oldalad és ezzel növeld a konverziód. Ez balgaság.

Önmagában kevés az esztétikus design

Gondolj arra, hogy meglátsz egy embert, aki nagyon szép. Azonnal felkelti a figyelmed és szinte vágyat érzel, hogy odamenj hozzá és interakcióba lépj vele.
Mondjuk odalépsz hozzá és megszólítod, de amikor beszélni kezd, döbbenten tapasztalod, hogy nem túl intelligens. Hasonlóan működik ez a digitális termékeknél is. A szép design felkelti a figyelmed és interakcióba is lépsz vele. Viszont ha a tartalom szegényes, nem érdekes számodra, akkor átlépsz egy másik oldalra.

Nem lehet öncélú a design és nem mehet a használhatóság rovására

Lehet mérni az attraktivitást?

A válasz egyszerű: igen. A 5 másodperces teszt alkalmas az első benyomás mérésére. Ilyenkor a meglévő designt 5 másodperc erejéig felvillantják a célközönségből származó alanyoknak, majd utána feltesznek olyan kérdéseket, mint
„Hogyan írnád le a látott designt?”, vagy „Milyen érzéseket keltett benned?”.

5 másodperc kifejezetten kevés idő arra, hogy elolvass szövegeket, észlelj részleteket pl. milyen betűtípus, színek szerepelnek a felületen, viszont épp elég arra, hogy a vizuális stílusra vonatkozó első benyomásod kialakuljon benned, az érzéseid megfogalmazd.

Összefoglalva

• 50 ezredmásodperce van a designodnak
• Az esztétikus digitális termék…
  • magasabb konverziót eredményez
  • jobban használható
  • könnyebben tanulható
  • hitelesebb, bizalmat épít
• Az esztétikus design önmagában kevés, de nélkülözhetetlen
• A szépség egyszerre univerzális és szubjektív

Fusd át prezentáció formájában is:

Nézd meg az előadást:

Források

A tartalmi linkeken felül az alábbi forrásokból táplálkozik az írás, érdemes elolvasni, megnézni további információkért:

• Neuroesthetics
• Nemi szelekció
• Mit tart szépnek az agyunk?
• Dennis Dutton: A szépség darwini elmélete
• The Golden Ratio: Design’s Biggest Myth
• Visual Aesthetics
• The myth of universal beauty
• How aesthetics / beauty and usability influence each other in web design

A fejléckép az egyik kedvenc festőm, Roy Lichtenstein Sunrise c. műve.