• Save
ADM: Mobile banking and trading website - Keytrade Bank
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

ADM: Mobile banking and trading website - Keytrade Bank

on

  • 1,213 views

In 2008, Keytrade Bank pioneered with a fully functional mobile banking and trading website. Paul Van Diepen is ICT Specialist at Perceptive Consultancy and led the Keytrade mobile website project as ...

In 2008, Keytrade Bank pioneered with a fully functional mobile banking and trading website. Paul Van Diepen is ICT Specialist at Perceptive Consultancy and led the Keytrade mobile website project as CTO for Keytrade Bank. Together with Usability Consultant Tommy De Kimpe from Human Interface Group, he looks at the design decisions that were taken at that time, and evaluates if they still hold true in a rapidly changing mobile world.

Statistics

Views

Total Views
1,213
Views on SlideShare
1,212
Embed Views
1

Actions

Likes
0
Downloads
0
Comments
0

1 Embed 1

https://twitter.com 1

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • It’s already hard to imagine what it was like in 2008. To research for this presentation, I did a quick lookup of what the mobile world was like at the time, and I was stunned. Mobile really was in it’s infancy
  • Jobs unveiled the iPhone to the public on January 9, 2007 at the MacWorld convention in SF.It went on sale in the US on June 29, 2007.In the meantime, the famous tech website Dutch Cowboys, in their mobile trends 2008 forecast, are rejoicing themselves, because the iPhone is coming to Holland in 2008 (the 3G)
  • Android then. Well, Android beta was only released at the end of november 2007 and only went commercial in September 2008. That is 1.0.
  • Let’s talk mobile banking now. We all think it naturally that we have our online banking on the go, and we’re disappointed when our bank does not provide an optimal solution, right?Wel, reseraching this presentation I ran into this survey. The question was if the respondents would like to deal with their bank on the move. And almost 70% did not think it necessary…
  • What did we do then. Would we do it differently now?Let’s look at three principles that were considered good practices then, and whether these principles still stand. Reduce functionalityKeep navigation simpleOptimize for touch
  • Typical pitfall: trying to shrink your website to fit on a smaller screenBalance between making the application simple, and at the same time meeting the clients’ demands
  • This principle still stands but more and more challenged. People want the same functionality.Image this:The first Facebook app did not inlude any “Likes”On my Palm Tungsten E, initially, I could read and answer e-mils, but I could not open any attachments…How useful would you think this is.Think well about your core functionality, and make sure it is offered.
  • Add interactivity
  • Add interactivity
  • Nowadays, gestures are very well known. They are a very intuitive way to interact.Meet Julie. She’s my three year old. You should see her browsing through photo’s on my iPad and piching to zoom in and out… if she get hold of my iPad that is…
  • What we were up against, was the stylus, and the jog dial…We found gestures at the time too revolutionary, so we didn’t go all the way. We had no way of knowing things would go that fast.
  • What we learn:We followed good practicesGood practices change over timeChanges are really, really fast. This can be a burden, but it is a reality.So you work with what you’ve got and you try to follow along

