Back to overview

An app foundation for multiple brands

A roadshow prototype made the app concept tangible for furniture retailers. The work grew into a shared design foundation with tools for adapting brands without redesigning every component.

My role
Project & Design Lead · userdoo
Collaboration
The Shoring Company · Product & development
My contribution
UX/UI, design system & AI-assisted implementation
FurniLoy home with interior inspiration and furniture category entry points Kitchen project with rendering, planning status and personal consultation Order delivery status with progress and planned delivery date
Current designs from the master library. “Hansen Möbel”, people and order data are examples.

An app foundation for multiple brands

Situation

Furniture retailers needed to experience how an app could support their customers from consultation and planning through orders, delivery and service. A clickable prototype was required for the roadshow.

Role and responsibility

The client brought the multibrand vision. I led concept and design with my team. The Brand Contract, Brand Onboarder and Brand Engine were my proposed solution.

Approach

We designed the roadshow prototype and a system of shared components with interchangeable brand values. I developed the Brand Contract as a common set of rules, plus the Brand Onboarder Figma plugin, Brand Engine and web prototype with AI assistance.

Result

The client could demonstrate the app idea at the roadshow and received a shared design foundation for multiple brands. Custom tools make it possible to maintain brand values without redesigning every component.

01 Starting point

Demonstrating the customer journey
at the roadshow.

Furniture retailers needed to experience the planned customer journey directly. We built a clickable flow for live demonstrations, turning the product idea into something tangible.

The orders area is one example: customers find everything related to their purchases in one place. Larger planning projects remain distinct because a kitchen, for example, involves additional consultations, renderings and documents.

  1. Consultation
  2. Order
  3. Delivery
  4. Service

The connected customer journey formed the starting point for the roadshow concept.

02 Design system

Shared components.
Different brands.

FurniLoy coupon components in different formats, before and after activation
One component, multiple formats and states: coupons from the Figma library with sample content.

We developed the product structure and design system together. Concrete flows generated reusable components; using them in screens revealed missing content and states.

For different furniture brands, we separated basic design values from their meaning in the interface. Components refer to roles such as “primary action” or “secondary text”; the brand supplies the underlying values.

Brand adaptation also involves typography and corner radii. Those differences needed to work throughout the system without rebuilding each component for every brand.

The shared foundation connects work in Figma with Flutter and Widgetbook.

03 My initiative

Supporting brand adaptation
with custom tools.

The client proposed an app for multiple brands. My solution was a shared Brand Contract defining how brand values are used in Figma and code. I proposed Brand Onboarder and Brand Engine while developing the design system, then implemented them myself with AI assistance.

FurniLoy Brand Onboarder
Original Brand Onboarder interface with Brand, Foundations and Review steps and an example brand
Brand Onboarder entry screen. Local view of the original plugin interface with an example brand.

Brand Onboarder

A Figma plugin guides users through creating a brand and entering its design foundations. Changes can be reviewed in a preview before applying them.

Brand Engine

Shared rules process and validate brand data for Figma and the Flutter handover, including text/background colour combinations, typography and corner radii.

The Figma plugin and code generation use the same rules, keeping brand logic traceable in one place.

04 Prototype & testing

Testing behaviour.
Checking orientation.

I also designed and implemented the functional web prototype myself with AI assistance. Inputs, filters, coupon activation and navigation responded to interaction, allowing us to explore behaviour beyond moving between screens.

A Maze test with nine responses provided specific findings about orientation:

Show delivery status earlier

Delivery progress needed greater prominence within the kitchen project.

Make entry points clearer

Participants looked for locations under “More” and expected coupons under different terms or through other routes.

The feedback mainly identified improvements to information hierarchy and naming.

Customer card and coupon entry point in the loyalty area of the current FurniLoy design
Customer card area with coupon access and sample content.

Outcome & my contribution

Designing for additional brands on a shared foundation.

A common app foundation can be adapted to different furniture brands. The Brand Contract, Figma plugin and Brand Engine make that adaptation reusable and keep design and code rules together, providing a basis for expanding to further retailers.

Product concept

A clickable customer journey

A roadshow prototype made the concept tangible in conversations with furniture retailers.

Reuse

Design system & brand tools

Shared components, Brand Onboarder and Brand Engine support adaptation to different brands.

Testing

Functional web prototype

Interactive flows made it possible to examine usability and orientation.

My own implementation covers Brand Onboarder, Brand Engine and the web prototype. The development team is responsible for the actual app and backend.