Android táblagépekhez készült reszponzív felhasználói felület fejlesztése

Adaptív felület fejlesztés Android táblagépekhez

Az Adaptív felület fejlesztés akkor szükséges, ha egy alkalmazás vagy webes rendszer nem csak telefonon, hanem Android táblagépen is kényelmesen használható kell legyen. A cél nem pusztán az, hogy a felület nagyobb képernyőn is megnyíljon. A jó adaptív megoldás átrendezi a tartalmat, jobban kihasználja a szélesebb kijelzőt, és nem hagy üres vagy zavaró részeket a képernyőn.

Magánügyfélként sokan akkor keresnek online szakembert, amikor egy meglévő alkalmazás táblagépen rosszul néz ki. Túl kicsik a gombok, szétesik az elrendezés, a lista túl hosszú, a részletek külön képernyőre kerülnek, vagy a felhasználó sokat görget. Én azt látom, hogy ez nem csak esztétikai probléma. Ha a kezelőfelület kényelmetlen, a felhasználó lassabban dolgozik, többet hibázik, és hamarabb elhagyja az alkalmazást.

Az adaptív felület készülhet új Android alkalmazáshoz, meglévő mobilalkalmazás átalakításához, belső admin felülethez, ügyfélkezelő rendszerhez, rendeléskezelőhöz, oktatási alkalmazáshoz vagy bármilyen távoli használatra szánt digitális eszközhöz. A munka lényege az, hogy a felület igazodjon a képernyőmérethez, az érintéses használathoz és a valós munkafolyamathoz.

A Qjob.hu felületén magánszemély is kereshet olyan szabadúszó fejlesztőt vagy felülettervezőt, aki távolról segít Android táblagépekhez igazított alkalmazásban, felületjavításban vagy teljes képernyőszerkezet áttervezésében. Itt érdemes már az első üzenetben megadni, hogy új fejlesztésről van szó, vagy egy meglévő felületet kell átalakítani.

Android táblagépes felület célja

Az Android táblagépes felület célja az, hogy a nagyobb képernyő ne csak felnagyított telefonos nézet legyen. Táblagépen több információ fér el, de ez nem jelenti azt, hogy mindent egyszerre kell megmutatni. A jó felület rendezetten használja a helyet. Például bal oldalon lista, jobb oldalon részletek. Vagy felül szűrők, alatta áttekinthető tartalom.

Szerintem az egyik legfontosabb kérdés az, hogy a felhasználó ülve, kézben tartva, állványon vagy munka közben használja-e a táblagépet. Egy raktári, ügyviteli vagy oktatási felület más logikát kíván. Ha a felhasználó gyorsan akar rögzíteni adatot, nagy gombokra és kevés lépésre van szükség. Ha hosszabb adatot olvas, akkor a tagolás és a kereshetőség fontosabb.

A táblagépes elrendezésben gyakori a kétoszlopos nézet, a rugalmas kártyarendszer, az álló és fekvő tájolás külön kezelése, valamint a nagyobb érintési felületek használata. Ezek nem díszítőelemek. Ezek a mindennapi használatot gyorsítják.

Tapasztalatom szerint a jó adaptív felület nem feltétlenül látványosabb. Inkább nyugodtabb és érthetőbb. A felhasználó nem keresi, hová tűnt a gomb. Nem kell fejben kitalálnia, merre menjen tovább. A képernyő vezeti a munkát.

Adaptív felület fejlesztés árak

Az Adaptív felület fejlesztés ára attól függ, hogy csak néhány képernyőt kell javítani, vagy teljes alkalmazásszerkezetet kell áttervezni. Egy meglévő, rendezett kódbázisban a munka gyorsabb lehet. Ha viszont az alkalmazás régi, nincs dokumentáció, vagy minden képernyő külön logikával készült, a fejlesztőnek több idő kell a javításhoz.

A túl olcsó munka ezen a területen gyakran gyengébb minőséget jelent. Nem azért, mert minden alacsony ár rossz. Hanem azért, mert a reszponzív és adaptív viselkedést tesztelni kell több képernyőméreten, álló és fekvő nézetben, különböző Android verziókon. Ha ez kimarad, a felület első ránézésre javulhat, de használat közben még mindig hibás marad.

Ezek az árak tájékoztató jellegűek távoli munkára. Ha a megrendelőnek vannak kész képernyőképei, hibaleírásai és pontos céljai, az ajánlat is pontosabb lesz. Ha csak annyi szerepel a kérésben, hogy táblagépen legyen szép, akkor a szakembernek először fel kell mérnie a teljes felületet.

Felülettervezés és képernyőméretek

A felülettervezés Android táblagépeknél nem egyetlen képernyőméretre készül. Több eszköz, több felbontás és több arány létezik. Ezért a fejlesztőnek rugalmas szerkezetben kell gondolkodnia. Nem jó megoldás, ha minden elem fix helyre és fix méretre kerül. Az ilyen felület könnyen szétesik másik eszközön.

Az adaptív megközelítés azt jelenti, hogy a tartalom a helyzethez igazodik. Ha nagyobb a kijelző, több információ jelenhet meg. Ha kisebb, a rendszer egyszerűbb nézetre vált. Ha fekvő a táblagép, lehet két panel. Ha álló, jobb lehet a szakaszos megjelenítés. Ezeket előre kell tervezni, nem a végén toldozni.

Sokan ott hibáznak, hogy a telefonos felületet egyszerűen széthúzzák. A nagy üres hely, a túl széles szövegsor, a furcsán elnyúló gomb vagy a középre ragadt kicsi űrlap mind azt mutatja, hogy nincs valódi táblagépes logika. Ez használat közben zavaró.

