During the discovery phase my team gathered information such as business rules, goals and technical constraints. We analyzed existing analytics to investigate users' pain points and drop off area. I then reviewed usability issues within the original calculators, researched best practices and benchmarked examples from other online banking/financial tools.

We concentrated on the two main customer personas: tyre-kickers and second home buyers based on user interviews (prioritized together with ANZ bank).

In the following weeks, I focused on researching mobile usability and interaction patterns. And together with the rest of the team, we created design principles for these new financial calculators.

We sketched out and wireframed the new calculators with the core concept that each calculator would always appear in its simplified form by default. These fields would then be pre-populated if a customer were logged in, or if a new user had entered the same fields before. A reset function was crucial for customers who were security-conscious.

After clicking the Submit button a user would then see the calculation results along with a refinement option and/or followed by a link to the mortgage pre-approval form.

These wireframes became the basis of our paper prototype which we used in the first round of user testing, as well as in a co-design workshop with ANZ stakeholders. During the workshop we validated each concept with user scenarios and prioritized the top four calculators that would serve the bank's immediate strategic goals.

In the design phase we adopted a semi-agile approach where the wireframes were quickly prototyped in HTML and went through a few rounds of user testing. Along the journey, a couple of key ANZ stakeholders would be helping us making business decisions quickly.

Based on the user testing results we'd go through iterations in a weekly sprint, which naturally forced us to re-prioritised the calculators and placed certain features into backlogs for future implementation.

Each iteration got us closer to the final products until finally we have the new Repayments and Borrowing calculators. We also decided to combine the third and fourth calculator: Renovation and Moving House, because we saw an opportunity to simplify the online tools. Furthermore, we identified commonality between customers who wanted to renovate or move houses. The fifth calculator (Home Planner) was placed in the back burner.

Every calculator starts with the minimum amount of input fields. After tapping the Calculate button the entire screen scrolls up and displays the result. You can quickly adjust the repayment amount by weekly, fortnightly or monthly.

Just below the results panel is a Scenario Builder, with which a customer can quickly create a second repayment scenario. By comparing the two scenarios side-by-side, you can see how much money you can save when you adjust the repayment amount.

The desktop version (above) allows a customer to build up to three repayment scenarios. You can watch the video below or try it for yourself.

home loan borrowing calculator

The ANZ Borrowing Calculator starts with just three fields by default. After the result is displayed, a customer can further refine the calculation by clicking on the Refine Results button, where additional fields such as monthly expenses and additional incomes are shown. The idea was to ease a customer into the borrowing calculator without feeling intimidated by the more complex but accurate form. Great care was also taken in copywriting to address the difference between how much you could borrow, and how much you could actually afford to. This was an important distinction for a first-time homebuyer.

home loan pre-approval form

We redesigned the home loan pre-approval form from the ground up, starting with its name, content and structure. The most important part was the need to simplify the amount of fields that the customer needed to fill per page. I've also integrated a step panel on the top of the form, and a percentage counter on the right column so a customer would know how much more they have to fill in.

The Results

The new calculators are easy to use, responsive and touch-friendly. Most importantly, we've successfully increased the conversion rate for ANZ online mortgage pre-approval submission by 300 percents.

300% increase in leads generated

The project was such a resounding success that we've been involved with every major ANZ online tools and services redevelopment ever since.