A complete redesign solving 5 core user pain points · surfacing critical information upfront and making the experience unmistakably YAP.
YAP is a Pakistani fintech platform offering a digital wallet, Young Account for kids and teens, virtual and physical cards, and peer-to-peer payments. The two flagship actions are YAP It and Request Money.
Redesign the Home Dashboard · solving real problems, not a reskin.
Adults 22–38, parents managing Young Accounts, teens 13–17.
Home Dashboard, Young Account screen, Design System, Rationale.
Critical information should never require a tap to find.
Identified from user interviews, in-app behavior data, and the design brief.
Users were hitting PKR 25K limit without knowing it existed · helper text too easy to miss.
YAP It and Request Money had no visual priority · all four action buttons looked the same.
Debit and credit entries looked nearly identical · only a tiny +/– differentiated them.
Parents needed 3 taps to see child activity · lived only in the bottom nav tab.
Users forgot their card existed · discoverable only by navigating away from home.
The original screen was functional but generic · no hierarchy, no brand personality, critical information hidden.
Everything a user needs in one glance · balance, actions, card, child account, and transactions surfaced without navigation.
When a parent taps the home widget, the full parent journey opens · completing everything in one flow.
Follows YAP's existing horizontal orientation · elevated with active card management and limit visibility.
The design system was derived directly from the screens · not the other way around. Every color, type decision, and component is grounded in the actual interface.
The balance hero brings the monthly limit front and centre through a progress bar · users were consistently hitting their limit without realising it existed. YAP It and Request Money are treated as the two flagship actions they are, given full-width primary buttons while Add Money and Statements step back.
The Virtual Card strip surfaces card status directly on the home screen · users were forgetting the card existed entirely. The Young Account widget gives parents their child's balance, today's spend, and a direct top-up button in one place, eliminating the three-tap problem completely.
The card screen follows YAP's existing horizontal orientation while adding Freeze, Reveal, and limit visibility. Manrope was chosen for its clean geometry and confident numeric rendering. Dark purple and violet are used deliberately · not decoratively · to make every screen feel unmistakably YAP.
Every decision maps directly to a user pain point · nothing decorative without purpose.
Young Account widget + expanded screen solved the 3-tap problem in a single flow.
Colors, typography, and components extracted directly from screens · genuinely reusable.
Success states and animations on YAP It would add the playfulness the brand calls for.
Adding icons alongside color coding for transactions would help color-blind users.
Validating the zone layout with real YAP users would strengthen design decisions further.