mit vÁrhatsz a ux- esedtŐl? - hwsw.hu · mÁv automata: 45+ teszt! uxstratégia. uxstratégia az...
TRANSCRIPT
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
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
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
Köszönöm a figyelmet!
UXStratégiaközelebb hozzuk a felhasználót.
fb.com/UXStrategia