UI/UX Design
Complete design system for a fintech super-app — 400+ Figma components, accessibility-first (WCAG 2.1 AA), dark/light modes, and engineering handoff in Zeroheight.
Figma Components
Accessibility Tier
Handoff Acceleration
The Challenge
The client was building a complex fintech super-app with multiple product offerings. Without unified design guidelines, different development teams created mismatched interfaces, resulting in a confusing user experience and slow front-end coding.
Our Solution
We designed a comprehensive, accessibility-first UI design system. We created over 400 interactive components in Figma (covering typography, colors, forms, cards, and states), verified compliance with WCAG 2.1 AA contrast standards, and set up clear design tokens for developers.
Interactive System Architecture
User Research
Conducted interviews and user journeys to map complex banking flows.
Component Creation
Designed modular UI components with built-in dark and light variants.
Token Handoff
Established automated handoff systems to export design variables straight to CSS/Tailwind configs.
Project Gallery & Mockups
The Business Impact
Unified the user experience across all product features. Engineering handoff efficiency increased by 50% because frontend developers could reuse pre-defined Tailwind design tokens directly from our handoff tools.
Project Details
Fintech Super-app
3 Months
Product Designers