UX / UI + VISUAL DESIGN
___
ANZ
Web (Overdrafts application)
My role
Working in the continuous delivery stream for ANZ online banking, I ran a lean UX/UI design approach to help improve usability and UI/UX for the ANZ Assured (Overdrafts) product on desktop.
The application process via forms was the bulk of the work along with some visual design around the ‘Offer’ page. I advocated for the user through each sprint right through to release of the MVP.
The challenge
I was involved with improving the process of applying for ANZ Assured and the current forms sat inbetween old ANZ styles and the new UI refresh.
An old backend framework was still being used which enabled a quick product release but due to this, there were many technical and design challenges and limitations we had to overcome.
I had to introduce as much of the new UI style and make UX/UI improvements informed by testing to help make the experience a more pleasant and easier process from start to finish.
Tasks and deliverables
User flows, wireframes, low fidelity interactive prototype, usability testing, UI/visual design mockups and specs for devs.
Tools used
User goals
To understand the offer and click through to the application form
To fill out and submit the application form with maximum ease and minimum frustration
Business objectives
To increase click through rates to form from Offer page
To increase monthly applications by x amount
Use case
As an existing ANZ online banking customer, I want to add ANZ Assured (Overdrafts) to my account so that I can cover for unexpected cash shortfalls.
ANZ Assured user flows
Mapping a high level flow to get a overview of what the application process looked like was first then created a quick schema flow with some more detail.
Offer page
Direction
1) Simple/static sales page
2) Interactive/sales page - adding/top-up
Communication
Three sections of communication to include:
1) How it works - choose your account + amount, talks about product/focus on ease
2) Account features - talks about product
3) What you need - a focus on ease
Visual design and UX enhancements to hero
Improvements to the ANZ Assured application included visual design exploration of the hero, looking at different ways to present the information where users can add ANZ Assured to their account.
My recommendations:
- introduce call to action above fold
- visually show account + add-on (overdraft amount).
Due to time and technical constraints we had to put this into the backlog for future iteration/implementations.
Improving the application process
I created these pages in Axure which included dynamic form fields so I could show a fairly accurate interactive prototype to users.
Usability testing overview
Test highlights and outcomes
The overall ease of competing the task was measured with a Visual Analogue Scale - a quick and easy method that can be used to assess attitudes and beliefs.
We asked users to indicate the overall ease of completion by placing a mark on a scale.
An average of 8.4 out of 10 was a positive outcome.
Prioritising the findings
To help prioritise the outcomes, the findings were grouped into the areas of importance. This helped provide a common understanding of the significance of the outcomes on the overall user experience and how best to define the changes. The below have been applied based on the frequency of participants having an issue with a task or feature.
Qualitative data analysis
Issues and recommendations prioritised
I prioritised the top 5 issues to fix with other recommendations going in the backlog. As a team we discussed business verses customer importance along with development time and effort in order to decide what we could build each sprint cycle.
Working closely with dev leads
Lot’s of communication was critical with the lead developers to establish a good working relationship. And because of this we were able to implement a decent amount of UI and UX improvements and each making compromises within the challenging technical constraints of the platform.
As part of each sprint I handed over clear specs indicating the improvements and design style changes to make sure the ANZ digital branding was adhered to.
I’d love to chat about how I can help you. Say hi over email.
Contact me
© Jeremy Laycock