Work
Design SystemsComponent EngineeringUI DesignDocumentation

Travel Guide – Design System Engineering

Building a design system from the ground up — components, documentation, and multiple themes unified in one travel app.

Role
Design System Engineer & UI Designer
Year
2024
Team
With Julien Offray & Yannick Schwab
Tools
Figma, Tokens Studio
Travel Guide – Design System Engineering

Overview

This project was less about user research and more about mastering the craft of design system engineering. The brief and scope were given — a travel app — but the real challenge was everything underneath: how do you architect a scalable, consistent design system from scratch?

What We Built

We engineered every component individually — from atoms like buttons, inputs, and tags, up to complex organisms like cards, navigation bars, and modals. Each component was built with:

  • Documented usage guidelines and props
  • Usability checks against accessibility and interaction standards
  • Multiple themes (light, dark, and at least one brand variant)
  • Consistent token architecture — spacing, typography, color, elevation

The Discipline Behind It

Design system work requires a different mindset than product design. You're not designing for one user flow — you're designing for every possible context a component might appear in. We learned how to think in constraints, write component specs, and build for reuse and consistency rather than one-off solutions.

Outcome

All components came together in a final high-fidelity screen set of the Travel Guide app — a proof of concept that the system works end-to-end. The deliverable wasn't just screens, it was the system that produced them.

In cooperation with Julien Offray and Yannick Schwab.