Biljana Kovačić Baničević

Product Designer · Stockholm

All stories

07

Designing for scale

Building reusable commerce patterns from real product needs.

  • Systems Thinking
  • Scale
  • Cross-functional
  • Trade-offs
Image placeholder

01The problem

Checkout had to support different payment methods, delivery options, business rules and market conditions across 60+ markets.

Solving each scenario independently would create fragmented patterns and increasing design and development complexity.

02How I knew

Working across Checkout revealed the same interaction needs appearing repeatedly — order summaries, delivery, payment, loading, validation and error states.

The problem was no longer individual screens, but repeated patterns without a shared system.

03My role

I contributed to Oriflame’s global Design System, with my main ownership in Checkout.

I designed component architecture, variants, states, behaviour and documentation, ultimately creating approximately 80% of the Checkout component library.

04Key constraints

Components needed to be reusable across markets and changing data while still supporting legitimate product-specific behaviour and edge cases.

05Design process

  1. Product flows
  2. recurring patterns
  3. component architecture
  4. variants & states
  5. validation in real flows
  6. documentation

I built components from actual product needs rather than designing the library in isolation.

06Key decisions

I treated behaviour and states as part of the component, not just its visual appearance.

Components were designed in real Checkout flows first, then generalised when the pattern proved reusable.

07Trade-offs

More variants increased flexibility but also made components harder to understand and maintain.

I prioritised fewer, purposeful variants with clear usage rules over trying to make every component handle every possible scenario.

08Solution

A reusable Checkout component library covering delivery, payment, order summaries, progress, loading, validation and error states, supported by documentation and shared foundations.

  • Checkout
  • Delivery
  • Order states
  • Bag

09Result

I designed approximately 80% of the Checkout component library, creating a shared foundation for recurring commerce interactions across markets.

The patterns also contributed to Oriflame’s wider global Design System.

10What I’d do differently

I’d define clearer rules for using and extending components earlier, alongside the components themselves.

As the system grows, knowing when to reuse, adapt or create a new pattern becomes as important as designing the component.