Loading animációk készítése a felhasználói élmény javítása érdekében

Animációk a felhasználói élményhez

Az Animációk a felhasználói élményhez akkor működnek jól, ha gyorsan érthetővé teszik, mi történik a felületen. Nem dísznek kellenek, hanem azért, hogy a felhasználó lássa a visszajelzést, a váltást és a következő lépést. Egy magánszakemberrel végzett online munka ezért akkor hasznos, ha már az elején kiderül, milyen képernyők, gombok, állapotok és várakozási helyzetek kapnak mozgást. Én azt látom, hogy a legtöbb privát megrendelő nem hosszú látványos mozgást kér, hanem kiszámítható viselkedést. Ez különbség. A jó felületi mozgás segít eligazodni, a rossz viszont kizökkent. Tapasztalatom szerint ezen a területen a legfontosabb kérdés nem az, hogy legyen-e mozgás, hanem az, hogy hol érdemes és hol kell megállni.

Sokan azért keresnek online specialistát, mert a kész terv statikus képeken még rendben van, de használat közben darabosnak hat. Ilyenkor a szabadúszó tervező vagy mozgástervező nem csupán effektet ad hozzá, hanem rendet rak a folyamatokban. A mikromozgások visszajelzést adnak kattintásra, a képernyőváltások csökkentik az elveszettség érzését, a töltési állapotok pedig türelmesebbé teszik a várakozást. A Nielsen Norman Group szerint a hasznos mozgás legyen visszafogott, rövid és egyértelmű, főleg visszajelzésre, állapotváltásra és navigációs támpontokra használva. A túl hosszú animáció már lassít és zavarhatja a felhasználót. citeturn591509search0turn591509search1

Mikor segítenek ezek az animációk

Ezek az animációk akkor adnak valódi értéket, amikor valamit meg kell mutatni a felhasználónak azonnal. Például sikeres mentést, hibát, új panel megnyílását, lezárult folyamatot vagy azt, hogy egy elem hová került. Itt a cél az, hogy ne kelljen találgatni. Szerintem a privát ügyfelek gyakran ott könnyebbülnek meg, amikor meglátják, hogy egy kis mozgás mennyivel tisztábban jelzi a rendszer állapotát, mint három plusz mondat a képernyőn.

A jó mozgás különösen fontos olyan felületeknél, ahol több egymás utáni lépés van. Ilyen lehet űrlapkitöltés, rendelési folyamat, regisztráció, foglalás vagy dokumentumfeltöltés. A felhasználó itt nem csodát vár. Inkább azt szeretné tudni, hogy jó helyen jár-e, elmentődött-e az adat és mennyi van még hátra. Az Interaction Design Foundation leírása is azt emeli ki, hogy a felületi animáció képes intuitívabbá és érthetőbbé tenni az interakciót, de csak akkor, ha nem öncélú és nem túlzó. citeturn111886search2turn111886search19

Animációk ára és tipikus csomagok

Az ár attól függ, hogy pár egyszerű mikromozgásról van szó, vagy egy teljes folyamat mozgásrendszeréről. A szabadúszó szakember többnyire képernyőnként, elemenként vagy feladatonként áraz. A túl olcsó munka ezen a területen gyakran gyengébb minőséget jelent. Főleg akkor, ha nincs benne gondolkodás a használhatóságról, csak gyors látványelemek kerülnek a felületre. Én azt látom, hogy a korrekt ár nem a legtöbb képkockát fizetteti meg, hanem a döntéseket. Azt, hogy mi maradjon statikus és mi kapjon mozgást.

Ezek irányárak. A végső összegre hat a képernyők száma, a módosítások köre, az átadás részletessége és az, hogy csak terv készül-e vagy működő bemutató is. És számít a határidő is. A gyors munka általában drágább, de nem mindig jobb. Itt is az a fontos, hogy a feladat pontos legyen.

Szabadúszó szakember választása animációkhoz

A jó választásnál először nem az számít, mennyire látványos a portfólió, hanem hogy a szakember meg tudja-e indokolni a mozgás célját. Ha csak azt mondja, hogy így modernebb, az kevés. Ha viszont elmagyarázza, hogy melyik mozgás mire ad visszajelzést, mennyi ideig tartson és hogyan csökkenti a bizonytalanságot, már sokkal közelebb jár a jó megoldáshoz. A Qjob.hu felületén és ezen az oldalon ezért érdemes olyan privát szakembert keresni, aki tud példát mutatni valós állapotváltásokra, nem csak látványos bemutatókra.

Nézd meg, hogyan kommunikál. A mozgástervezés online együttműködésben akkor hatékony, ha a szakember kérdez a célról, a felhasználóról és a technikai korlátokról. Fontos az is, hogy milyen formában adja át az eredményt. Egy magánszakember lehet nagyon pontos és gyors, de az is lehet, hogy szépen dolgozik, csak nehezen követhetően dokumentál. Szerintem a legjobb jel az, ha már az első üzenetben rendet tesz a feladatban. Nem túlígér, hanem pontosít.

