VARO BANK

App Redesign and Design System

What is Varo?

Varo Money is a San Francisco based FinTech dedicated to enhancing the banking experience for mobile-only customers. Their mission is to provide tools and features that help users learn how better manage money, build wealth and avoid fees common at traditional banks.

The Problem

The proof of concept alpha app's design system was outdated and unrefined which led to a lack of user trust and engagement. The previous design system no longer met the expectations of modern banking app users, causing a decline in user registrations. To appeal to their audience and align with iOS guidelines, the app needed a significant visual refresh.

The challenge was to update the design within limited engineering hours, ensuring that the changes were impactful yet a light lift for the engineering team to implement, allowing them to focus on rolling out new features.

Identifying opportunities

The timeline and resources for this project were limited. The public launch of the beta app was quickly approaching, and we were able to secure buy in from leadership that the app needed a visual lift to put our best foot forward in the consumer banking space. Therefore the top priority was to look for the best use of our resources and timeline.

I worked closely with our engineering team to identify light lifts on their end that would make the best impact. As well we worked together to look for implementations that would reduce the load on the QA and engineering teams so that we could offer a great user experience on launch date.

Solutions

As one of two in-house designers, I led an end-to-end audit of the product. We identified user pain points through usability tests and customer interviews. Collaborating with stakeholders and the engineering team, I focused on implementing a comprehensive visual update at would be a light lift for our engineering team. The redesigned system included:

New design system
Implementing the new design system across the product gave the app an updated feel and improved user experience. By addressing contrast, type hierarchy and typeface legibility our users were better able to navigate their banking information. By enhancing readability and consistency we were ale to move the whole app experience to a AAA accessibility rating.

Revamped Component and Illustration Styling
Introducing a flat design with a new color palette to add texture and vibrancy.

Merchant Logos
Integrating these into transaction views for easier content scanning. These updates provided a more polished and cohesive look, improving user navigation and overall experience.

Results

User testing revealed that the redesign successfully increased consumer trust and satisfaction. Participants reported reduced fatigue, a clearer understanding of their tasks, and a perception of greater trustworthiness and credibility. Following the launch of the new registration flow, there was a notable increase in users completing the registration process for a Varo bank account.

Seven months post-release, Varo achieved a 5/5 star rating in a report by Celent, a leading financial services technology consulting firm, which evaluated mobile bank account registration across various US banks.