Én azt tartom jó megoldásnak, ha a legfontosabb képernyőkkel kezdünk. Főoldal, lista, részletnézet, űrlap és beállítások. Ha ezek jól működnek, a többi képernyő már könnyebben igazítható hozzájuk. Nem kell minden apró nézetet egyszerre újratervezni, de a fő mintáknak egységesnek kell lenniük.

Online munka menete

Az online munka menete ennél a feladatnál jól szervezhető, ha a megrendelő képernyőképeket, rövid videót vagy hozzáférést ad a tesztverzióhoz. A szakember így látja, hol törik a felület, hol túl kicsi a gomb, hol nem fér ki a szöveg, és hol rossz a görgetés. A pontos példa sokkal többet ér, mint az általános leírás.

Az első lépés gyakran egy rövid felület audit. A fejlesztő vagy felülettervező megnézi a meglévő nézeteket, és jelzi, mi gyors javítás, mi szerkezeti gond, és mi igényel nagyobb áttervezést. Ezután készülhet vázlat vagy közvetlen fejlesztési terv.

A második lépés a fő képernyők átalakítása. Ilyenkor dől el, hogyan működik a lista, a részletnézet, az űrlap és a navigáció. Jó, ha a megrendelő már ekkor kipróbálja táblagépen, nem csak számítógépen nézi meg a képernyőképet. Az érintéses használat más, mint az egérrel végzett ellenőrzés.

A harmadik lépés a tesztelés és javítás. Itt érdemes konkrét hibákat gyűjteni. Például melyik képernyőn, milyen tájolásban, milyen eszközön történt a gond. Az olyan visszajelzés, hogy rosszul néz ki, kevés. A szakember gyorsabban javít, ha pontos adatot kap.

Megfelelő szakember kiválasztása

A megfelelő szakember kiválasztása adaptív felületnél nem csak fejlesztési kérdés. Kell hozzá felhasználói szemlélet is. Egy programozó meg tudja oldani, hogy az elemek átméreteződjenek, de attól a felület még nem biztos, hogy kényelmes lesz. Egy jó szakember érti, hogyan dolgozik a felhasználó táblagépen.

Érdemes olyan szabadúszót keresni, aki tud példát mutatni reszponzív vagy adaptív felületre. Nem baj, ha nem ugyanilyen iparágból származik a munka. A fontos az, hogy legyen tapasztalata listák, űrlapok, kártyák, navigáció és érintéses használat tervezésében.

A jó szakember visszakérdez. Milyen Android táblagépeken kell működnie a felületnek. Fontos-e a fekvő nézet. Hány adat látszódjon egyszerre. Kik használják. Gyors adatbevitel vagy hosszabb olvasás a fő feladat. Ha ezek a kérdések elmaradnak, a munka könnyen csak vizuális javítás lesz, nem valódi használhatósági fejlesztés.

Volt olyan eset, amikor egy ügyfél csak nagyobb gombokat kért egy belső alkalmazásba. A felmérés után kiderült, hogy a fő gond nem a gombméret volt, hanem az, hogy a lista és a részletnézet külön képernyőn nyílt meg. Táblagépen sokkal jobb lett a kétpaneles megoldás. Kevesebb kattintás kellett, és gyorsabb lett a munka.

Tesztelés Android táblagépen

A tesztelés Android táblagépen nem maradhat ki. A felület nem attól lesz kész, hogy egy képernyőképen jól néz ki. Ki kell próbálni álló és fekvő módban, különböző kijelzőméreteken, hosszabb szöveggel, üres adattal, sok adattal és hibás bevitellel is. Ezek a helyzetek éles használatban hamar előkerülnek.

Fontos a gombok mérete és távolsága. Táblagépen gyakran kézzel érintik a felületet, nem egérrel. Ha két gomb túl közel van egymáshoz, hibás művelet történhet. Ha egy mező túl kicsi, az adatbevitel lassú lesz. Ha a görgetés nem egyértelmű, a felhasználó elveszti a ritmust.

A tesztelésnél figyelni kell a teljesítményre is. A nagyobb felület sokszor több adatot mutat. Ez lassulást okozhat, ha a lista, kép vagy grafikon nincs jól kezelve. A felületnek nem csak szépnek, hanem gyorsnak is kell lennie.

Szerintem a legjobb teszt az, amikor a megrendelő valós feladatot végez a felületen. Nem csak végignézi, hanem használja. Rögzít, keres, módosít, ment, visszalép. Ilyenkor derül ki, hogy a szerkezet valóban segít-e.

Gyakori hibák adaptív felületnél

A gyakori hibák közé tartozik a túl széles szövegsor, a rosszul elhelyezett gomb, a felesleges üres terület és a telefonos menü változatlan használata. Ezek külön-külön apróságnak tűnnek, de együtt nagyon kényelmetlenné teszik a felületet.

Másik hiba, hogy a tervezés csak egyetlen táblagépre készül. Ha azon jól néz ki, a megrendelő azt hiszi, kész a munka. De másik kijelzőn a szöveg törhet, a kártyák elcsúszhatnak, az űrlap pedig túl hosszú lehet. Ezért kell több méretben gondolkodni.

Gondot okozhat az is, ha nincs külön szabály az álló és fekvő nézetre. Egy alkalmazás fekvő módban lehet nagyon kényelmes, de álló módban zsúfolt. Vagy fordítva. A fejlesztőnek ezt nem érzésre, hanem használati helyzet alapján kell eldöntenie.

Az adaptív felület fejlesztés akkor sikeres, ha a felhasználó nem veszi észre a technikai megoldást. Csak azt érzi, hogy a képernyő kényelmes, a gombok elérhetők, a tartalom érthető, és a munka gyorsabban megy. Nem kell túlmagyarázni. A jó felület csendben működik.