Opulence.
Web, Webshop & App Development

Product Design & Design Systems

UX research, interface design, prototyping and component libraries that keep products consistent.

Good product design starts with evidence. We research how people actually work, design flows that fit, and prototype early so the expensive part, the build, starts from something tested. The output is a design system: tokens, components and patterns that engineers can use directly.

The service suits new products, redesigns of applications that have grown untidy and organisations that need several teams to design consistently.

How we're different
  • Designers sit with engineers, so every component is designed to be built and built as designed.
  • Research findings are written as decisions, not decks.
  • Accessibility is designed in at component level, which is far less effort than fixing pages.
Who this is for
  • A bank or insurer with many product teams shipping interfaces that do not look like the same company.
  • An automotive or industrial group with an internal tools estate that staff avoid using.
  • A group consolidating brands into one product platform after an acquisition.
Signals you need this now
  • Every team maintains its own button.
  • Accessibility defects are fixed page by page and reappear.
  • Design hand-offs are redrawn by engineers because nothing is specified.
  • User research is anecdotal and the loudest stakeholder wins.
Scope of work

What is included.

  1. 01

    UX research

    Interviews, usability tests and analytics review turned into clear findings.

  2. 02

    Flows and wireframes

    Task flows and low-fidelity screens to settle structure before visual design.

  3. 03

    Interface design

    High-fidelity design across breakpoints and states in Figma.

  4. 04

    Prototyping

    Clickable prototypes tested with users before build.

  5. 05

    Design system

    Tokens, components, documentation and a coded library aligned to Figma.

Method

Four steps, no surprises.

  1. 01

    Research

    Understand users, tasks and constraints with evidence.

  2. 02

    Structure

    Flows and wireframes reviewed with stakeholders.

  3. 03

    Design

    Interface design and prototype tested with users.

  4. 04

    Systemise

    Tokens, components and documentation handed to engineering.

How the engagement runs

From first meeting to steady state.

  1. 01Weeks 1 to 3

    Research

    Interviews, usability tests and analytics review turned into decisions.

  2. 02Weeks 4 to 8

    Structure and design

    Flows, wireframes and interface design tested as a prototype with users.

  3. 03Weeks 9 to 14

    Systemise

    Tokens, components, documentation and a coded library aligned to Figma, handed to engineering.

What we measure
  • Share of product interfaces built from the shared component library.
  • Task success rate in usability testing before and after redesign.
  • Accessibility defects caught at component level rather than at page level.
  • Design-to-build time for a new feature.
Who is on the engagement
  • Design lead
  • UX researcher
  • Product designers
  • Design system engineer
Deliverables
  • Research report with findings and decisions.
  • Task flows and wireframes.
  • Figma prototype.
  • Design tokens and component library.
  • Design system documentation.
Engagement terms

Research and design sprints are fixed scope and typically run four to ten weeks depending on product size. Design systems are phased, with a foundation phase of six to eight weeks and later phases as components are added. Ongoing design support is available on a retainer.

FAQ

Product Design & Design Systems, in plain terms.

Yes. The design system extends your brand into product components rather than replacing it.

Yes, where wanted. A coded library in React or Vue aligned to the Figma system prevents drift between design and product.

Usually five to eight per round, which is enough to find most usability problems. Multiple rounds are better than one large one.

Yes. Training, governance and contribution guidelines are part of the hand-over.

Next step

Ready to talk about product design & design systems?