SlideShare a Scribd company logo
1 of 32
Download to read offline
U P O R A B N I Š K A I Z K U Š N J A V
S P L E T N E M B A N Č N I Š T V U :
š t u d i j a p r i m e r a u p o r a b n i š k e g a
v m e s n i k a s t o r i t v e N L B K l i k
M A Š A C R N K O V I Č
Mentor: doc. dr. Andraž Petrovčič
Ljubljana, 2017
V S E B I N E
P R E G L E D 2
R AZ I S K AV A
1 AN ALI Z A
2 R E Š I T V E
3
Z A G O V O R
R a z i s k a v a
Z A K A J U P O R A B N I Š K A I Z K U Š N J A ?
R A Z I S K A V A 4
D O B R A U P O R A B N I Š K A
I Z K U Š N J A
V E Č U P O R A B N I K O V , K I
S O B O L J Z A D O V O L J N I
V E Č J I D O B I Č E K I N
U G L E D B A N K E
Z A G O V O R
U P O R A B N I Š K A I Z K U Š N J A
S P L E T N E S T O R I T V E
R A Z I S K A V A
U Ž I T E K
U P O R A B N O S T
V S E B I N A I N
F U N K C I O N A L N O S T I
Kako privlačna
je uporaba?
Kako enostavna je uporaba?
Ali so uporabnikom na voljo želene vsebine in funkcionalnosti?
5Z A G O V O R
K A K O O C E N I T I I N I Z B O L J Š A T I
U P O R A B N I Š K O I Z K U Š N J O S P L E T N E B A N K E ?
R A Z I S K A V A
1. Kakšna je navigacija spletne banke, da je razumljiva
uporabnikom?
2. Kako izboljšati vizualno podobo osrednjega dela
uporabniškega vmesnika, da bodo uporabniki lažje
uporabljali ponujene funkcionalnosti?
3. Kako izboljšati razumljivost poimenovanj v osrednjem
delu uporabniškega vmesnika?
Z A G O V O R 6
Povprečno trajanje testa
28 min
Število testirancev
8
Število kartončkov
23	vsebin	+	9	funkcionalnosti
Glavni cilj
Odkriti	optimalno	organizacijo	informacij	
in	poimenovanje	navigacijske	strukture	
ZAGOVOR
Povprečno trajanje testa
47 min
Število testirancev
7
Število nalog
11
Glavni cilj
Odkriti	težave	pri	razumevanju	NLB	Klika	
in	obvladovanju	funkcionalnosti
R A Z I S K A V A 8Z A G O V O R
A n a l i z a
Potrebna je zbranost in veliko raziskovanja. Tudi
osnovne bančne izraze moraš poznati. Želel bi si,
da bi bilo bolj podobno miselnemu vzorcu in z več
vizualnimi poudarki. Zelo je monotono.
– U D E L E Ž E N E C T E S T I R A N J A
A N A L I Z AZ A G O V O R 10
24 uporabniških težav
A N A L I Z AZ A G O V O R
6
zelo	resnih
10
srednje	resnih
8	
manj	resnih
11
Pri obeh metodah raziskave so imeli
uporabniki težave z razumevanjem
bančnih izrazov in poimenovanji, ki
niso dovolj natančna.
Z A G O V O R A N A L I Z A 12
SEPA depoziti
referenca
valuta računa
klirinška koda
E-računi
SEPA direktne obremenitve
spremenljiva	obrestna	mera
Klikin
trajni nalogi SMS-sporočila
Navigacijska struktura spletne banke ne sledi
mentalnemu modelu uporabnikov. Uporabniki
pričakujejo vsebino tematsko razporejeno in ne
ločeno glede na funkcionalnost ali akcijo.
Z A G O V O R A N A L I Z A 13
Osebni	računi: Kartice: Varčevanja:
• Stanje
• Promet
• Izpiski
• Stanje
• Promet
• Naroči	
• Stanje
• Naroči
Stanje: Promet: Naroči:
• Osebni računi
• Kartice
• Varčevanja
• Osebni računi
• Kartice
• Varčevanja
• Osebni računi
• Kartice
• Varčevanja
I L U S T R A T I V N I P R I M E R
Uporabnik, ki ne naredi
pravilnega prvega klika, z
70% manjšo verjetnostjo
nalogo uspešno zaključi.
Z A G O V O R 14
T E Ž A V E V I Z U A L N E P O D O B E
A N A L I Z A 15
UP O R A B A L E E N E
B A R V E
Vijolična in siva nista dovolj, da bi
učinkovito dajali pomen in
kontekst posameznim elementov.
K R ŠE N J E
K O N V E N C I J
Delovanje in oblika
funkcionalnosti niso takšne, kot
so jih uporabniki navajeni iz drugih
spletnih strani.
D R O BNI T E K S T
BR E Z H I E R A R H I J E
Velikost in struktura besedila,
otežujeta branje.
Z A G O V O R
N E - S O D O B E N D I Z A J N
Estetika vpliva na
zaznano kakovost in
uporabnost.
Z A G O V O R A N A L I Z A 16
R e š i t v e
7 K L J U Č N I H R E Š I T E V
M I S E L N I M O D E L
1. Informacijska arhitektura,	ki	sledi	
miselnemu	modelu
2. Poimenovanja gumbov,	ki	jih	uporabniki	
razumejo	
3. Poimenovanja gumbov,	ki	točno	
opisujejo,	kaj	se	po	kliku	zgodi
R E Š I T V EZ A G O V O R 18
P R I R O Č N O S T
4. Vizualna arhitektura vmesnika,	ki	
uporabniku	pomaga	 pri	opravljanju	 nalog
5. Velikost in struktura besedila,	ki	olajša	
branje	in	omogoča	„skeniranje“
6. Sodobna celostna podoba, ki	je	poenotena	z	
drugimi	digitalnimi	produkti	banke
7. Upoštevanje konvencij pri	oblikovanju	 in	
delovanju	interaktivnih	elementov
7 K L J U Č N I H R E Š I T E V
M I S E L N I M O D E L
1. Informacijska arhitektura,	ki	sledi	
miselnemu	modelu
2. Poimenovanja gumbov,	ki	jih	uporabniki	
razumejo	
3. Poimenovanja gumbov,	ki	točno	
opisujejo,	kaj	se	po	kliku	zgodi
R E Š I T V EZ A G O V O R 19
P R I R O Č N O S T
4. Vizualna arhitektura vmesnika,	ki	
uporabniku	pomaga	 pri	opravljanju	 nalog
5. Velikost in struktura besedila,	ki	olajša	
branje	in	omogoča	„skeniranje“
6. Sodobna celostna podoba, ki	je	poenotena	z	
drugimi	digitalnimi	produkti	banke
7. Upoštevanje konvencij pri	oblikovanju	 in	
delovanju	interaktivnih	elementov
+ P O M O Č
v trenutku in na mestu,	ko	jo	uporabnik	potrebuje
1. Pomoč v obliki pojasnil in
razlag, kaj uporabnik lahko
naredi na posameznem
zaslonu
2. Pomoč,	namigi	in	razlage	med	
uporabo	funkcionalnosti	(tooltips)
3. Dokumentacija	s	pomočjo	in	odgovori	
na	pogosta	vprašanja	(FAQ)
4. Jasen	in	kar	se	da	specifičen	feedback
o	napakah	in	neuspelih	akcijah
5. Izobraževanje	o	funkcionalnostih	
portala	v	stilu	»Ali	ste	vedeli?«
Primer:	SharpSpring app
Na	vsakem	zaslonu	
dobimo	pomoč,	ki	
je	povezana	z	
akcijam	na	njem.
Primer	zaslona,	kjer	
lahko	ustvarimo	novo	
formo	in	pregledamo	
podatke.	Pomoč	je	
temu	ustrezna.
1. Pomoč	v	obliki	pojasnil	in	razlag,	kaj	
uporabnik	lahko	naredi	na	
posameznem	zaslonu
2. Pomoč, namigi in razlage med
uporabo funkcionalnosti
(tooltips)
3. Dokumentacija	s	pomočjo	in	odgovori	
na	pogosta	vprašanja	(FAQ)
4. Jasen	in	kar	se	da	specifičen	feedback
o	napakah	in	neuspelih	akcijah
5. Izobraževanje	o	funkcionalnostih	
portala	v	stilu	»Ali	ste	vedeli?«
Ikona,	ki	ponudi	dodatno	razlago,	če	se	ji	
približamo	z	miško
Razlaga	ob	polju	(lahko	tudi	pod	njim).
Primer:	SharpSpring app
1. Pomoč	v	obliki	pojasnil	in	razlag,	kaj	
uporabnik	lahko	naredi	na	
posameznem	zaslonu
2. Pomoč, namigi in razlage med
uporabo funkcionalnosti
(tooltips)
3. Dokumentacija	s	pomočjo	in	odgovori	
na	pogosta	vprašanja	(FAQ)
4. Jasen	in	kar	se	da	specifičen	feedback
o	napakah	in	neuspelih	akcijah
5. Izobraževanje	o	funkcionalnostih	
portala	v	stilu	»Ali	ste	vedeli?«
Na	koncu	je	pojasnilo	te	funkcionalnosti,	
dodatne	informacije	in	opozorilo.
Za	kakšen	tip	besedila	gre,	je	takoj	jasno	
na	podlagi	ikone.
Primer:	SharpSpring app
1. Pomoč	v	obliki	pojasnil	in	razlag,	kaj	
uporabnik	lahko	naredi	na	
posameznem	zaslonu
2. Pomoč,	namigi	in	razlage	med	uporabo	
funkcionalnosti	(tooltips)
3. Dokumentacija s pomočjo in
odgovori na pogosta vprašanja
(FAQ)
4. Jasen	in	kar	se	da	specifičen	feedback
o	napakah	in	neuspelih	akcijah
5. Izobraževanje	o	funkcionalnostih	
portala	v	stilu	»Ali	ste	vedeli?«
Primer:	Unbounce app,	Sharpspring app
Pomoč	je	vedno	na	voljo	v	
zgornjem	desnem	meniju
Različni	tipi	pomoči,	ki	vodijo	do	
strani	z	dokumentacijo	in	kontakti
1. Pomoč	v	obliki	pojasnil	in	razlag,	kaj	
uporabnik	lahko	naredi	na	
posameznem	zaslonu
2. Pomoč,	namigi	in	razlage	med	uporabo	
funkcionalnosti	(tooltips)
3. Dokumentacija	s	pomočjo	in	odgovori	
na	pogosta	vprašanja	(FAQ)
4. Jasen in kar se da specifičen
feedback o napakah in
neuspelih akcijah
5. Izobraževanje	o	funkcionalnostih	
portala	v	stilu	»Ali	ste	vedeli?«
Primer:	Twitter
1. Pomoč	v	obliki	pojasnil	in	razlag,	kaj	
uporabnik	lahko	naredi	na	
posameznem	zaslonu
2. Pomoč,	namigi	in	razlage	med	uporabo	
funkcionalnosti	(tooltips)
3. Dokumentacija	s	pomočjo	in	odgovori	
na	pogosta	vprašanja	(FAQ)
4. Jasen	in	kar	se	da	specifičen	feedback	
o	napakah	in	neuspelih	akcijah
5. Izobraževanje o
funkcionalnostih portala v stilu
»Ali ste vedeli?«
Primer:	SlideShare
Nasveti,	kaj	funkcionalnost	je	in	kako	jo	uporabiti
R E Š I T V E 26Z A G O V O R
Čeprav obstaja veliko hevristik, je za dobro
uporabniško izkušnjo potrebno v proces vključiti
uporabnike - in proces testiranja ponavljati.
Hevristike so statične, uporabniki in produkt pa
se spreminjajo.
I M P L E M E N T A C I J A R E Š I T V E
R E Š I T V E 27Z A G O V O R
NLB	Klik	prenova	2016
… N E K A J D E L A J E Š E O S T A L O
R E Š I T V E 28Z A G O V O R
U P O R A B N I Š K A I Z K U Š N J A
V P R A K S I
R E Š I T V E
U Ž I T E K
U P O R A B N O S T
V S E B I N A I N
F U N K C I O N A L N O S T I
Kako privlačna
je uporaba?
Kako enostavna je uporaba?
Ali so uporabnikom na voljo želene vsebine in funkcionalnosti?
29Z A G O V O R
R E Š I T V E 30Z A G O V O R
Uporabniška izkušnja pridobiva na veljavi, vseeno
pa se v primerjavi z oglaševanjem, vanjo vloži
precej manj denarja.
Zato so pomembne raziskave kot je ta, ki
pokažejo, koliko potenciala je skritega v slabih
spletnih storitvah.
„Podjetja z dobro izkušnjo
povečujejo svoj dohodek
3x hitreje kot ostali.“
- F o r r e s t e r 2 0 1 6
31Z A G O V O R
m a g i s t r i c a d r u ž b o s l o v n e i n f o r m a t i k e
M A Š A C R N K O V I Č
m a s a . c r n k o v i c @ g m a i l . c o m

More Related Content

Uporabniška izkušnja v spletnem bančništvu

  • 1. U P O R A B N I Š K A I Z K U Š N J A V S P L E T N E M B A N Č N I Š T V U : š t u d i j a p r i m e r a u p o r a b n i š k e g a v m e s n i k a s t o r i t v e N L B K l i k M A Š A C R N K O V I Č Mentor: doc. dr. Andraž Petrovčič Ljubljana, 2017
  • 2. V S E B I N E P R E G L E D 2 R AZ I S K AV A 1 AN ALI Z A 2 R E Š I T V E 3 Z A G O V O R
  • 3. R a z i s k a v a
  • 4. Z A K A J U P O R A B N I Š K A I Z K U Š N J A ? R A Z I S K A V A 4 D O B R A U P O R A B N I Š K A I Z K U Š N J A V E Č U P O R A B N I K O V , K I S O B O L J Z A D O V O L J N I V E Č J I D O B I Č E K I N U G L E D B A N K E Z A G O V O R
  • 5. U P O R A B N I Š K A I Z K U Š N J A S P L E T N E S T O R I T V E R A Z I S K A V A U Ž I T E K U P O R A B N O S T V S E B I N A I N F U N K C I O N A L N O S T I Kako privlačna je uporaba? Kako enostavna je uporaba? Ali so uporabnikom na voljo želene vsebine in funkcionalnosti? 5Z A G O V O R
  • 6. K A K O O C E N I T I I N I Z B O L J Š A T I U P O R A B N I Š K O I Z K U Š N J O S P L E T N E B A N K E ? R A Z I S K A V A 1. Kakšna je navigacija spletne banke, da je razumljiva uporabnikom? 2. Kako izboljšati vizualno podobo osrednjega dela uporabniškega vmesnika, da bodo uporabniki lažje uporabljali ponujene funkcionalnosti? 3. Kako izboljšati razumljivost poimenovanj v osrednjem delu uporabniškega vmesnika? Z A G O V O R 6
  • 7. Povprečno trajanje testa 28 min Število testirancev 8 Število kartončkov 23 vsebin + 9 funkcionalnosti Glavni cilj Odkriti optimalno organizacijo informacij in poimenovanje navigacijske strukture ZAGOVOR
  • 8. Povprečno trajanje testa 47 min Število testirancev 7 Število nalog 11 Glavni cilj Odkriti težave pri razumevanju NLB Klika in obvladovanju funkcionalnosti R A Z I S K A V A 8Z A G O V O R
  • 9. A n a l i z a
  • 10. Potrebna je zbranost in veliko raziskovanja. Tudi osnovne bančne izraze moraš poznati. Želel bi si, da bi bilo bolj podobno miselnemu vzorcu in z več vizualnimi poudarki. Zelo je monotono. – U D E L E Ž E N E C T E S T I R A N J A A N A L I Z AZ A G O V O R 10
  • 11. 24 uporabniških težav A N A L I Z AZ A G O V O R 6 zelo resnih 10 srednje resnih 8 manj resnih 11
  • 12. Pri obeh metodah raziskave so imeli uporabniki težave z razumevanjem bančnih izrazov in poimenovanji, ki niso dovolj natančna. Z A G O V O R A N A L I Z A 12 SEPA depoziti referenca valuta računa klirinška koda E-računi SEPA direktne obremenitve spremenljiva obrestna mera Klikin trajni nalogi SMS-sporočila
  • 13. Navigacijska struktura spletne banke ne sledi mentalnemu modelu uporabnikov. Uporabniki pričakujejo vsebino tematsko razporejeno in ne ločeno glede na funkcionalnost ali akcijo. Z A G O V O R A N A L I Z A 13 Osebni računi: Kartice: Varčevanja: • Stanje • Promet • Izpiski • Stanje • Promet • Naroči • Stanje • Naroči Stanje: Promet: Naroči: • Osebni računi • Kartice • Varčevanja • Osebni računi • Kartice • Varčevanja • Osebni računi • Kartice • Varčevanja I L U S T R A T I V N I P R I M E R
  • 14. Uporabnik, ki ne naredi pravilnega prvega klika, z 70% manjšo verjetnostjo nalogo uspešno zaključi. Z A G O V O R 14
  • 15. T E Ž A V E V I Z U A L N E P O D O B E A N A L I Z A 15 UP O R A B A L E E N E B A R V E Vijolična in siva nista dovolj, da bi učinkovito dajali pomen in kontekst posameznim elementov. K R ŠE N J E K O N V E N C I J Delovanje in oblika funkcionalnosti niso takšne, kot so jih uporabniki navajeni iz drugih spletnih strani. D R O BNI T E K S T BR E Z H I E R A R H I J E Velikost in struktura besedila, otežujeta branje. Z A G O V O R
  • 16. N E - S O D O B E N D I Z A J N Estetika vpliva na zaznano kakovost in uporabnost. Z A G O V O R A N A L I Z A 16
  • 17. R e š i t v e
  • 18. 7 K L J U Č N I H R E Š I T E V M I S E L N I M O D E L 1. Informacijska arhitektura, ki sledi miselnemu modelu 2. Poimenovanja gumbov, ki jih uporabniki razumejo 3. Poimenovanja gumbov, ki točno opisujejo, kaj se po kliku zgodi R E Š I T V EZ A G O V O R 18 P R I R O Č N O S T 4. Vizualna arhitektura vmesnika, ki uporabniku pomaga pri opravljanju nalog 5. Velikost in struktura besedila, ki olajša branje in omogoča „skeniranje“ 6. Sodobna celostna podoba, ki je poenotena z drugimi digitalnimi produkti banke 7. Upoštevanje konvencij pri oblikovanju in delovanju interaktivnih elementov
  • 19. 7 K L J U Č N I H R E Š I T E V M I S E L N I M O D E L 1. Informacijska arhitektura, ki sledi miselnemu modelu 2. Poimenovanja gumbov, ki jih uporabniki razumejo 3. Poimenovanja gumbov, ki točno opisujejo, kaj se po kliku zgodi R E Š I T V EZ A G O V O R 19 P R I R O Č N O S T 4. Vizualna arhitektura vmesnika, ki uporabniku pomaga pri opravljanju nalog 5. Velikost in struktura besedila, ki olajša branje in omogoča „skeniranje“ 6. Sodobna celostna podoba, ki je poenotena z drugimi digitalnimi produkti banke 7. Upoštevanje konvencij pri oblikovanju in delovanju interaktivnih elementov + P O M O Č v trenutku in na mestu, ko jo uporabnik potrebuje
  • 20. 1. Pomoč v obliki pojasnil in razlag, kaj uporabnik lahko naredi na posameznem zaslonu 2. Pomoč, namigi in razlage med uporabo funkcionalnosti (tooltips) 3. Dokumentacija s pomočjo in odgovori na pogosta vprašanja (FAQ) 4. Jasen in kar se da specifičen feedback o napakah in neuspelih akcijah 5. Izobraževanje o funkcionalnostih portala v stilu »Ali ste vedeli?« Primer: SharpSpring app Na vsakem zaslonu dobimo pomoč, ki je povezana z akcijam na njem. Primer zaslona, kjer lahko ustvarimo novo formo in pregledamo podatke. Pomoč je temu ustrezna.
  • 21. 1. Pomoč v obliki pojasnil in razlag, kaj uporabnik lahko naredi na posameznem zaslonu 2. Pomoč, namigi in razlage med uporabo funkcionalnosti (tooltips) 3. Dokumentacija s pomočjo in odgovori na pogosta vprašanja (FAQ) 4. Jasen in kar se da specifičen feedback o napakah in neuspelih akcijah 5. Izobraževanje o funkcionalnostih portala v stilu »Ali ste vedeli?« Ikona, ki ponudi dodatno razlago, če se ji približamo z miško Razlaga ob polju (lahko tudi pod njim). Primer: SharpSpring app
  • 22. 1. Pomoč v obliki pojasnil in razlag, kaj uporabnik lahko naredi na posameznem zaslonu 2. Pomoč, namigi in razlage med uporabo funkcionalnosti (tooltips) 3. Dokumentacija s pomočjo in odgovori na pogosta vprašanja (FAQ) 4. Jasen in kar se da specifičen feedback o napakah in neuspelih akcijah 5. Izobraževanje o funkcionalnostih portala v stilu »Ali ste vedeli?« Na koncu je pojasnilo te funkcionalnosti, dodatne informacije in opozorilo. Za kakšen tip besedila gre, je takoj jasno na podlagi ikone. Primer: SharpSpring app
  • 23. 1. Pomoč v obliki pojasnil in razlag, kaj uporabnik lahko naredi na posameznem zaslonu 2. Pomoč, namigi in razlage med uporabo funkcionalnosti (tooltips) 3. Dokumentacija s pomočjo in odgovori na pogosta vprašanja (FAQ) 4. Jasen in kar se da specifičen feedback o napakah in neuspelih akcijah 5. Izobraževanje o funkcionalnostih portala v stilu »Ali ste vedeli?« Primer: Unbounce app, Sharpspring app Pomoč je vedno na voljo v zgornjem desnem meniju Različni tipi pomoči, ki vodijo do strani z dokumentacijo in kontakti
  • 24. 1. Pomoč v obliki pojasnil in razlag, kaj uporabnik lahko naredi na posameznem zaslonu 2. Pomoč, namigi in razlage med uporabo funkcionalnosti (tooltips) 3. Dokumentacija s pomočjo in odgovori na pogosta vprašanja (FAQ) 4. Jasen in kar se da specifičen feedback o napakah in neuspelih akcijah 5. Izobraževanje o funkcionalnostih portala v stilu »Ali ste vedeli?« Primer: Twitter
  • 25. 1. Pomoč v obliki pojasnil in razlag, kaj uporabnik lahko naredi na posameznem zaslonu 2. Pomoč, namigi in razlage med uporabo funkcionalnosti (tooltips) 3. Dokumentacija s pomočjo in odgovori na pogosta vprašanja (FAQ) 4. Jasen in kar se da specifičen feedback o napakah in neuspelih akcijah 5. Izobraževanje o funkcionalnostih portala v stilu »Ali ste vedeli?« Primer: SlideShare Nasveti, kaj funkcionalnost je in kako jo uporabiti
  • 26. R E Š I T V E 26Z A G O V O R Čeprav obstaja veliko hevristik, je za dobro uporabniško izkušnjo potrebno v proces vključiti uporabnike - in proces testiranja ponavljati. Hevristike so statične, uporabniki in produkt pa se spreminjajo.
  • 27. I M P L E M E N T A C I J A R E Š I T V E R E Š I T V E 27Z A G O V O R NLB Klik prenova 2016
  • 28. … N E K A J D E L A J E Š E O S T A L O R E Š I T V E 28Z A G O V O R
  • 29. U P O R A B N I Š K A I Z K U Š N J A V P R A K S I R E Š I T V E U Ž I T E K U P O R A B N O S T V S E B I N A I N F U N K C I O N A L N O S T I Kako privlačna je uporaba? Kako enostavna je uporaba? Ali so uporabnikom na voljo želene vsebine in funkcionalnosti? 29Z A G O V O R
  • 30. R E Š I T V E 30Z A G O V O R Uporabniška izkušnja pridobiva na veljavi, vseeno pa se v primerjavi z oglaševanjem, vanjo vloži precej manj denarja. Zato so pomembne raziskave kot je ta, ki pokažejo, koliko potenciala je skritega v slabih spletnih storitvah.
  • 31. „Podjetja z dobro izkušnjo povečujejo svoj dohodek 3x hitreje kot ostali.“ - F o r r e s t e r 2 0 1 6 31Z A G O V O R
  • 32. m a g i s t r i c a d r u ž b o s l o v n e i n f o r m a t i k e M A Š A C R N K O V I Č m a s a . c r n k o v i c @ g m a i l . c o m