Shaping Lime's education financing app from expressive brand to shipped mobile product.

( CLIENT )

Lime Fintech, 2024

( ROLE )

UI Lead, Art Director

( FOCUS )

Direction, Systems, Execution

Overview

A mobile app helping parents finance their children's education through a regional bank. The product covers the full lending journey: KYC-verified sign-up, loan application, approval flows, repayment tracking, and payment state management across 90+ screens. The core challenge was translating a bold, expressive brand into a regulated financial product without losing what made it distinct. The app launched and hit 100,000+ downloads on Android.

My role (UI Lead & Art Director)

  • Led art direction and full visual language definition

  • Built a token-based atomic design system from scratch

  • Delivered 90+ screens across all flows and states

  • Directed creative alignment with the branding agency

  • Coordinated dev handoff with an external team

I've worked with

  • 1 Design Lead, 2 UX Designers, 1 UI Designer

  • Branding agency

  • Development squad

  • Banking stakeholders

Motion and expression in context

Challenge

A bold brand in a product that couldn't afford noise

The brand was expressive. The product was a regulated lending app with 90+ screens of financial data, compliance flows, and repayment tracking. Those two things don't naturally coexist.

The risk wasn't losing the brand. It was letting it fight the content. An expressive visual language applied uniformly across dense financial screens would have made an already complex product harder to use. We had to figure out exactly where the brand could live without becoming noise, and that meant auditing the full app for moments where emotion belonged and being deliberate about everywhere else. Waiting states, approval milestones, critical transitions. Anything form-heavy stayed minimal so users could focus.

Repayment flow and success states

solution

Expression had to earn its place

System built to absorb whatever came next

We built a token-based atomic design system from the branding agency's raw assets, covering color, typography, spacing, and components. The system drew a clear line: motion and illustration showed up in waiting states and approval milestones, nowhere else. Form-heavy screens stayed clean so users could move through financial complexity without friction. That boundary was a design decision, not a constraint we inherited.

Mid-project, the bank introduced new compliance flows that hadn't been in the original scope. The system absorbed them without breaking existing work. That wasn't luck. It was the result of building tokens and components flexible enough to handle things we didn't know were coming.

Dev syncs happened regularly and shaped the documentation directly. The handoff required no follow-up.

Tokenized design system overview

outcomes

Landed and kept going after handoff

  • 100,000+ downloads on Android post-launch

  • Designed a scalable system that supported future compliance needs

  • Delivered a handoff-ready UI system for development

  • Built with flexibility for evolving financial requirements

UI across states and screens

Reflection

Constraint is a creative decision, not a limitation

The hardest part wasn't the compliance flows or the scope additions. It was knowing when to hold the brand back. In a product this dense, the temptation is to apply expression broadly to make it feel alive. The real work was the opposite: mapping exactly where boldness served the user and cutting it everywhere it didn't. Working closely with the branding agency to understand the assets at a deeper level made that mapping sharper. The constraint became the direction.

Credits

Agency — Robusta Studio (RTG)
Designers — Noha Asal (Lead), Mai ElMaraghy (UX), Ghada Sami (UX), Amr Adil (UI)
Branding & Illustrations — Matter Branding Agency
Client — FAB Bank, Lime