UXStratégia

MIT VÁRHATSZ A UX-ESEDTŐL?

Németh Ádám, UX Strategist, 2017.03.28.

UX TERVEZÉS BEVEZETŐ

RESEARCH DESIGN

UXStratégia

INTERJÚ

UXStratégia

TESZT

ANALITIKA

TERVEZÉS DEV TESZT

ANALITIKA

UXStratégia

UXStratégia

A UX 6 ALAPPONTJAISO 9241:210

UXStratégia

1A felhasználók, környezetük, feladataik explicit és objektív megértésén alapul

nincs kutatás? STAY AWAY

UXStratégia

2A felhasználók a tervezés és a fejlesztés

alatt végig be vannak vonva

nincs külső szereplő? STAY AWAY

UXStratégia

3A design mozgatórugója és a finomítás alapja a felhasználó-alapú kiértékelés

csak üzleti/esztétikai célok? STAY AWAY

UXStratégia

4A folyamat iteratív

one shot? STAY AWAY

UXStratégia

5A design lefedi a teljes

felhasználói élménytmilyen lesz net nélkül?

UXStratégia

6A tervezőcsapat multidiszciplináris

és több perspektívát magába foglalnem csak grafikusokból áll

UX IS ABOUT GOALS

UXStratégia

UXStratégia

A FELHASZNÁLÓ ÉRZÉKELÉSÉT ELSŐSORBAN A CÉLJAI BEFOLYÁSOLJÁK

UXStratégia

TERVEZÉSI FOLYAMAT2. TÉMA

UXStratégia

MI KELL EGY SPECIHEZ?

User story-k

Drótvázak

Prototípusok

Final visuals

Forgatókönyvek

Flow ábra

Adatmodellek

Komponensek

Pszeudokód

Spec/Avocode

LEGYEN: Konzisztens

Technológiabarát

Ne változtassunk

IA

Desk Research Patterns

Vonjunk be

User Research

UXStratégia

USER RESEARCH

KÖZÖNSÉGEK FELADATOK

KONTEXTUSOK

UXStratégia

UXStratégia

TEREPINTERJÚK

UXStratégia

FEJLESZTŐK BEVONÁSA

UXStratégia

EREDMÉNYEK

• feladatok (use case)

• scenario-k

• főbb feature-ök

• statikusnál: kérdések

• általános flow

UXStratégia

Péter, 31C# fejlesztő

CÉL: A jelenleginél jobb állást találniMOTIVÁCIÓ: passzoló feladatpasszoló környezetjófej kollégákSZÜKSÉGLETEK:magas fizukönnyű megközelíthetőség

Péter passzív álláskereső. Jelenleg egy multinál dolgozik, ahol ugyanazt a rendszert foltozzák már 7 éve, amiből Péter az utóbbi 2 évben csöppent be. Unja azt, hogy nincs értelme annak, amit csinál, szeretne olyan helyen dolgozni, ahol érzi, hozzáadott értéket ad, sokan használják amit csinál. Évek óta nem próbált ki semmi új technológiát, ez is hiányzik neki. Kollégái is be vannak savanyodva, nem nagyon járnak össze, szeretne egy kisebb, családiasabb hangulatú helyen elhelyezkedni. Viszont nem szeretné életmódját feladni, amit a mostani fizuja biztosít és szereti, ha a munka után könnyen eléri a belvárosi szórakozóhelyeket.

Nem akarok ebből a projektből nyugdíjba menni

UXStratégia

UXStratégia

MEGLÉVŐ TERMÉKNÉL?

UXStratégia

USER TESTUSABILITY TESZT

UXStratégia

NEM AZ ÜGYFÉLENÉS NEM A PROGRAMOZÓKON

UXStratégia

KOPP-KOPP

USABILITY TESZT?MI IS AZ A

UXStratégia

FELADAT-ALAPÚ

UXStratégia

KÍVÜLÁLLÓ SZEMÉLY

UXStratégia

KONKRÉT HELYZETEK

UXStratégia

UXStratégia

