At a weekend-long UX hackathon, I collaborated with three other designers to create Bill’d—a customizable banking app for Gen Z.
I led the visual branding and designed each modular widget in Figma, focusing on intuitive layouts for tracking bills, savings, and goals. Our iterative process and clean execution earned us first place in the fintech stream.
Role:
UI/UX Designer
Duration:
January 10, 2025 - January 11, 2025 (24 Hours)
Team:
Jessie Reyes, David Theophine, Erika Wang
Tools:
Figma
The Challenge:
"How might we reimagine digital banking services, to make big banks feel approachable and transparent in their efforts to support Gen Z's financial goals and build lasting trust and loyalty?"
Personalization
As digital natives who grew up immersed in technology, Gen Z naturally leverages digital spaces to authentically express their values and personalities.
Convenience
Information is readily available at their fingertips, making instant user access to product details an expected standard.
Immediate Feedback
Today's interactions commonly occur through bite-sized formats like short-form videos, leading Gen Z to prefer products with quick and concise feedback loops.
Source: Oracle Digital Banking Survey
Our hackathon process began by reviewing existing research on the Gen Z market, specifically exploring their core values and priorities within the realm of financial services. This lead us to 3 main priorities of Gen Z consumers.
First, Research:
We conducted a sticky note sprint, sharing product or life experiences inspired by each of the pillars outlined on the previous slide. This process guided us toward the concepts of customization and theming, inspired by products and features like Notion, Apple Widgets, and Arc Browser, all known for their extensive layout possibilities.
Our Solution
Bill’d is a customizable financial dashboard designed for Gen Z users who value personalization and transparency. With a modular interface, users can build their own banking experience using widgets that reflect their financial goals, habits, and aesthetics.
Mid-Fidelity Prototyping
Design System and Branding
For Bill’d, I leaned into a construction-inspired theme to reflect the idea of building and growing your financial life — a direct parallel to our customizable dashboard, where users can shape their banking experience as they evolve. I chose our primary orange because it’s strongly associated with construction, progress, and momentum. However, I intentionally softened the tone to avoid a harsh, industrial feel — creating a modern, elevated take on the theme that still feels energetic and bold.
To balance that, I paired it with a calming blue-green accent. This secondary color brings a sense of stability and trust, helping create a friendly, grounded interface that's easy on the eyes. Together, these colors form a polished yet approachable system that supports the core idea behind Bill’d: empowering users to confidently build their financial future, one step — or one widget — at a time.
High-Fidelity Prototype
Our project, Bill’d, was awarded first place in the FinTech stream at UBC’s UXathon. The judges praised our commitment to an iterative ideation process, emphasizing how effectively we refined our solution through continuous feedback loops and user-centered improvements. This approach allowed us to create a highly tailored, customizable financial dashboard that resonated deeply with our target Gen Z audience.
The Outcome