Design Systems · Varo Bank · 2021 – 2022
Varo Experience Language
I joined Varo in March of 2022 to lead the Design Systems effort, Varo Experience Language, or VXL. Initially serving as a Principal-level individual contributor, the role expanded to managing a small squad comprising 2 designers and 1 engineer, plus overseeing platform development efforts across Android, iOS, and Web.
The Challenge: Deliver a New Brand Direction to the Product
When I joined Varo, the company was coming out of the agency stage of a full rebrand known internally as Make A Statement, or “MAS.”
“Make a Statement” brand direction, Q1 2022
The previous “Octavia” brand direction featured neumorphic styling and underperformed in conversion and retention metrics. Customer feedback indicated the design felt outdated, with one noting it “looks like something my parents would use.”
The “Octavia” Customer Experience
Conversely, users found the new direction fresh, differentiated, and motivating—describing it as a space inviting exploration.
The MAS or “Make A Statement” Customer Experience
The System Challenge
Despite having a design system, it lacked complete componentization, featured inconsistent platform approaches, and had multiple competing sources of truth.

The VXL 3.0 Approach
Brand Agnostic Mental Model — Rather than anchoring the system to specific brand iterations, the framework prioritizes platform-native thinking, enabling future brand evolution.

Single Source of Truth — The VXL squad built a single source of token truth where each style is stored, and a platform-native version is generated for each platform team. The implementation utilized Style Dictionary, an open-source tool enabling centralized updates distributed automatically across platforms.
Token Delivery Pipeline diagram
Visual Foundations — The library encompasses Color, Type, Spacing, Elevation, Icons, Logos, and Illustrations, structured into Core Foundations and an Expressive Library reserved for component construction rather than ad-hoc application.



Component Examples
System Banner — Updated components aligned with MAS aesthetics and deployed across applications.


Inline Alert — Refreshed components reflecting the MAS direction across mobile and web platforms.



Transaction List Item — Unified a previously fragmented collection of platform-specific designs into a single, flexible component addressing inconsistencies across user-facing surfaces.
Unified component replacing previous iterations
Old experience inconsistencies across surfaces
Migration Initiative
In autumn 2022, leadership adopted a comprehensive migration strategy necessitating coordination across 20+ developers spanning multiple development cycles.
Migration from Octavia to MAS, late 2022
Business Results
The redesign generated strong app store reviews and substantive positive customer commentary regarding experience improvements.

Future Direction
The team is developing “MAS+,” an enhancement phase designed to deepen brand integration and enrich visual presentation, scheduled for early Q3 2023 release.
Visual improvements scheduled for Q3 2023
Supporting the rollout involved creating Slack support channels, scheduling office hours, establishing Confluence documentation, managing Jira workflows, and conducting educational presentations to secure executive resources and engineering participation.