ITERATÍVMÁV automata: 45+ teszt!

UXStratégia

UXStratégia

AZ EMBER A KONSTANSA PROGRAM VÁLTOZHAT

UXStratégia

INFORMATION ARCHITECTURE

MI AZ AZ IA?• A design bármiféle vizuális elem nélkül

• Az információk rendszerezésének rendszere

• Az információk rendszerezése, rendezése és cimkézése a megtalálhatóság és használhatóság érdekében

UXStratégia

EREDMÉNYE• Sitemap / menüstruktúra

• oldalak tagolása

• formok tagolása

• komponensek tagolása

• fejlécek

• elnevezések

• adatmodellUXStratégia

ADATMODELL• mezőnév

• adattípus / widget típusa

• példa

• honnan jön az adat?

• restrikciók

• speciális tulajdonságok

• angol mezőnév

• mire jó? (user kérdése / user story) UXStratégia

UXStratégia

CARD SORTINGUSEREKKEL

UXStratégia

UXStratégia

UXStratégia

LájkDiszlájk

összetevő neve

Összetevő

LájkDiszlájk

összetevő neve

Összetevő

összetevők

Tervezett'muködés

méret

alternatívák

méret

Ételválasztó

Marika néni logójaCímTelefonszám

KezdőképernyőHamburgerekSalátákTidzaRózsaburgerKabrió

Vissza

Ételválasztó

[van alternatíva] következő választék[van alternatíva] előző választékVissza

Étel neveKépÖsszetevők[ha csak rendelhető] Elérhetőség

Ételajánló

Következő méretElőző méretVissza

Méret neveKépCenti

Hamburgerválasztó

Mutasd!

Összetevőkategóriák

Összetevőválasztó

MéretHús nélkülCsirkehússalMarhahússal

Salátahúsválasztó

saláta

tidza, rózsaburger, kabrió

hamburger

Éhes vagyok... mit egyek?

méret alapján

UXStratégia

Számlázás Készlet Eladók Vevők

Raktár Cikktörzs

Raktár

OkéKeresés

Raktár neve (pl. Leltár)

Cikk

szerkesztés

cikkszámmegnevezésmennyiségárÁFA

HIÁNYCIKKTÖRZSLELTÁR

Készlet

12:30

Ez egy próba árú

25% ÁFA25% ÁFA

22222 Ft

1 db

hw-asd

Pentiumhoz Socket 5-ös alap

25% ÁFA25% ÁFA

11000 Ft

10 db

hw-alapp51

AMD K2-3DDNow! CPU 300 M

25% ÁFA25% ÁFA

24000 Ft

5 db

hw-cpuamdk2

Intel Pentium II, 300Mhz

25% ÁFA25% ÁFA

39900 Ft

11 db

hw-cpup2300

HDD, Quantum 6GB

25% ÁFA25% ÁFA

32000 Ft

19 db

hw-hdd6GB

HIÁNYCIKKTÖRZSLELTÁR

Készlet

12:30

Ez egy próba árú

25% ÁFA25% ÁFA

22222 Ft

1 db

hw-asd

Pentiumhoz Socket 5-ös alap

25% ÁFA25% ÁFA

11000 Ft

10 db

hw-alapp51

AMD K2-3DDNow! CPU 300 M

25% ÁFA25% ÁFA

24000 Ft

5 db

hw-cpuamdk2

Intel Pentium II, 300Mhz

25% ÁFA25% ÁFA

39900 Ft

11 db

hw-cpup2300

HDD, Quantum 6GB

25% ÁFA25% ÁFA

32000 Ft

19 db

hw-hdd6GB

heyfromjonathan@gmail.com

Vevők

Eladók

Készlet

Számlázás

12:30

UXStratégia

PATTERN LIBRARY

Aminek pontosan egy megvalósulása van, az nem pattern. Jim Coplien(?)

UXStratégia

EGY PATTERN TULAJDONSÁGAI

• Neve

• Probléma amit megold

• A megoldás

• A kontextus, amiben a probléma-megoldás pár előjön

• Példák

