Már a 2010 -es Mobile World Congress -en Eric Schmidt, a Google vezérigazgatója azt állította, hogy a designereknek a tervezés során egyre inkább be kell tartaniuk a Mobile First Design elvet ha a termékeiket szeretnék eljuttatni a felhasználókhoz. Mit jelent a Mobile First Design? Miért fontos? Hogyan lehet jól csinálni? Kell -e erről beszélni 2019 -ben?

Responsive Web Design (RWD)

A Mobil First Design megértéséhez először tudnunk kell mit jelent a Responsive Web Design (RWD). A RWD olyan módszer, ami lehetővé teszi, hogy a termék megfelelően illeszkedjen az eszközhöz, amin a felhasználó megtekinti. Mindegy, hogy mobil, táblagép vagy desktop számítógépről van szó, a design minden eszközön megfelelően néz ki. A jól olvashatóságért pedig nem kell nagyítani görgetni swipe -olni.
A tervezés során két koncepció létezik a “Progressive Advancement” ami a kicsitől a nagyobbig elvet követi és a “Graceful Degradation” ami az elegáns kiiktatás elvét követi.

Kicsitől a nagyobbig elv

Ilyenkor a design egy kisebb eszközhöz készül és a legfontosabb funkciókat és szolgáltatásokat tartalmazza. Ez után már könnyebben lehet egy fejlettebb eszköz által használt funkciót, interakciót, effektet hozzáadni, ami segíti a felhasználói élményt.

Graceful Degradation

Az elegáns kiiktatás elve pont ellenkezőleg a nagyobb eszközzel kezdi a tervezést és ez után következik a kiiktatás amikor egyes részeket egyszerűen elhagynak a mobilos verzióból.

Ha UI / UX designerként az asztali verzióval kezded el a design -t, akkor elkerülhetetlenül a desktop felhasználás előnyeit kezded el használni. Észrevétlenül azokat az effekteket tervezed bele, amit egy egér támogat, de a mobil felhasználás nem. A design -t nagyon feldobja egy HD kép, egy összetett táblázat vagy egy részletes diagram de ez mobilon kevésbé felhasználóbarát. Az elkészült desktop verzió csodálatos lesz, de mobilon csak akkor lesz eladható ha erre plusz megoldásokat és ötleteket tervezel. Ez nagyon nehéz, hisz a kiiktatás elv mentén a mobil változat utólag gondolkodik, egy nem teljes termékről, amit már egyszer megterveztél.

Mobile First Design

Ha a mobil eszközzel kezded a design kialakítását, olyan korlátozások mellett, mint a sávszélesség, vagy a képernyő mérete, akkor muszály megragadnod a termék legfontosabb elemeit. Így egy egyszerűbb de funkcionalitásában sokkal letisztultabb és teljesebb termék készül el. Ezt lépésről lépésre bővíteni vagy a fejlettebb eszközök előnyeit kihasználva kiegészíteni plusz funkciókkal sokkal egyszerűbb. Ez lehet a fő oka annak, hogy ezt a stratégiát sokkal szívesebben használják.

Azért is érdemes a “Mobile First Design” elvet követni, hisz egyre többen használnak mobilt. Nemcsak a weboldalak böngészéséhez, hanem vásárláshoz, fizetéshez is mobilt használunk és a mobil használók száma csak nőni fog. Ezért különösen fontos, hogy jól átgondolt és a technológia korlátait figyelembe véve készüljön a mobil változat.

Hogyan lehet jól csinálni a Mobile First Design -t?

Ha jól akarod csinálni, a kulcs a fontos tartalmi elemek megtalálása és ezek sorrendbe állítása. Ha hotel weboldalról van szó akkor a javasolt a hotel nevével, a különlegességeivel kezdeni. Ezután egyből időválasztóval folytatni, ahol gyorsan és könnyen le tudja foglalni a szobát a felhasználó. Majd a rendelések, vevőszolgálat és a végén az ajánlatok és a reklám.

Ahány mobil annyi felbontás. Érdemes itt is a kisebbtől a nagyobbig elvet követni. Megkeresni a legkisebb felbontást ami a Google ajánlásával jelenleg 320 pixel. A design tervet érdemes erre optimalizálni. Különben a fejlesztő sakkozik azokkal az elemekkel amik már nem férnek el a kis felbontáson.

Konklúzió

A „Mobile First Design” elv fontos szerepet játszik a design tervezésben. Egyrészt csökkenti a tervezési időt így javítja a designer termelékenységét. Másrészt arra kényszeríti a tervezőt, hogy fordítson nagyobb figyelmet a termék tartalmára, ami segíti a praktikus, jól használható tervek készítését. Mivel az okostelefonok egyre elterjedtebbek, a mobil felhasználást már nem lehet úgy tekinteni, mint egy szűkebb felhasználói réteg. A design tervezésben pedig nem hagyhatjuk figyelmen kívül.

Humli Miklós

Szerző Humli Miklós

Régóta dolgozom együtt kis-, közép- és nagyvállalalatokkal az arculattól a nyomtatott anyagokon keresztül az online megjelenésig. Az elmúlt évtizedekben UI, UX designerként, webfejlesztőként és mobil fejlesztőként használt keretrendszerek, szoftverek és technológiák alkalmazása során értettem meg, hogy hatékonyan működni csakis úgy lehet, hogyha megtalájuk a feladathoz a legmegfelelőbb eszközt.

További bejegyzések: Humli Miklós