Citi Mortgage Calculator Redesign
Overview
π€οΈ Target User
AHome-buying and refinancing users who wanna learn about mortgage numbers
ποΈ Delivery
UI/UX Design, Design System
βοΈContext
Calculator is a citical tool to aquire new users. The PV of calculator pages around 1k/day in 2021.
π§οΈ My role
Lead UI/UX Designer
How to provide a tool for Citi Mortgage customers to play numbers quickly and easily?
1.Let user get quick and easy numbers
2.Provide scan ability to help user catch information
CM (a design consultancy) created the calculator with lack of humanity, but I optimized appealing and provided efficient way to help user get information.
Problem Define
1.Outdated design
2.Uncleared information hierarchy
3.Flat visual - too much gray
Research
I started to learn competitors of current marketing from 2 sides:
1. Features
2. Designs
For features, it was hard to say which one is better since features related to their business and services.
Let's move on to design part.
Key Takeaways
Proposals
Usability Testing
π₯ Desktop version:
4 Internal users
7 External users by Research Team
π± Mobile version:
4 External users by Research Team
Final Design
Design System