FINTECH

EDUCATION

Project

Flip & Floss

Helping kids and teens develop strong financial habits with engaging technology, gamified experiences, and meaningful education.

Client:
Flip & Floss
My Role:
UX & UI Designer / Team Lead
Timeline:
April 2025
Interface preview from Flip & Floss, a finance learning app for kids

Redesigning a Fintech App for Financially Savvy Kids

Flip & Floss is a fintech and edtech platform designed to help families build lifelong money habits together. After launching a starter app to test youth engagement with financial education, the team saw early curiosity, but also rapid user drop-off.

To address this, we were brought in to redesign the mobile onboarding flow and dashboard UX. The updated product needed to deliver fintech-level trust while staying playful and approachable for younger users.

"how might we" in vertical wordmark, graphically outlines style

create a first-time experience that instantly captures user’s attention and makes them feel excited to continue?

clearly communicate the app’s purpose and value in a way that feels intuitive, inspiring, and age-appropriate?

sustain a long-term engagement by blending personalization, progress tracking, and playful rewards?

Understanding User Drop-Off

To guide the redesign, we conducted focused UX research combining user analytics, stakeholder interviews, and competitor benchmarking. My goal was to have the team understand the drop-off moments and uncover ways to improve onboarding UX and long-term app engagement

Key Activities:

  • Stakeholder Interviews
    aligned on goals, product vision & early user feedback
  • User Behavior Analysis
    identified onboarding as the biggest point of friction
  • Competitive Benchmarking
    reviewed apps like Greenlight, GoHenry, & DuoLingo
  • Persona Refinement
    defined our two primary audiences
the word "research" in vertical wordmark, graphically outlines style

Research Insights

Onboarding clarity was critical

Users quickly disengage when the app’s purpose wasn’t immediately clear. Opportunity to communicate core value—personalize learning, savings goals from first screen.

Gamification improved engagement

Micro-rewards, achievements, & progress tracking encouraged exploration & give sense of accomplishment, reinforcing positive behaviors.

Personalization increased emotional investment

Features like avatar creation and goal-setting helped users feel ownership over their journey, deepening connection and driving continued engagement.

UX Goals for a Gamified Financial App

Clearly communicate app value

Sustain engagementment through progress tracking, personalization, & rewards

Support dual-user needs without overwhelming

Create a first impression that feels fun, trustworthy, & intuitive

the word "goals" in wordmark, graphically outlines style

Designing Onboarding That Clicks With Kids

Make financial learning feel playful, personal and easy to start.

I approached onboarding as more than a feature walkthrough—it needed to immediately feel engaging, approachable, and rewarding. My challenge was to distill key financial concepts into an experience that spoke to kids in their language: goals, games, and growth.
"design" in vertical wordmark, graphically outlines style

What We Designed:

Narrative-driven onboarding
blue arrow icon pointing to the right
Introduced learning through personalized prompts & goal selection
Progressive disclosure
blue arrow icon pointing to the right
Features were revealed gradually to match user readiness
Learned by doing
blue arrow icon pointing to the right
Integrated interactive, low-stakes activities right in the flow
Avatar Setup = Ownership
blue arrow icon pointing to the right
Customizing an avatar helped users feel like this was their space

UI Design System

I led the complete visual redesign in Figma:

  • New color palette combining fintech trust with youth energy
  • Typography system for hierarchy and readability
  • Mobile-first responsive layout
  • Component library handed off to developers for build consistency

Choosing a Goal That Feels Personal—And Powers FlipAI

"What are you saving for?"
This step helped kids connect emotionally to the app by choosing a goal that felt relevant to their lives. But it also served a deeper function—feeding data into FlipAI to tailor future content, nudges, and financial challenges to the user’s intent.
Flip & Floss goal-setting screen with options for kids to choose savings goals

Avatar Customization as Emotional Onboarding

Avatar creation step where children personalize their digital character
Early in onboarding, users created a personal avatar that represented them throughout their savings journey. This wasn’t just decorative—it was a behavioral hook.
By encouraging kids to express themselves visually, the avatar deepened emotional investment and made abstract tasks feel more human, playful, and personal.

Daily Dashboard: A Gamified Snapshot of Progress

I designed a simple, goal-focused dashboard that gave kids a quick, encouraging overview of their savings progress, completed tasks, and what to do next.
Visual cues like flip dollars earned, streaks, and a friendly progress meter made financial growth feel fun and achievable—without overwhelming the user.
Child progress dashboard with badges and milestones for financial learning

Building a Scalable Design System

Creating visual consistency and modular UI patterns for long-term growth.
To support the platform’s future roadmap, I developed a lightweight design system that unified playful, brand forward visuals with clear UI standards.
  • Modular components for onboarding, dashboards, and cards
  • Iconography that’s fun but intuitive
  • Color palette balance vibrancy & accessibility
  • Typography for multi-age readability
  • Incorporated Avatar kits to support personalization and character identity
the word "learnings" in wordmark, graphically outlines style

What I Learned

Beyond reimagining the onboarding experience and increasing user engagement, this project surfaced a critical learning:

During final handoff, I identified a COPPA compliance risk due: the app was collecting personally identifiable information from underage users before verified parental consent.

I escalated the issue to stakeholders and suggested redesign to the onboarding flow to defer data collection until consent was granted—ensuring legal compliance, protecting the company, and reinforcing user trust.

This moment reinforced the importance of advocating for ethical, inclusive, and compliant design—especially when working on products for younger audiences.

the word "final thoughts" in wordmark, graphically outlines style
Flip & Floss taught me that designing for kids requires more than simplicity—it requires imagination, flexibility, and trust. As lead designer, I was proud to bridge the gap between playful learning and fintech credibility, helping build the foundation for smarter financial habits from day one.

Final Screens & Prototype

Prototype Link Available Soon!
    Figma design system for flip and floss button components and other ui elements
    User persona for female teen, who is a motivated beginner to financial learning and saviing
    User persona for male teen who has competitive, achieving personality
    Three flip and floss screens introducing flip the ai guide, prompting friend engagement, and user rewards
    ●
    More Work
    Explore more projects
    Mobile screen from FitHive showing progress tracking features
    FIT[hive]
    Fitness, Community
    Mobile device showing logo screen of auraDent app, that assists dental anxiety sufferers
    auradent
    Healthcare, Mental Wellness