Komplex web és mobil UX/UI tervezés

Web és mobil dizájn

A Web és mobil dizájn akkor jó, ha ugyanaz a szolgáltatás laptopon és telefonon is érthető, gyors és nyugodt marad. Ez nem csak látvány kérdése. A szerkezet, a gombok helye, a tartalom ritmusa és a műveletek sorrendje legalább ilyen fontos. Sokan ott hibáznak, hogy először csak a nagy képernyőre gondolnak, és a mobil nézetet később próbálják megmenteni. Ilyenkor a felület szétesik, a fontos elemek lecsúsznak, és a felhasználó ideges lesz. Szerintem a jó webes és mobil felület nem akar túl sokat mutatni egyszerre. Inkább pontosan adagolja, mi mikor látszódjon.

Az utóbbi évek magyar szolgáltatói oldalain és stúdióoldalain nagyon hasonló témák térnek vissza. Sok helyen kiemelik a reszponzív működést, az átlátható felhasználói élményt, az egyedi felületet, a gyors betöltést és azt, hogy a tervezés többféle eszközre készül. Angol nyelvű brit és amerikai szolgáltatói oldalaknál ugyanez más szavakkal jelenik meg, de a lényeg ugyanaz marad. Ott is a tartalom elsőbbsége, a mobil használat, a világos útvonal és a fejlesztéssel összehangolt tervezés kerül elő. Ez nem véletlen. A felhasználó mindenhol ugyanazt várja. Ne kelljen keresgélnie. Ne kelljen találgatnia. És ne kelljen újra megtanulnia az oldalt minden képernyőméreten.

Én személy szerint azokat a felületeket szeretem, ahol a rend az első benyomás. Nem a látványos trükk, nem a túl sok szín, nem a mozgó részletek. Volt olyan megbízás, ahol az ügyfél modern megjelenést kért, de amikor végignéztük a képernyőket, kiderült, hogy a fő gond a zavaros szerkezet volt. A nyitóoldalon sok blokk szerepelt, mobilon pedig ugyanaz az anyag már teljesen fárasztóvá vált. Miután rendbe tettük a sorrendet és visszafogtuk a díszítést, az egész rendszer könnyebb lett. Nekem ez mutatja, hogy a Web és mobil dizájn valójában használati kérdés.

Felépítés webre és mobilra

A jó felépítés egyik alapja, hogy a fontos elemek mindkét felületen megtalálják a helyüket. Asztali nézetben több tér áll rendelkezésre, ezért könnyű túl sok mindent kitenni. Mobilon ez rögtön megbosszulja magát. A túl hosszú fejlécek, a széles táblázatok, a sok gomb és a zsúfolt kártyák gyorsan kényelmetlenek lesznek. Sok magánmegrendelő ilyenkor azt gondolja, hogy a mobil csak kisebb változat. De ez ritkán igaz. A mobil felület sokszor más súlypontot kíván.

Szerintem a webes és mobil felület tervezésénél a legjobb kérdés az, hogy mi az első három feladat, amit az ember ténylegesen elvégez. Ha ez világos, akkor a szerkezet is könnyebben kialakul. Hol keres. Hol olvas. Hol küld adatot. Hol kér árajánlatot. Hol lép vissza. Ha ez nincs átgondolva, akkor a felület szép lehet, csak éppen lassú marad. Sokszor látom, hogy a megrendelő minden információt az első képernyőre akar tenni. De a valóságban a kevesebb jobb. Egy tiszta nyitófelület többet ér, mint egy zsúfolt, de mindent elmondani akaró oldal.

Volt egy eset, amikor a kliens azt mondta, hogy a mobilos verzió rosszabbul teljesít, pedig ugyanazt tudja, mint az asztali. És valóban ugyanazt tudta. Csak a felhasználó telefonon kétszer annyit görgetett, és háromszor többet keresett ugyanazért az információért. A gond nem a tartalommal volt, hanem a sorrenddel. Miután a fontos blokkok feljebb kerültek, a másodlagos részek pedig hátrébb, az egész sokkal nyugodtabb lett. A Web és mobil dizájn itt nem új látványt jelentett, hanem jobb ritmust.

Gyakori hibák a képernyők között

A leggyakoribb hiba az, hogy a webes nézet logikáját változtatás nélkül próbálják ráerőltetni a mobilra. Ilyenkor a menü túl hosszú lesz, a gombok túl közel kerülnek egymáshoz, a szöveg túl keskeny sávban fut, és a felhasználó hamar elveszti a türelmét. Sokan hibáznak ott is, hogy ugyanazt a hangsúlyt adják minden elemnek. Ettől a képernyő szétesik. A felhasználó nem tudja, hol kezdje.

Én azt látom, hogy a rossz felület ritkán egyetlen nagy hibából áll. Inkább sok apró kellemetlenségből. A címsor túl hosszú. A kártya túl magas. A fő gomb lejjebb csúszik. A szűrő nehezen elérhető. A kereső gyenge helyre kerül. Külön külön egyik sem tűnik súlyosnak. De együtt már fárasztják az embert. És ez az, amit a megrendelő gyakran csak úgy fogalmaz meg, hogy valami nem kényelmes.