Online munkamenet és átadás

Az online munkának legyen világos menete. Először rövid feladatleírás kell. Utána jöhetnek a képernyők, drótvázak vagy kész tervek. A specialistának tudnia kell, melyik állapotból melyikbe jut a felhasználó. Ha ez nincs leírva, a mozgás is bizonytalan lesz. Sokan ott hibáznak, hogy csak annyit írnak, legyen kicsit élőbb a felület. Ebből rendszerint félreértés lesz.

Egy tiszta folyamat általában négy lépésből áll. Brief vagy rövid leírás, majd első javaslat, ezután módosítás, végül átadás. Az átadás történhet videóval, kattintható bemutatóval vagy részletes mozgási leírással. A Nielsen Norman Group ajánlása alapján az egyszerű visszajelző mozgások nagyjából 100 ezredmásodperc körül működnek jól, a nagyobb képernyőváltások pedig gyakran 200 és 300 ezredmásodperc között kellemesek. 500 ezredmásodperc körül már sok animáció lassúnak hat. Ezért az átadásnál nem elég azt írni, hogy finoman csússzon be. Pontos idő és logika kell. citeturn591509search1

Volt olyan eset, amikor egy ügyfél azért volt elégedetlen a korábbi munkával, mert a tervező gyönyörű mozgásokat rajzolt, de a fejlesztő nem kapott egyértelmű irányt. A képernyőváltás hol gyors volt, hol nehéz, a gombok pedig máshogy reagáltak ugyanazon a felületen. Amikor újra kellett szervezni a munkát, végül nem több animáció készült, hanem kevesebb. Csak éppen következetesebb.

Tipikus hibák a felhasználói élmény animációinál

Az egyik leggyakoribb hiba a túlzás. A mozgás felhívja magára a figyelmet, ezért könnyű vele átesni a másik oldalra. A Nielsen Norman Group szerint pont ez a veszélye is. A szemünk érzékeny a mozgásra, ezért a felesleges effekt eltereli a figyelmet a feladatról. citeturn591509search0

A másik hiba az, amikor minden elem másképp viselkedik. Egyik gomb pattog, a másik halványul, a harmadik oldalra csúszik. Ettől a felület nem gazdagabb, hanem széteső lesz. És gyakori az is, hogy a megrendelő csak a látványt nézi, nem a használati helyzetet. Pedig a felhasználói élményhez kapcsolódó animációk lényege épp az, hogy kisebb legyen a bizonytalanság. Nem az, hogy hosszabb legyen az élmény.

Gond lehet az akadálymentesítés figyelmen kívül hagyása is. Vannak felhasználók, akiket a túl sok vagy túl gyors mozgás zavar. Ezért jó, ha a szakember eleve úgy tervez, hogy a rendszer visszafogott maradjon. Tapasztalatom szerint ez sokkal fontosabb, mint az, hogy első pillantásra látványos legyen. A nyugodt felület ritkán megy tönkre a használat során. A túl okos viszont gyorsan.

Mit érdemes előre elküldeni a szakembernek

Minél pontosabb a kiindulás, annál jobb lesz a végeredmény. Küldd el a képernyőket, a folyamat rövid leírását, a célfelhasználót és azt, melyik ponton érzed bizonytalannak a használatot. Ha van régi terv, azt is. És írd le, milyen formában szeretnéd megkapni az eredményt. Elég egy bemutató videó, vagy szükség van fejlesztői átadásra is. Ez nem mellékes kérdés.

Hasznos az is, ha megjelölöd a határidőt és a módosítások számát. Egy privát szakember sokszor rugalmasabb, mint egy nagy csapat, de csak akkor tud jól tervezni, ha nem menet közben derülnek ki az alapok. Szerintem annak van a legjobb esélye jó munkát kapni, aki röviden, világosan és példákkal ír. Nem kell hosszú dokumentum. De kell egyértelműség.

Animációk a felhasználói élményhez hosszabb távon

Az Animációk a felhasználói élményhez akkor térülnek meg, ha egységes rendszert alkotnak. Nem különálló trükkökből állnak, hanem ugyanazt a logikát követik minden fontos ponton. Ezért a jó online szakember nem egyetlen mozdulatban gondolkodik, hanem a teljes használati útban. Hol kell azonnali visszajelzés, hol elég egy finom átmenet, és hol jobb semmit sem mozgatni. Ez utóbbi legalább olyan fontos döntés.

Ha privát megrendelőként specialistát keresel, szerintem ezt az egy kérdést tedd fel elsőként. Mitől lesz könnyebb a felhasználónak a feladat a mozgás után. Ha erre érthető választ kapsz, jó irányban jársz. Ha csak látványról esik szó, érdemes tovább keresni. A felületi mozgás értéke nem abban van, hogy feltűnik, hanem abban, hogy használat közben szinte természetesnek érződik. És ez az a pont, ahol a jó szabadúszó munkája valóban számít.