ING DIRECT
Creating an experience that removes customer pain points, improves online self-service, and reinforces the ING DIRECT brand.
/ STAKEHOLDER WORKSHOPS
/ EXPERT REVIEW
/ CUSTOMER RESEARCH
/ INFORMATION ARCHITECTURE
/ WIREFRAMING
Overview
ING DIRECT - the trading name of ING Bank (Australia) Limited - is part of the world's leading direct bank, and is wholly owned by ING Group.
Their preceding public website had grown organically over the years and felt cluttered, busy, confusing and didn’t allow customers to achieve their desired goals in an easy and enjoyable way.
The brief was to design a site that met key principles around reinforcing who ING DIRECT are as a brand, providing an excellent customer experience by removing customer pain points, implementing online retailing best practice to drive banking product sales, improving online self-service, ensuring the accessibility across devices as well as being modular and reusable.
SECTOR
Enterprise, Finance
​
TIMEFRAME
2013 -2014
​
MY ROLE
Senior User Experience Designer
1. Understand & Discover
The website redesign project provided ING DIRECT with an ideal opportunity to involve their customers and prospects from the onset. I began by understanding the scope, the nature of the business as well as audience of the website.
Evaluating the current website experience
In order to understand the current state of the website in terms of usability, efficiency, and effectiveness of the experience, one of the first things I carried out was an Expert review of the site covering the following:
Heuristic Review
A review of the site in terms of overall strategy, navigation structure, content comprehension, visual presentation, and interaction affordance.
Site Analysis
A review of the overall traffic composition, top entry/exit pages, and next page analysis over a period of 6 months.
Best practice review
A high level comparative review against selected competitor websites in terms of homepage strategy, product construct, and tools & widgets.
As a result of the review I was able to identify opportunities for improvement around overall navigation, information architecture, content presentation and organisation.
Understanding the website vision and strategy
From the business point of view, we spoke to key stakeholders that represented each of the product areas, i.e. Everyday banking, Savings, Home loans, Superannuation, and Business products.
The key strategic direction that we derived from the stakeholder workshops as well as prior KPIs that were identified, was to ensure that the website removed any barriers in terms of overall user experience, promoted who ING DIRECT are as a brand, and provided easy access to the right and relevant content when needed.
Understanding who the customers are
The redesign project provided ING DIRECT with a great opportunity to get a fresh understanding of who their customers and prospects are, how they think and work, as well as what information and utility they need in order to achieve their desired goals with regards to banking.
We worked with CXCO, who led the customer research to address this need. CXCO, studied the target customer segments provided by ING DIRECT, and recruited the required participants for the customer research. I attended 18 Contextual Inquiry (CIs) sessions that were held with the participants . From the CIs, we were able to get insights as to what criteria and factors customers consider when selecting a bank provider, what factors affect loyalty to a provider, as well as what and how information is sought.
The CIs also enabled CXCO to generate key Personas as well as a Task Model that provided a view of all the user goals, tasks, sub-tasks and content/functions needed to support the user in achieving their goal.
Contextual Inquiries
Personas
Task Model
2. Design & Validate
With the insights gained from the "Understand & Discover" phase, we proceeded to create and develop the user experience and high level solution to be validated with end users.
Concept model and wireframe prototype
Customer research indicated that users are looking for more information than what is generally provided - especially information that helps demystify a product. The biggest design challenge for the project was that there were a number of objectives that had to be met while ensuring that the site remained simple, clear and easy-to-use.
For the concept model, we proposed that the content would be simple, focussed on benefits, jargon-free, and presented by employing the principle of progressive disclosure - thereby allowing all relevant content to be made available to the user when needed and in the right context without having to overwhelm their experience. By using a modular design, we developed certain spaces on each page that present content tailored to what we know about the visitor (driven by a combination of web analytics and customer data) offering digital experiences that are dynamic and targeted.
I created the concept wireframes using Axure RP Pro - this allowed me to rapidly create hi-fidelity prototypes that we could use for user testing.
User Testing
Working with CXCO, we conducted two rounds of user testing of the concept with actual and prospective customers.
In the first round, we wanted to validate the concept (in the form of black & white wireframes) and interaction model with the users as well as understand user expectations and requirements for content, functionality and other elements.
With the learnings of round one addressed, the second round of user testing focussed on testing the visual design and more importantly on understanding how the design impacted perception of the ING DIRECT brand.
The results of the user testing indicated that the concept was well understood, positively expanded the participants perception of the brand, and was considered uncomplicated, helpful & easy to navigate. The tests also helped to clarify and simplify the concept further as per the user feedback and experience.
3. Build, analyse & optimise
Following the user testing and validation, the concept wireframes were updated to incorporate the key learnings before detailing the visual design and solution for the build.
Detailed wireframes, visual design, and copy
Key pages and templates were detailed in terms of wireframes as well as functional specifications. In parallel, I worked closely with the visual designer who produced the visual assets per page and template.
Using the detailed wireframes, and with the help of other members of the Digital team, we sourced copy for all the pages of the site in conjunction with the copywriter, product stakeholders as well as legal representatives.
Site build, QA, and User Acceptance Testing
We engaged Lash Creative for the site build. They designed and developed the responsive site framework and led the implementation plan. We worked closely with Lash to ensure that the assets, content, and interactive modules & elements were implemented as per expectations by following a thorough QA process.
Prior to launching the site, the final User Acceptance Testing of the site was carried out by the Digital team in conjunction with Lash Creative.
Post implementation review & updates
One month after launching the website, the team started working on a post implementation review:
-
Workshops were held with key stakeholders for the purpose of gathering feedback about the different sections and elements of the site from an experience and strategy point of view.
-
​Data about site analytics and performance was collated and analysed - the analytics team started to create multi-variate and a/b tests for certain elements and sections of the site for the purpose of optimisation.
Outcome
Immediately following the launch of the website in March 2014, the customer feedback was overwhelmingly positive. There was a significant increase in site traffic, product conversions, as well as a reduction in the number of emails to the contact centre.
