A szkeuomorfizmus és a flat design szerepe a meghatározó UI design rendszerekben
Írta:w3bark-balazsAz elmúlt néhány évben nagy változások történtek a webdesign trendekben, így a webdesignerek könnyen beleragadhatnak az éppen aktuális őrületbe, miközben figyelmen kívül hagyják annak praktikumát, vagy a felhasználási környezetét.
A webdesign egyik legfontosabb eleme a felhasználói élmény megteremtése, amely számtalan tényezőtől függ, beleértve a grafikai elemeket, az interaktivitást, az információs architektúrát és magát a stílust. A UI design stílusok terén két fontos és elméletben egymással szembeállítható irányzat van, a szkeuomorfizmus és a flat design. A gyakorlatban a webdesign területén ma már nem jellemző a két stílus vegytiszta használata, hiszen az új technológiák és a felhasználói szokások változásával egyre inkább szintézis alakul ki, amiben ötvöződnek a két eltérő stílus előnyei. Ez a szintézis számtalan olyan újnak mondható irányzatot hozott létre, mint a neomorfizmus, vagy semi-flat design.
Ebben a cikkben áttekintjük a két fontos eredőt, a szkeuomorfizmust, és a flat designt, illetve az ezekre épülő design rendszereket és nyelveket.
Ui design stílusok
Szkeuomorf design
A szkeuomorf design egy tervezési stílus, ami olyan természetes, valósághű formákat és textúrákat alkalmaz, ahol az egyes elemek a fizikai tárgyakhoz hasonlóan néznek ki egy digitális környezetben. Az irányzat célja, hogy segítse a felhasználókat a digitális felületek használatában és megértésében, úgy, hogy azok a valós életből jól ismert elemekre épülnek.
Azonban a szkeuomorf design hátránya, hogy a megjelenése néha túl bonyolulttá válhat, és hogy a fejlesztése időigényes és költséges lehet, továbbá egyes esetekben túl sok információt tartalmaz, ami megnehezíti a navigációt és ezáltal negatív hatással is lehet a konverzióra.
A szkeuomorfizmus első hulláma egybeesett az első UI felületek tervezével. A szkeuomorf designnak fontos szerepe volt abban, hogy a felhasználók számára megkönnyítsék az új technológiák használatát. A Microsoft is ezt a szemléletet alkalmazta a korai operációs rendszereinek tervezésekor. A Windows 95 felületén a számítógépes ikonok olyan valós életből ismert tárgyakat mintáztak, mint például a papírjegyzet, a CD, nyomtató, vagy a szemetesláda. A szkeuomorf design segítette a felhasználókat a számítógép használatának elsajátításában, és a technológia barátságosabbá és emberibbé tételében.
A szkeuomorfizmus legközelebb nagyrészt az Apple-nek köszönthetően a 2000-es évek végén keltett újra nagyobb feltűnést, amikor a mobil érintőképernyő előtérbe került. Ez ismét arra kényszerítette a tervezőket, hogy leporolják a szkeuomorf tervezés alapelveit, hogy segítsenek a felhasználóknak megérteni, hogy hogyan kommunikálhatnak az új eszközökkel. Ez a tervezési filozófia nagy szerepet játszott abban, hogy az új technológiára való átment a lehető legkönnyebb legyen. A lezajlott digitális átállás végül háttérbe szorította a szkeuomorf tervezést, és a realista design elemek már nem voltak elengedhetetlen részei a felhasználóbarát felületeknek, így teret a flat design, ami egy új szemléletet hoztak el a felhasználói felület tervezésében.
Flat design
A Flat Design a szkeuomorfizmussal ellentétben a minimalizmust és a letisztultságot hangsúlyozza. A felhasználói felületek egyszerűek, textúrák, árnyékok és térbeli hatások nélkül. Az emberi interakció kiemelése helyett inkább a letisztult megjelenésre fókuszál. Ennek eredményeképpen a flat design csökkenti a weboldalak és alkalmazások terhelését, illetve az egyszerű geometriai formáknak köszönhetően könnyen skálázható, így rugalmasabb megjelenítést kínál az asztali és mobil környezetben.
Mivel a flat design esetében az egyes elemeknek nincsenek árnyékai, textúrái, amelyek közvetlen visszajelzést nyújthatnak a felhasználóknak azok funkcióiról, ezért nehéz különbséget tenni a gombok, vezérlők és más interaktív elemek között. Ennek következtében a felhasználók kevésbé valószínű, hogy megtalálják és használják a kívánt funkciókat. Így a flat design néha rontja a konverziós rátát, vagyis kevesebb átkattintás lesz az oldalon, mint a szkeuomorf felületeknél.
A flat design stílus alapjai a svájci tipográfiai stílusra, a modernizmusra és a Bauhaus művészeti mozgalomra vezethetők vissza. A svájci tipográfiai stílus a 20. század elejétől alakult ki, és az egyik legfontosabb hatás volt a grafikai tervezési szcénára. A stílus jellemzői a tiszta, egyszerű vonalvezetés, a geometrikus formák, a szabályos, precíz betűkészletek és a kontrasztos színek használata. A svájci tipográfiai stílus a négyzetes formákra és a szabályos térhasználatra épül, ami nagymértékben segíti a rendszerezett információ átadását.
A modernizmus pedig a minimalista megközelítést, az egyszerű formákat és a színek redukálását tükrözi, amelyek mind a flat design jellemzői. A Bauhaus funkcionális formák és a technológiai újítások támogatását jelenti, amelyek mind a flat design alapjai. Ezek a hatások együtt hozták létre a flat design egyszerű, minimalista és funkcionális megközelítését.
A Microsoft Zune MP3 lejátszója a 2000-es évek közepén jelent meg, és a vállalat a flat design elvei alapján tervezte a felhasználói felületét. A Microsoft Zune lejátszó nem volt sikeres a piacon, és sok kritika érte a funkcionalitását is. Bár végül az iPoddal szemben alulmaradó Zune fejlesztését és értékesítését a Microsoft leállította, a cég design filozófiája megjelent a Windows Phone-ban, és a Windows 8 felületén Microsoft Design Language (MDL) néven. Az MDL célja, hogy egységes felületet biztosítson a Microsoft termékei számára, beleértve a Windows operációs rendszert, az Xbox konzolt, a Surface táblagépet, valamint az Office szoftvercsomagot.
Az iOS 7 megjelenése a fontos fordulópont volt a mobilos interfész tervezésben, mivel ezzel a kiadással az Apple is áttért a flat designra a korábbi szkeuomorf tervezési irányzatról. A változás az Apple általános design filozófiájának átformálását jelentette, és nagymértékben befolyásolta a mobilos tervezési trendeket.
Deisgn rendszerek
Material design
A Material Design egy 2014-ben a Google által (Quantum Paper kódnéven) létrehozott design nyelv, ami egységes megjelenést és felhasználói élményt nyújt az Android rendszer és a Google alkalmazások felhasználói számára.
Az első kiadás Quantum Paper kódnéven jelent meg, és azóta folyamatosan fejlesztik, hogy megfeleljen a változó felhasználói igényeknek és az új technológiáknak.
Szemben a flat designnal, ami inkább egy struktúrálatlan design szemlélet gyűjtőneve, a Material Design világos irányelvekkel és dokumentációval segíti az alkalmazás fejlesztőket, amit a Google jelenleg Material Design 3 (vagy Material You) néven
A Material Design a flat design minimalizmusát ötvözi a szkeuomorf design tér hatásának érzetével, így valósághűbb és könnyen értelmezhető, de mégis megőrzi a letisztult és egyszerű kinézetet. Ennek a megközelítésnek a célja, hogy a felhasználók számára élvezetes és interaktív élményt nyújtson, anélkül, hogy vesztene a felület a funkcionalitásából.
A szkeuomorf design anyag szerűsége a Material Design 2-es verzióig megállt a papír fizikai jellemzőinek térbeli érzékeltetésénél, természetesen szemeteskukák és polaroid kamerák nélkül.
Ez a papíralapú anyagszemlélet konzisztenssé tette az Android alkalmazások felületeit, viszont mára elavulttá, unalmassá és túl kötötté vált ahhoz, hogy megfeleljen az kreativitás és a testreszabhatóság igényeinek.
Az Android 12 2021 májusi megjelenését követően a Google október végén bejelentette, hogy teljes mértékben átalakítja tervezési nyelvét, így megszületett a Material Design 3, azaz a Material You.
További olvasmányok
https://xd.adobe.com/ideas/principles/web-design/flat-vs-material-skeuomorphic-examples/
https://www.nngroup.com/articles/flat-ui-less-attention-cause-uncertainty/