• Kapcsolatai a többi pattern-hezUXStratégia

UXStratégiaPRIMARY ACTION

UXStratégia

PROBLÉMAA felhasználó nem tudja, a rengeteg gomb közül melyikre kattintson

MEGOLDÁSEmeljük ki azt az egy gombot, amelyre a felhasználók döntő többségének kattintania kell, ez üssön el az oldalon lévő összes többi gombtól

KONTEXTUSVan egy, és pontosan egy gomb, amire a felhasználók döntő többségének a következő lépésként szüksége van

UXStratégia

LIST-DETAIL

UXStratégia

PROBLÉMAA felhasználó elemek egy listájában egy elem egy sokadlagos tulajdonságára kiváncsi

MEGOLDÁSA listában csak az elem azonosítására használható tulajdonságokat jelenítsük meg, a többi tulajdonságot egy részletezőpanelre bízzuk

KONTEXTUSVannak azonosító tulajdonságok, az elemek közt a felhasználó gyorsan kell hogy tudjon váltani

HIÁNYCIKKTÖRZSLELTÁR

Készlet

12:30

Ez egy próba árú

25% ÁFA25% ÁFA

22222 Ft

1 db

hw-asd

Pentiumhoz Socket 5-ös alap

25% ÁFA25% ÁFA

11000 Ft

10 db

hw-alapp51

AMD K2-3DDNow! CPU 300 M

25% ÁFA25% ÁFA

24000 Ft

5 db

hw-cpuamdk2

Intel Pentium II, 300Mhz

25% ÁFA25% ÁFA

39900 Ft

11 db

hw-cpup2300

HDD, Quantum 6GB

25% ÁFA25% ÁFA

32000 Ft

19 db

hw-hdd6GB

HIÁNYCIKKTÖRZSLELTÁR

Készlet

12:30

Ez egy próba árú

25% ÁFA25% ÁFA

22222 Ft

1 db

hw-asd

Pentiumhoz Socket 5-ös alap

25% ÁFA25% ÁFA

11000 Ft

10 db

hw-alapp51

AMD K2-3DDNow! CPU 300 M

25% ÁFA25% ÁFA

24000 Ft

5 db

hw-cpuamdk2

Intel Pentium II, 300Mhz

25% ÁFA25% ÁFA

39900 Ft

11 db

hw-cpup2300

HDD, Quantum 6GB

25% ÁFA25% ÁFA

32000 Ft

19 db

hw-hdd6GB

heyfromjonathan@gmail.com

Vevők

Eladók

Készlet

Számlázás

12:30

UXStratégia

NEM MINDEN PATTERN JÓ MEGOLDÁS

MINDIG TESZTELNI KELL ELŐTTE

UXStratégia

FLOW

UXStratégia

SPECIFIKÁCIÓKÉPERNYŐNKÉNTI PSZEUDOKÓD

UXStratégia

A UX HELYE A FEJLESZTÉSBEN

3. TÉMA

UXStratégia

MEGELŐZIA UX BIZTOSÍTJA A USER STORY-KAT

UXStratégia

FEEDBACKA IGAZI UX AZ IGAZI PROGRAMMAL TÖRTÉNIK

User ResearchDesk Research Internal docs

Prototypes Specs DEV Release

UXStratégia

UXStratégia

ESETTANULMÁNYORVOSI RENDSZER

UXStratégia

KONKURENCIÁK

PROTOTÍPUSOK

UXStratégia

UXStratégia

UXStratégia

ESETTANULMÁNYÜGYVÉDI DOKUMENTUMKEZELŐ

UXStratégia

25MINTA

UXStratégia

64OLDALON

UXStratégia

ESETTANULMÁNYÉRTÉKESÍTÉSI MOBIL RENDSZER

UXStratégia

15SCREEN VÁLTOZÁS

UXStratégia

30USER STORY

UXStratégia

usersfirst.blog.hu

UXStratégia

Köszönöm a figyelmet!

UXStratégiaközelebb hozzuk a felhasználót.

fb.com/UXStrategia