Iké

Design System for Multi-Client Insurance Platform

Design System

+

Token-based system

+

B2B Communication

2025

@RedBox

Reduced client implementation from 2-5 months to 2-4 weeks by designing a token-based configuration system that enabled backend developers to customize branded experiences independently.

  • 5 client implementations (4 completed independently by dev team)
  • 2-5 months → 2-4 weeks per client onboarding
  • System adopted without iteration after launch

Challenge

Iké is a B2B2C insurance platform that white-labels assistance services for financial institutions. When a banking customer opens their "insurance" section, they're using Iké's platform styled to match their bank's brand.

The platform was built backend-first with no design system. They needed to launch v1 in 2 months, then onboard multiple clients. Initial expectation: each client customization would take 2-5 months of designer support.

The real problem: Their business model required rapid client onboarding, but their process would create a permanent designer bottleneck.

My Role

Product Designer (Consultant), RedBox InnovationWorked with Product Owner, Product Manager, 2 Backend Developers

  • Designed token-based component system
  • Defined configuration strategy (atomic elements only)
  • Created documentation and led handoff workshops
  • Supported first client implementation

Timeline: v1 in 2 months, v2 (+customization) in 1 additional month

Approach

Reframing the request

The ask was "design custom versions for each client." After talking with the dev team, I understood their real concern was scalability with no frontend expertise. I proposed a configuration system where changing base tokens would automatically cascade styling across the platform, eliminating manual customization.

Key decisions

1. Material Design semantic tokens as foundation

Used proven token structure (primary, secondary, surface, on-surface) instead of inventing a custom system. No time to validate new methodology, and semantic naming enables automatic contrast/relationship handling.

2. Only atomic elements are configurable

Customizable:

  • Base color palette
  • Fonts
  • Typography scale

Fixed:

  • All components, layouts, interactions

Why restrict customization? Maximize perceived branding with minimum configuration, reduce error surface for non-frontend team, maintain quality without designer oversight.

The Solution

Token system + component library

  • Brand color base, semantic color tokens + tonal variations
  • Typography styles with size/weight/line-height
  • Component library spanning service modules (roadside, medical, pet care, legal)

Developer-focused handoff

  • Token naming matched CSS variable conventions
  • Two workshops walking through first client implementation
  • Documentation with before/after code examples

The development team replicated the process for all subsequent clients without design support.

Impact

5 clients implemented, 1 with my support, 4 independently by dev team

2-5 months → 2-4 weeks implementation time per client

System adopted without modification, team used it as delivered, no iterations needed

Unblocked business development

Original plan assumed designer involvement for each client. After the first implementation, the dev team handled all customizations independently, eliminating the bottleneck and enabling their partnership roadmap.

Copyright © Iván Jiménez 2025

Iké

Design System for Multi-Client Insurance Platform

Design System

+

Token-based system

+

Front end

2025

@RedBox

Reduced client implementation from 2-5 months to 2-4 weeks by designing a token-based configuration system that enabled backend developers to customize branded experiences independently.

  • 5 client implementations (4 completed independently by dev team)
  • 2-5 months → 2-4 weeks per client onboarding
  • System adopted without iteration after launch

Challenge

Iké is a B2B2C insurance platform that white-labels assistance services for financial institutions. When a banking customer opens their "insurance" section, they're using Iké's platform styled to match their bank's brand.

The platform was built backend-first with no design system. They needed to launch v1 in 2 months, then onboard multiple clients. Initial expectation: each client customization would take 2-5 months of designer support.

The real problem: Their business model required rapid client onboarding, but their process would create a permanent designer bottleneck.

My Role

Product Designer (Consultant), RedBox InnovationWorked with Product Owner, Product Manager, 2 Backend Developers

  • Designed token-based component system
  • Defined configuration strategy (atomic elements only)
  • Created documentation and led handoff workshops
  • Supported first client implementation

Timeline: v1 in 2 months, v2 (+customization) in 1 additional month

Approach

Reframing the request

The ask was "design custom versions for each client." After talking with the dev team, I understood their real concern was scalability with no frontend expertise. I proposed a configuration system where changing base tokens would automatically cascade styling across the platform, eliminating manual customization.

Key decisions

1. Material Design semantic tokens as foundation

Used proven token structure (primary, secondary, surface, on-surface) instead of inventing a custom system. No time to validate new methodology, and semantic naming enables automatic contrast/relationship handling.

2. Only atomic elements are configurable

Customizable:

  • Base color palette
  • Fonts
  • Typography scale

Fixed:

  • All components, layouts, interactions

Why restrict customization? Maximize perceived branding with minimum configuration, reduce error surface for non-frontend team, maintain quality without designer oversight.

The Solution

Token system + component library

  • Brand color base, semantic color tokens + tonal variations
  • Typography styles with size/weight/line-height
  • Component library spanning service modules (roadside, medical, pet care, legal)

Developer-focused handoff

  • Token naming matched CSS variable conventions
  • Two workshops walking through first client implementation
  • Documentation with before/after code examples

The development team replicated the process for all subsequent clients without design support.

Impact

5 clients implemented, 1 with my support, 4 independently by dev team

2-5 months → 2-4 weeks implementation time per client

System adopted without modification, team used it as delivered, no iterations needed

Unblocked business development

Original plan assumed designer involvement for each client. After the first implementation, the dev team handled all customizations independently, eliminating the bottleneck and enabling their partnership roadmap.

Copyright © Iván Jiménez 2025