Volt olyan munka is, ahol a megerősítő gomb asztali nézetben még rendben volt, mobilon viszont a képernyő aljára csúszott egy hosszú szövegblokk után. A felhasználó minden alkalommal végiggörgetett, majd vissza akart lépni. Nem technikai hiba volt, mégis bosszantó. Sok ilyen helyzetből látszik, hogy a mobilos és webes tervezés nem lehet utólagos javítás. Már az elején együtt kell kezelni őket.

Szerintem az is gyakori gond, hogy a megrendelő látványos kezdőoldalt akar, miközben a belső nézetekkel nem foglalkozik. Pedig a legtöbb idő nem a nyitóoldalon telik. Hanem a listákon, az űrlapokon, a keresésen és a részletes nézeteken. Ha ezek nehezek, akkor a szép első benyomás gyorsan elillan. Egy jó felülettervező ezt hamar kiszúrja. Nem csak a borítóra figyel.

Árak és reális költségek

Az ár itt attól függ, hogy néhány képernyőt kell rendbe tenni, vagy teljes rendszerben kell gondolkodni. Más költség, ha csak egy egyszerű weboldal és annak mobil nézete készül, és más, ha több oldaltípus, űrlap, listanézet és részletes oldal is tartozik a feladathoz. Szerintem a túl olcsó ajánlat itt is gyanús. Olcsóbban sokan vállalnak gyors rajzot vagy pár látványképet, de az még nem jelent használható rendszert. A valódi munka ott kezdődik, amikor a képernyők egymással is összhangban maradnak.

Az én véleményem az, hogy 30.000 alatt ritkán készül olyan munka, amely egyszerre weben és mobilon is valóban átgondolt. Lehet gyors vázlatot kapni, de tartós rendszert nem mindig. Olcsóbban 15.000 körül legtöbbször csak egy két képernyő születik, szabályrendszer nélkül. Ez később majdnem mindig visszaüt. Személy szerint én inkább a tiszta logikára költenék, mint a túl látványos részletekre. A gyengébb szerkezet sokkal többe kerül idegben és javításban.

Szakember választása

A megfelelő szakember kiválasztása itt különösen fontos, mert a Web és mobil dizájn könnyen félremegy, ha valaki csak képeket készít, de nem gondolkodik használatban. Olyan tervező kell, aki látja, hogy a felhasználó hol akad el, mit akar először megtalálni, és melyik képernyőn mi a fő döntés. Nem elég szépen rajzolni. Tudni kell rendszert építeni.

Én személy szerint jobban bízom abban, aki kérdésekkel kezd. Ki fogja használni a felületet. Telefonról jön többet vagy számítógépről. Rövid műveletet végez vagy hosszabb olvasást. Lesz keresés. Lesz bejelentkezés. Lesz rendelés vagy űrlap. Ha valaki ezek nélkül rögtön kész megoldást ígér, az nekem túl gyors. A jobb szakember nem fél egyszerűsíteni sem. Megmondja, ha valami felesleges. És ez jó jel.

Sokan ott hibáznak, hogy csak portfólió alapján döntenek. A szép képernyők persze számítanak, de önmagukban kevesek. Érdemes megnézni, hogyan magyarázza a munkáját az illető. Tud e beszélni sorrendről, hangsúlyról, kattintási útról, olvashatóságról. Tud e példát mondani arra, mikor kellett egyszerűsíteni egy oldalt. Volt már olyan ügyfél, aki azért választott új tervezőt, mert az előző minden kérésre igent mondott, de a végeredmény túlzsúfolt lett. Az új szakember kevesebbet ígért, mégis jobb rendszert adott.

Qjob.hu oldalon is lehet olyan tervezőt találni, aki magánmegrendelésben vállal ilyen feladatot. Itt szerintem nem csak az ár számít. Az is fontos, hogy mennyire tisztán látja a különbséget a webes és a mobilos használat között. Ha valaki rögtön beszél a ritmusról, az első műveletről és a túlzsúfolt részekről, az többnyire érti a munkát.

Budapest és a környékbeli egyeztetés

Ha valaki személyes egyeztetést szeretne, Budapest jó kiindulási pont. A belső kerületekben könnyű gyors találkozót szervezni, átbeszélni a képernyőket és együtt végignézni, hol csúszik szét a logika. A XI. kerület, a XIII. kerület és Zugló gyakran kényelmes hely ilyen digitális feladatokhoz, de a budai oldalon is sok szabadúszó dolgozik. És az agglomerációból is sokan vállalnak ilyen munkát. Érd, Budaörs vagy Dunakeszi felől ugyanúgy lehet jó szakembert találni.

De őszintén szólva a távolság ritkán döntő. A fontos inkább az, hogy a megrendelő tudjon mutatni valós helyzeteket. Hol lassú a mobilos használat. Hol túl zsúfolt a webes nézet. Hol nem találja meg gyorsan a fő gombot az ember. Ha ez megvan, a közös munka online is jól haladhat. Budapest előnye inkább a gyors egyeztetés, nem feltétlenül a jobb minőség.

Szerintem a jó webes és mobil felület végül nem attól lesz erős, hogy látványos, hanem attól, hogy természetes. A felhasználó nem akad el. Nem bosszankodik. Nem keresgél feleslegesen. És ez a legjobb jel. Ha a rendszer szinte magától értetődőnek hat, akkor a Web és mobil dizájn elérte a célját.