Maestro Design System

Building and maintaining a design system

As LANDR grew rapidly, so did the inconsistencies across its platform. Visual elements and design patterns varied across the board, and the codebase was becoming cumbersome and hard to maintain. I soon realized it was time to create a unified design system. Enter Maestro—the solution to bring consistency, efficiency, and scalability to LANDR’s ecosystem.

Maestro color palette preview

Miscellaneous screens

Small part of the LANDR ecosystem.

Maestro icon set preview

Figma variables

Primitives and tokens.

Figma components

Typical Figma components properties.

In 2023, I connected with Ben, a longtime front-end developer, and joined forces with Andrea, another awesome front-end developer, to build and maintain the design system.

I started with a full audit of the platform, combing through every component in the LANDR ecosystem and organizing them using atomic design principles. This gave us a clear roadmap. We dove straight into design and development, beginning with design tokens and the most frequently used components. Weekly check-ins kept the team aligned, helping us track progress and prioritize next steps.

Maestro buttons variants

Maestro components

A preview of Maestro components.

I built each component from scratch, refining, testing, and shipping them weekly. This progressive approach made rolling out the new design system smooth for users and allowed us to quickly deliver or fix components as needed.

On the design side, I faced a few hurdles—like keeping pace with tech changes and ensuring our component library stayed lightweight. The biggest surprise? Refactoring some of the more complex components so they were easily digestible by our AI tooling.

Maestro motion types

Theming

Multi-brand theming achieved with variables.

Maestro motion time scale

Motion patterns

Animation styles and tokens support.

The result? A robust design system built on a solid codebase. It streamlined workflows for both design and front-end teams, eliminating redundant code and design rework. Most importantly, we achieved our goal: a smoother, more consistent user experience.

Adoption was strong, but we quickly realized that success depended on continuous improvement and collaboration. To make the system truly ours, we had to involve the development team—encouraging them to adopt it, adapt it, and contribute to it. After all, a design system only thrives if people actually use it.