ADM: Mobile banking and trading website - Keytrade Bank Presentation Transcript

  • 1. Mobile banking & trading@ Keytrade Bank Paul Van Diepen Tommy De Kimpe
  • 2. The project Paul Van DiepenIn 2008, Keytrade Bank pioneered with a fully functional mobile banking and tradingwebsite. Paul Van Diepen is ICT Specialist at Perceptive Consultancy and led theKeytrade mobile website project as CTO for Keytrade Bank. Together with UsabilityConsultant Tommy De Kimpe, he looks at the design decisions that were taken atthat time, and evaluates if they still hold true in a rapidly changing mobile world.
  • 3. Keytrade Bank Founded in 1998 as online investment site Bank since 2002, offering banking and brokerage products side-by-side Member of Crédit Agricole Group since 2007 Remote Channel Focus  Only one “brick and mortar” office  Strong in-house web-development team  PC web-site for all products  Mobile web-site launched early 2009  Near future: Apps
  • 4. Keytrade Bank Keytrade Bank PC website  Banking  Current account, savings account, money wires, domiciling, debit and credit cards  Trading  Transactions on major European and US cash and derivatives markets  Market news  Real-time price information  Analysis tools  Insurance  Life insurances
  • 5. PC website homepage
  • 6. PC website Banking
  • 7. PC website Trading
  • 8. Pioneers Keytrade Bank pioneers in mobile banking  WAP site launched in 1999  Mobile banking (and brokerage) web-site launched early 2009  Brokerage-only mobile products already existed from BinckBank (web) and Saxo Bank (Blackberry App)  Most banks got on the mobile train in 2011
  • 9. The design Paul Van Diepen
  • 10. Mobile site requirements Keytrade Bank mobile site  Support all banking and brokerage transactions  Informational services limited to the essential  Support all mobile devices with browser capabilities  Support touchscreens as well as keypad devices  Not a just miniaturized version of the PC site  Keep it simple  Easy navigation  Avoid information bloat  Recognizability between PC and Mobile site
  • 11. Design principles Tommy De Kimpe
  • 12. Let‟s talk…In 2008 mobile really was in its infancy. It‟s already hard to imagine what it was like.
  • 13. Let‟s talk… iPhone Unveiled to the public on January 9, 2007 On sale in the US on June 29, 2007
  • 14. Let‟s talk… AndroidAndroid beta released in November 2007 dd Android 1.0 releaseddd September 2008 in
  • 15. Let‟s talk… mobile banking Itext like to be able to deal with my bank on the move would 31% 69% Agree Disagree/neutral In 2012, can you imagine almost 70% of respondents declaring not to be interested in dealing with their bank on the move?
  • 16. My personal mobile timeline2002 2004 2007 2009 2011 2012 +1 As a designer, you are also determined by your own personal (mobile) experience.
  • 17. In hindsight…  Whatwe dowe do then? didWhat did dd then?  Would we do it differently now? Would we do it differently now? dd  Reduce functionality  Keep navigation simple  Optimize forReduce functionality * touch dd * Keep navigation simple dd * Optimize for touch dd These principles were considered good practices at the time. Do they still hold true?
  • 18. Reduce functionality Keytrade design vision: All transactions  Banking  Trading So we limited the information  Only information needed to execute a transaction
  • 19. Reduce functionality As simple as possible, but not more simple either
  • 20. Simple As simple as possible, but not more simple eitherThe standard Stocks app on the iPhone was an example of simple “Trading”.But that app is purely informational, we had to deal with more complex interactions.
  • 21. Reduce functionality  Challenged: same functionality requiredThe first Facebook app did not include “Likes”. On my first Palm, I could read mails and reply,but not open attachments. And that was OK. Such limitations are simply unacceptable today.
  • 22. ti on : Spri n gboard updat es & ext rasn : Spri n gboard simple es & ext ras Keep navigation updat  Springboard Evernote Google Plus Pagesvernote Google Plus Pages wit h summary dat a wit h drill down Good practice: keep navigation simple; so we used a springboard.
  • 23. Keep navigation simple Main navigation always visible We kept the navigation visible at all times.
  • 24. Keep navigation simple On a tablet, use extra space for navigationTrend: on a tablet, don‟t use the additional space for content, but for navigation.
  • 25. Keep navigation simple On a tablet, use extra space for navigation Another example of using the additional space for navigation.
  • 26. Keep navigation simple Content over navigation Other Trend: pull content up front and hide navigation.
  • 27. Keep navigation simple Content over navigation Windows Metro: “content before chrome”
  • 28. Touch Gestures are a very intuitive way to interact. You should see my three year old, swiping and pinching on the iPad.
  • 29. Touch vs.We were up against the stylus and jog dial… We found gestures too revolutionary toapply to the full extent. We had no idea things would go that fast.
  • 30. Touch  Designs are still “click”  However  Not cover functionality with hand or fingers  Optimized for fingertip controls  Scrollbar  Even considered scroll buttonsThe designs still feel “click”. We applied good „touch‟ design practices, but we didn‟t graspimmediately how scrolling would work. Luckily, our “scroll buttons” never made it to thefinal design…
  • 31. Did we get it? Did we get it? Well, we did a pretty decent job, considering.
  • 32. What did we learn?* Follow good practices dd* Good practices change dd* Change is fast, dd really, really fast #fh If youre not busy being born, youre busy dying
  • 33. The road ahead Paul Van Diepen
  • 34. Four years later The Keytrade mobile site has been refined, but no major changes were required Penetration of mobile vs PC site  About 1% of all logins are on the mobile site  About 3% of customers use the mobile site  Currently around 0.5% of all brokerage transactions done on mobile site. Until mid 2011 this was 0.2% Mobile site not optimized for touch/gestures Web App good for all devices, but a strong demand for native apps emerged
  • 35. The Road Ahead Optimize Web App for touch/gestures Upgrade to HTML5 when devices are ready Offer native apps for the most popular devices to increase visibility and user experience Apply UI design principles of the Mobile site to the PC site
  • 36. info@higroup.comDe Regenboog 112800 Mechelen+32 (0)15 40 01 38www.higroup.com@higroupHuman InterfaceGroupHuman InterfaceGroup