Copyright © Website design & Content by Chew Lijuan
Email: hellolijuan.c@gmail.com
Interested in working together? Drop me a line
Copy Email
My Deliverables:
Workshop facilitation, Business mapping, Brand personality, Tone of voice, Visual identity, Component audit, Design System, Design tokens
Industry:
Fintech
Role:
Product Designer
Team:
Stakeholders,
Product Design team
Duration:
Aug 2024
Project Summary
Led VAMA’s rebrand and design system, aligning stakeholders and creating a scalable, accessible identity for consistent, efficient product delivery.
VAMA’s Cross-Platform Design System & Rebrand
Background
VAMA is an integrated payments and communication platform for modern digital communities. Ahead of our MVP launch, the product’s visual identity was inconsistent across platforms and misaligned with our values, goals, and market positioning. I led the brand alignment process and translated the new identity into a cross-platform design system to ensure a cohesive, scalable experience.
Project Summary
As the Product Designer, I was tasked with:
Facilitating a 2-day branding strategy workshop to align stakeholders on brand values, vision, and positioning.
Defining a new visual identity that reflects our agreed brand personality and market positioning.
Auditing and rebuilding the design system for cross-platform scalability (iOS, Android, desktop).
Integrating the rebrand into all product components, ensuring consistency and accessibility.
Problem Statement
Prior to the rebrand initiative:
The product UI lacked visual and structural consistency across platforms.
Brand identity felt disconnected from company values and user expectations.
No scalable design system existed — components were duplicated, styles were inconsistent, and iteration was slow.
We needed to:
Align leadership and teams on a shared brand vision.
Create a visual identity system that could scale with the product.
Translate brand principles into a cross-platform design system that developers and designers could reliably use.
Context & Challenge
No central design system
Slowed down feature development and caused visual debt.
Fragmented design assets
Each platform had its own styles, creating a disjointed user experience.
Multiple stakeholders:
Needed buy-in from leadership, design, product, and engineering teams.
Process & Role
Brand Alignment Workshop (Lead Facilitator)
Designed and ran a 2-day workshop to align teams on:
Business Alignment & Visions: Key offerings, value proposition, user needs, competitor landscape, roadmap.
Brand Personality: Values, tone of voice, and personality traits.
Used collaborative frameworks (e.g., value proposition canvas, brand archetype mapping) to capture consensus.
Outcome: A clear, shared brand direction to guide the rebrand and product design.
Audit & Inventory
Catalogued all existing components across iOS, Android, and desktop.
Identified redundancies, inconsistencies, and outdated assets.
System Architecture
Co-created a scalable component library with design tokens for typography, color, spacing, and states.
Built support for theming (light/dark mode) and future localization.
Rebrand Integration
Collaborated with brand designers to translate visual identity into UI elements.
Updated typography, color palette, iconography, and pictograms.
Applied new styles consistently across all app surfaces.
Before → After: Key Changes
1. Brand Alignment & Strategy (New Process)
Unified brand foundation ensures every design decision aligns with our identity and goals.
Before:
No formal brand documentation; teams had differing interpretations of brand values and tone.
After:
Documented brand personality, values, and tone of voice from workshop.
2. Visual Identity (Rebrand)
New visual identity reflects our brand personality and strengthens market positioning.
Before:
Outdated typography, inconsistent colors, and mismatched iconography.
After:
Refreshed color palette, modern typography, cohesive icon and pictogram style.
3. Component Consistency (Design System)
Design system reduces visual debt and accelerates feature delivery.
Before:
Duplicate components, inconsistent states, and styling variations between platforms.
After:
Centralized component library with design tokens for scalable, cross-platform UI.
4. Cross-Platform Parity
Consistent experience across devices while respecting native guidelines.
Before:
iOS, Android, and desktop had distinct UI patterns, creating a fragmented experience.
After:
Unified components with platform-appropriate adaptations.
5. Theming & Accessibility
Improved accessibility and flexibility for future feature development.
Before:
No light/dark mode support; accessibility was handled ad hoc.
Theming system with contrast-checked palettes and WCAG-compliant typography.
Outcome
Reduced design-to-dev handoff time by ~30%.
Enabled rapid rollout of rebrand across all product surfaces.
Established design system as company-wide source of truth.
Next Case Study
Lean UX case study on
FSMOne’s app redesign
Read Case Study