brandguideVállalkozásból brand
UI és digitális arculatBrandpediaDesignereknek2 perc olvasás

Szkeuomorfizmus vs. flat design

Serfőző Péter · Megjelent · Frissítve

Két stílus vitája arról, hogy a digitális gombok nézzenek-e ki valódi tárgyaknak.

A szkeuomorfizmus a régi, ismerős formákkal (tárcsás telefon, asztal metafora) épít bizalmat az új technológia iránt. A flat design ezzel szemben elhagyja a vizuális mankókat, a Material design pedig a kettő között keres egyensúlyt.

A szkeuomorfizmusnak a fő célja: kihasználni a korábbi ismeretek előnyét, így ébresztve bizalmat az új technológiával szemben.

A korábbi tudásra és tapasztalatra építve a külső forma és megjelenés alapján könnyen lehet új technológiákról elmondani, hogy mi a funkciójuk és szerepük, milyen affordanciájuk van.

Szkeuomorf UI design

Beláthatjuk, hogy az okostelefonok sík képernyője önmagában semmilyen affordanciával nem bír. Korábbi tapasztalatok híján a felhasználók nem tudnák kezelni. A szkeuomorfizmus eszközével viszont olyan imitált 3D kezelőfelületeket jelenítünk meg a képernyőn fény és árnyékok segítségével – például billenőkapcsoló –, amelyek már megfelelő affordanciával bírnak, a korábbi tapasztalatok és a vizuális effektek segítségével ismerőssé válnak.

Egyik legjellemzőbb példa az érintőképernyős telefon képernyőjén megjelenő klasszikus tárcsás telefonfelület.

Ugyanilyen metafora a desktop / asztal metaforája, melyet a személyi számítógépek hajnalán dolgoztak ki a mérnökök és designerek. A Xeroxhoz kapcsolódik az első széles körben elterjedt, GUI-val rendelkező számítógép is, a STAR elnevezésű, melyet 1981-ben mutattak be. Ennek a grafikai felületén érvényesült először a desktop (asztal) metafora: egy íróasztalt képeztek le amelyen papírok voltak, melyeket mappákba rendezhettünk. Ha törölni akartuk, akkor a szemétkosárba dobhattuk. Ezekkel a metaforákkal tették az emberek számára az új felületet és funkciókat ismerőssé.

A szkeuomorfizmus jó!

A metaforák és a szkeuomorfizmus abban segítenek a felhasználóknak, hogy felismerjék a user interface elemeket, és azokat könnyen használni tudják már korábban megszerzett tudásuk és tapasztalatuk segítségével. A touch screen felületek megjelenésekor különösen hasznosak voltak ahhoz, hogy az emberek elfogadják és használják ezt az újdonságot.

Aztán sikerült átesni a ló túloldalára. A designerek öncélú díszítésre is elkezdték használni. Legszebb példája ennek a díszítésnek a MacOS rendszer (akkoriban még OSX) iCal user interface-e. A rossz nyelvek szerint Steve Jobs privát repülőgépének ülésvarratából inspirálódtak a designerek ?

UI design trendek

Az iOS 7 megjelenésével 2013-től széles körben elterjedt a flat design (igaz nem ők voltak az elsők). A flat design nehezen értelmezhető, nincsenek vizuális mankók, amelyek segítenék a userek eligazodását. Míg a szkeuomorf világban, eltúlzottak lettek a mankók, addig a flat designban teljesen eltűntek. Átestünk a ló túloldalára. Aztán jött a Material design, ami kiegyensúlyozottságot hozott a UI designba.

Kapcsolódó cikkek:

https://www.zwoelf.hu/hu/blog/41/a-skeuomorhizmusrol-nem-csak-ui-designereknek

  • A szkeuomorfizmus a korábbi tapasztalatokra épít, hogy az új felület ismerősnek tűnjön.
  • A desktop metafora (mappák, szemétkosár) a Xerox STAR gépén jelent meg először, 1981-ben.
  • A túlzott szkeuomorf díszítés (pl. iCal) öncélúvá válhat, és elveszti a funkcióját.
  • Az iOS 7 2013-tól elterjesztette a flat designt, ami viszont vizuális mankók nélkül nehezen értelmezhető.
  • A Material design célja, hogy egyensúlyt teremtsen a két véglet között.

Gyakori kérdések

Mi a szkeuomorfizmus lényege a UI designban?

A szkeuomorfizmus a korábbi ismereteket és tapasztalatokat használja fel, hogy az új technológia megjelenése ismerős és bizalomgerjesztő legyen, például imitált 3D kapcsolók vagy a tárcsás telefon felülete formájában.

Miért jó, ha egy felület a valós tárgyakra emlékeztet?

Mert a felhasználók a korábban megszerzett tudásuk alapján könnyebben felismerik és használják az adott elemeket, ez különösen a touch screen felületek elterjedésekor segített az elfogadásban.

Mi a különbség a flat design és a szkeuomorfizmus között?

A szkeuomorf design eltúlzott vizuális mankókat használ, míg a flat design, amely 2013-tól az iOS 7-vel terjedt el, ezeket a mankókat teljesen elhagyja, ezért nehezebben értelmezhető.

Mi old meg a két szélsőség problémáját?

A cikk szerint a Material design hozta el a kiegyensúlyozottságot a UI designba a szkeuomorfizmus és a flat design között.

Designer vagy?

A brandguide vállalkozóknak szól. A designer szakma hétről hétre a yellow közösségben találkozik: árazás, ügyfélkezelés, portfólió, és a szakma legjobbjai.

Nézd meg a yellow-t
Serfőző Péter
márkastratéga, a zwoelf alapítója
Serfőző Péter márkastratéga. 2009 óta, a zwoelf alapítójaként azon dolgozik, hogy a cégek ne a logóval kezdjék, hanem azzal, amiért a vevő őket választja. Nagyvállalatoknak, mint a Waberer's, az Uniqa vagy az OTP, ugyanazzal a módszerrel épít márkát, amit a brandguide-on kisvállalkozóknak ad át, érthetően.
Hasznos volt ez a cikk?

Kapcsolódó cikkek