Hogyan és mivel készíthetünk könnyen használható és érthető digitális tartalmakat?

Egy UX designer vallomásai

Kezdjük az alapoknál!

Mit is jelent tulajdonképpen a manapság oly gyakran használt „UX” betűszó? Az UX design a user experience design rövidítése, ami magyarul felhasználói élmény tervezését jelenti. A felhasználói élmény persze meglehetősen tág koncepció, magába foglal mindent, ami a felhasználót – látogatót - érinti egy adott weboldal, felület, applikáció, folyamat használata közben. Ha a látogató azt érzi, hogy könnyen eligazodik az oldalon, akkor jó munkát végzett a UX designer. Ezen folyamatok tervezésére mára már komplett iparág épült: nemcsak új szakmák, hanem új munkamódszerek, eljárások és szoftverek is születtek a felhasználói élmény maximalizására.

Míg - leírni is fura – a múlt században egy designer szinte kizárólag az Adobe „szentháromságot”: Illustrator, Photoshop, InDesign használta, addig mára már ezek majdhogynem a háttérbe szorultak, és átadták a helyüket azoknak az programoknak, amelyekkel már egy innovatív tervezőcsapat tud megfelelni a kihívásoknak.

Nem lehet elégszer hangsúlyozni: elengedhetetlen, hogy az egyes munkafolyamatok szakértői rálássanak a teljes fejlesztésre, annak minden egyes pontjára. Ez olyannyira igaz, hogy a következőkben ismertetett designprogramok alapos ismerete a teljes UX tervezőcsapattól elvárás, legyenek azok a fejlesztés bármely pontján is. 

Az UX tervezés főbb pontjai:

A termék meghatározása (Define)

„Semmilyen szél nem jó annak, aki nem tudja, melyik kikötőbe tart”
Quimby / Kisember a csónakban

Mielőtt létrehozunk egy terméket, szükségünk van egy termék definícióra. Ehhez segítséget nyújtanak a stakeholder interjúk, melyekalapján érték javaslatot (value proposition) hozunk létre: megmondja a termék céljait, milyen problémát fog megoldani, hol és kik fogják használni.

Így készülhet el egy korai „drótvázas” vázlat (wireframe mockup) a következő alkalmazások egyikével:

UXPIn / uxpin.com

UXPin dashboard / uxpin.com

Természetesen az alkalmazás macOS-en és windowson is elérhető, illetve kiválóan elfut egy sima böngészőben is. A development csapat nagy örömére GIT, azaz verziókezelés és Storybook integrációval rendelkezik. A projektet megoszthatjuk csapaton belül, kommentálhatjuk, javaslatokat fűzhetünk elemeihez a dashboardon keresztül.

Balsamiq / balsamiq.com

Balsamiq egyszerű de átlátható kezelőfelülete / balsamiq.com

Talán a legrégebbi, de mégis a legegyszerűbben és e miatt a leggyorsabban használható szoftver. Villámgyorsan lehet átlátható és a csak a lényegre fókuszáló mockup-ot létrehozni vele.

Kutatás (research)

„Valahol elveszett, veszettül keresem sehol se talállak téged életem” - Quimby / Sehol se talállak

Lehet valami logikus és egyértelmű szerintünk vagy akár a teljes csapat számára is, de nem biztos, hogy az az ügyfél szerint is az. A direct user interjúk és fókuszcsoportos beszélgetések mellett sok mindent megtudhatunk, de „élesben” a user aktív részvételével lesz csak teljes a kép. Erre is vannak remek eszközök:

Optimal Workshop / optimalworkshop.com

Az Optimal Workshop cardsorting felülete / optimalworkshop.com

Minden piackutató álma! A böngészőben működő és rendkívül összetett feladatokat ellátó eszköz többféle kérdésben lehet segítségünkre:

  • Cardsorting:
    Az elemeket (pl. menüpontokat) a user-nek csoportokba kell rendeznie, végül a csoportnak nevet kell adnia. Logikus csoportosításokat és kategória neveket kapunk eredményként.
  • Tree testing
    Információs architekturát tesztelhetünk vele. Megtudhatjuk, hogy egy adathalmaz az ügyfél számára is átlátható és rendszerezett-e.
  • Online Survey
    Könnyedén összeállítható kérdőívek, amelyeket azonnal ki is elemezhetünk.

Maze / maze.co

A Maze többek között hőtérképet is készít a tesztelés során / maze.co

Piacvezető és professzionális megoldás nemcsak kutatásra, hanem tesztelésre is. Kész templéteket ad, amelyeket szabadon átalakíthatunk, átszabhatunk. Integrációval rendelkezik az összes nagy design software felé: bármilyen felület átemelhető és egyből használható.

Tervezés (Design)

„G dúrban zúgják a fákon a kabócák, hogy láss csodát, láss ezer csodát, láss ezer csodát.” - Quimby / Autó a szerpentinen

 Az az információ, az a tudás, ami eddig összegyűlt, elengedhetetlen ahhoz, hogy a design, vagyis termék megjelenése megfelelő legyen. A pixelpontos prototípusnak egyrészt „működőnek” interaktívnak, valamint a fejlesztő csapat számára értelmezhetőnek kell lennie. Ebben a következő komplex alkalmazások lehetnek segítségünkre:

Adobe XD / adobe.com

Az Adobe megoldása, a megszokott Adobe felülettel

A teljes kreatív ökoszisztémát lefedő Adobe természetesen elkészítette saját UI design eszközét is. Előnye, a többi Adobe termék közötti átjárhatóság: nemcsak egy Adobe Photoshop képet, de egy Adobe Audition hangfájlt is egy mozdulattal tudunk beilleszteni a helyére.

Figma / figma.com

Egy Figma-ban készülő virágbolt applikáció felülete / figma.com

A garázscégként indult történet mára már igazi sikersztori. A mostanra megkerülhetetlen alkalmazás valamennyi platformra megtalálható és böngészőben is futtatható. Nagy előnye, hogy számtalan külsős fejlesztő készít hozzá plugin-t, így szinte minden e területen használt alkalmazás felé nyitott a rendszer.

Sketch / sketch.com

A kizárólag az Apple termékein futó Sketch / sketch.com

Az elsők között jelent meg. Kiválóan tudunk vele prototípust tervezni, legyen az applikáció vagy épp egy webshop. Hátránya, hogy kizárólag masOX-en fut, hiába létezik már 2010 óta.

Mint látjuk, az UX design soha nem volt és nem is lesz lineáris folyamat, az innovatív eszközök mellett a másik eszköz a csapatmunka, ahol mindenki ért egy kicsit a másik munkájához, ahol egy ötlet vagy vélemény soha nem tűnik el.

Talán a legizgalmasabb része a történetnek az, hogy a fenti alkalmazások mellett rendkívül gyakran jelennek meg új játékosok a design programok piacán, egyetlen, ma még zászlóshajónak tartott alkalmazás kiadója sem dőlhet hátra nyugodtan azzal a tudattal, hogy jövőre vagy akár a jövő hónapban még mindig az általa fejlesztett eszközt fogják használni a designerek. Ez azonban a programok használóinak (tehát a UX designereknek) és a végfelhasználóknak is mindenképpen előny, hiszen a folyamatos fejlesztés, javítás, innováció hatását mindannyian élvezik!

chevron-down linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram