-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
1/69
UX Trends in Banking | August 3, 2011 | @wrvl
IN ONLINE BANKING 2011WESSEL VAN LEEUWEN
UX TREND
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
2/69
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
3/69
UX Trends in Banking | August 3, 2011 | @wrvl
User Experienc
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
4/69
UX Trends in Banking | August 3, 2011 | @wrvl
A NEGATIVE EXPERIENCE WITH A ROUTINE TASK CAN HAVE BIG IMPAC
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
5/69
UX Trends in Banking | August 3, 2011 | @wrvl
vimeo.com/19131028
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
6/69
UX Trends in Banking | August 3, 2011 | @wrvl
htt ://ex eriencematters.word ress.com/2010/01/11/forresters-2
Banking: 7th
position in
CustomerExperience
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
7/69
UX Trends in Banking | August 3, 2011 | @wrvl
Customersexpect superior
experiences
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
8/69
UX Trends in Banking | August 3, 2011 | @wrvl
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
9/69
UX Trends in Banking | August 3, 2011 | @wrvl
WHY USER EXPERIENCE?
Poor usability
= (-) emotion
= (+) confusion (+) frustration
= (-) association (+) memory creation
= (+) abandonment (+) no return
= $0
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
10/69
UX Trends in Banking | August 3, 2011 | @wrvl
BANKING:THE TOP 5 TRENDS
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
11/69
#UX COMPETENCE ON THE RISE
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
12/69
UX Trends in Banking | August 3, 2011 | @wrvl
htt ://uxleadershi .com/2010/06/a-com
UX MATURITY MODEL
STRA
http://www flickr com/photos/25153616@N00/47123903
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
13/69
UX Trends in Banking | August 3, 2011 | @wrvl
HYGIENE
http://www.flickr.com/photos/25153616@N00/47123903
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
14/69
UX Trends in Banking | August 3, 2011 | @wrvl
HOW HYGIENE WORKS
Users can accept some issues, but the negative experience accumulates
Usability
issues
Time of usa
Inefficiency (waiting, crankyne
Neutral expectations
Frustration (irritation, insatisfacti
Failure ( Abandonme
Time per interaction (efficiency)
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
15/69
UX Trends in Banking | August 3, 2011 | @wrvl
AROUND GOLIVE: HYGIENE
HIGH
LOW
UX sweeps
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
16/69
UX Trends in Banking | August 3, 2011 | @wrvl
UX MATURITY: STRATEGY
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
17/69
#MOBILE BRINGS FOCUS.
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
18/69
UX Trends in Banking | August 3, 2011 | @wrvl
Desktopsurfing
(WHAT IS MOBILE, ANYWAY?)
Couchsurfing
1 eyes
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
19/69
UX Trends in Banking | August 3, 2011 | @wrvl
Constraintsscreen sizespeedcontextscattered attention
MOBILE FIRST
= focu
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
20/69
UX Trends in Banking | August 3, 2011 | @wrvl
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
21/69
UX Trends in Banking | August 3, 2011 | @wrvl
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
22/69
UX Trends in Banking | August 3, 2011 | @wrvl
MANTRA MOBILE FIRST
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
23/69
UX Trends in Banking | August 3, 2011 | @wrvl
Luke Wrob
Web prodube designemobile first
(even if noversion is p
Shamelessl stolen from Luke
MANTRA: MOBILE FIRST
T
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
24/69
#T
THE NATIVE APPS TRAP
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
25/69
UX Trends in Banking | August 3, 2011 | @wrvl
Customers need ubiquity
But how can you support alloperating systems and devices?
NATIVE APPS ARE MOVING TO WE
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
26/69
UX Trends in Banking | August 3, 2011 | @wrvl
NATIVE APPS ARE MOVING TO WE
The web app The Native app
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
27/69
UX Trends in Banking | August 3, 2011 | @wrvl
The solution: Widgets & HTML 5Widgets can contain any application and are reusable, This makes the best solution for the mobile challenge, for both the web and nat
WIDGETS / HTML 5
BANKING WEBSITESOCIAL NETWORKS FRONTOFFICE UNIFIED
DESKTOP
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
28/69
UX Trends in Banking | August 3, 2011 | @wrvl
Creating a mobile web-app with Widgets & HTML 5For most mobile scenarios access to local functionality andhardware is not necessary.
HTML 5 APP
No App store
Ltd Local Cache
Ltd Geo Location
No Vibration
No Came
No Sound
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
29/69
UX Trends in Banking | August 3, 2011 | @wrvl
The hybrid solution: the Native App WrapperBest of both worlds, as long as the browsers are lacking in featuresAccess to local functionality and hardware. Ability to publishin the Apple App Store or Android Market.
HTML 5 APP
With App store
With Local Cache
With Geo Location
With Vibration
With Cam
With Sound
Native App Wrapper
T
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
30/69
#T
EVERYBODY WANTS PERSO-NAL FINANCE MANAGEMENT
http://www.flickr.com/photo
EXAMPLES OF CURRENT BANK PF
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
31/69
UX Trends in Banking | August 3, 2011 | @wrvl
EXAMPLES OF CURRENT BANK PF(auto
Accoun
budgets
Saving goals
EXAMPLES OF CURRENT BANK PF
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
32/69
UX Trends in Banking | August 3, 2011 | @wrvl
Forecasting
Socialbenchmarking
EXAMPLES OF CURRENT BANK PF
BANK CUSTOMER INTEREST IN PF
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
33/69
UX Trends in Banking | August 3, 2011 | @wrvl
Local research for viability of a PFM (TNS FINANC
75% uses IB to keep track of expenses
63% of young families wonders where the money goes
45% has savings goals
50% likes to benchmark expense patterns
40% is likely to use a PFM
htt ://cdn. ressdoc.com/7221/documents/1711-1281968341-Onderzoeksresultaten Persoonli ke financien - inz
BANK CUSTOMER INTEREST IN PF
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
34/69
UX Trends in Banking | August 3, 2011 | @wrvl
- Customers want it.- Banks want it.
- Customers want their bank to have it.- It exists out there.
So where are the PFMs?
T
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
35/69
#T
OPEN AND CLOSEDENVIRONMENTS ARE MERGING
http://www.flickr.com/photos/darrenwoolridge/4699664505/
THE OPEN AND THE CLOSED ENVIRO
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
36/69
UX Trends in Banking | August 3, 2011 | @wrvl
THE OPEN AND THE CLOSED ENVIROTHE UNHAPPY MARRIAGE
WE LOVE
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
37/69
UX Trends in Banking | August 3, 2011 | @wrvl
TRANSACTIONS
- 86% of the visits goes
straight to IB
- checking balance and quickpayments: users are shiftingfrom desktop to their phone
apps
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
38/69
UX Trends in Banking | August 3, 2011 | @wrvl
Towards Seamless user journeys(from anonymous to personal)
JOURNEYS FROM OPEN TO CLOSE
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
39/69
UX Trends in Banking | August 3, 2011 | @wrvl
The (social) web
Close tomy life
Bank public environment
Bank personal environment
JOURNEYS FROM OPEN TO CLOSE
Bank transactions
Close toBankscore business
EMERGING SEAMLESS PATTERNS
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
40/69
UX Trends in Banking | August 3, 2011 | @wrvl
EMERGING SEAMLESS PATTERNS
Personal
stuff
Public
stuff
Public
stuff
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
41/69
UX Trends in Banking | August 3, 2011 | @wrvl
TRENDS: SUMMARY
1 UX competence on the rise2 Mobile brings focus3 The native apps trap4 Everybody wants PFM
5 Open and closed are merging
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
42/69
UX Trends in Banking | August 3, 2011 | @wrvl
UX PRINCIPLES
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
43/69
UX Trends in Banking | August 3, 2011 | @wrvl
Design principles are the guiding lights
that you design with.
These are the things you base decisionon, vet any ideas againstand inspire yodesigns.
PRINCIPLE
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
44/69
UX Trends in Banking | August 3, 2011 | @wrvl
Understand youraudience and int#1
C
USAA
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
45/69
UX Trends in Banking | August 3, 2011 | @wrvl
USAA
USER CENTERED DESIGN IN PRACT
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
46/69
UX Trends in Banking | August 3, 2011 | @wrvl
USER CENTERED DESIGN IN PRACT1 Persona
2 Life event they are facing3 Goals they have4 Happy flow to get there5 Alternative scenarios to get there
P R I N C I P L E
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
47/69
UX Trends in Banking | August 3, 2011 | @wrvl
Use Visual Hierato guide the eye.#2
NOT SO GOOD VISUAL HIERARCHY
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
48/69
UX Trends in Banking | August 3, 2011 | @wrvl
GOOD VISUAL HIERARCHY
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
49/69
UX Trends in Banking | August 3, 2011 | @wrvl
UNCLEAR PATH TO COMPLETION
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
50/69
UX Trends in Banking | August 3, 2011 | @wrvl
CLEAR PATH TO COMPLETION.
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
51/69
UX Trends in Banking | August 3, 2011 | @wrvl
P R I N C I P L E
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
52/69
UX Trends in Banking | August 3, 2011 | @wrvl
Think about progdisclosure#3
DIFFERENT NEEDS FOR DIFFERENT
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
53/69
UX Trends in Banking | August 3, 2011 | @wrvl
LEVELS OF EXPERTISE
Beginning user Intermediateuser
Adva
WHAT ARE THE COMMON QUESTION
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
54/69
UX Trends in Banking | August 3, 2011 | @wrvl
Beginning user Intermediateuser
Adva
Whats going on here? Whats in it for me? How does it work?
I know it is exists,but where?
How did I do this
again?
Can Can Can
UI PERSONALIZATION: ADVANCED U
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
55/69
UX Trends in Banking | August 3, 2011 | @wrvl
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
56/69
UX Trends in Banking | August 3, 2011 | @wrvl
P R I N C I P L E
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
57/69
UX Trends in Banking | August 3, 2011 | @wrvl
UnderstandCustomer Engag#4
1
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
58/69
1.
People are real.People want a relationship that works best for them
UX Trends in Banking | August 3, 2011 | @wrvl
2
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
59/69
2.
UX Trends in Banking | August 3, 2011 | @wrvl
People rely on trust.People only do business with credible partners.
3
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
60/69
UX Trends in Banking | August 3, 2011 | @wrvl
People communicate.People share stuff about themselves, and expect the sam
3.
4
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
61/69
UX Trends in Banking | August 3, 2011 | @wrvl
People have a life.Dont waste their time with irrelevant messages.
Engage with messages that relate to them.
4.
5
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
62/69
UX Trends in Banking | August 3, 2011 | @wrvl
People dont forget.They want a memorable time they can treasure an
5.
P R I N C I P L E
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
63/69
UX Trends in Banking | August 3, 2011 | @wrvl
Plan a little
prototype the res#5
PROTOTYPING CAN BE EASY.
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
64/69
UX Trends in Banking | August 3, 2011 | @wrvl
- Keynotopia is great.
- 5 users is enough- Test with simple tasks(change the payment alert)
P R I N C I P L E
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
65/69
UX Trends in Banking | August 3, 2011 | @wrvl
Designers:
go with the flow#6
THINK IN BREAKPOINTS
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
66/69
UX Trends in Banking | August 3, 2011 | @wrvl
0px 600px 900px We have n
SEPARATE LAYOUTS PER BREAK PO
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
67/69
UX Trends in Banking | August 3, 2011 | @wrvl
0px 600px 900px We have n
Structured content firstFluid layouts
PRINCIPLES: SUMMARY FOR
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
68/69
UX Trends in Banking | August 3, 2011 | @wrvl
BANKING PROJECTS
1 Understand your audience and intent2 Use Visual Hierarchy.3 Think about progressive disclosure4 Understand customer engagement
5 Plan a little, prototype the rest6 Designers: go with the flow
-
8/3/2019 20110803 Webinar Uxtrendsinbanking New 110804045341 Phpapp01
69/69
UX Trends in Banking | August 3, 2011 | @wrvl
Thanks.WESSEL VAN LEEUWEN | [email protected] | @wrvl | +316 41 1853 41