Blog
How soon should you have a design system?

How soon should you have a design system?

Hello, I’m Michael, Lago’s founding Designer and Product Manager. Before joining Lago, I spent six years in product design at ContentSquare and then Qonto. 

I pushed to build a design system from day one at Lago, and I often get questions about it. Here is the back story!

Most companies start investing in a design system after their Series B. It makes sense: when you’re chasing your product market fit or trying to get a repeatable user acquisition process, the design system is definitely not a priority. 

You need to do things that don’t scale, as Y Combinator has been hammering. 

Well… we did not listen, and built a design system from day 1. Do we regret it? No, it was one of our best decisions so far. Should you do it? No idea, but we decided to share our thought process so that you could make a decision based on your very own context.

First, what is a design system?

A design system is a set of standards to manage design at scale by reducing redundancy while creating a shared language and visual consistency across different pages and channels.

Source: Design Systems 101 - Nielsen Norman Group

This is what our design system looks like

Lago's design system in Figma
Lago's component building
Lago's design system documentation in Figma

Why we decided to build one, from day one

Having a well-rounded design system won’t help you find product market fit per se. It helps you go much faster into the iterations. Here was our rationale:

  • First impressions: when you’re just demonstrating a ‘Figma prototype’ (like we did at out Y Combinator’s interview), a clean design helps showcase the value you bring through the user journey
  • Sets a group of standards and rules so that the team can focus on ‘cracking’ user needs
  • Helps hire great engineers, and speeds up their onboarding: better than free beer or a ping pong table, we promise!
  • Builds a common language between the ‘product design’ team and the ‘front-end engineering’ one.

How to build a design system for the early days

Spend the minimum valuable time on it. You’ll probably have a part-time designer in the early days. Here are our tips:

Don’t reinvent the wheel

Align with the front-end team on a library and base your design from it. We used Material UI, took inspiration from Spectrum design system. It’s all about speed, and knowing how to use components is a time saver.

Spectrum Adobe's design system inspiration

Don’t over engineer

Most Figma files or templates showcase design systems that are made for a team of 20 designers. If you only have one designer or a part-time one, their way is the best way. Improvements will come later. 

Treat the design system as a feature

Do your homework, research, design your components with all the states and specify it for the implementation. Plan a smooth handover to the engineering team.

Lago's design system documented in Notion

Our takeaways, one year in

From the ‘Product Design’ perspective

  • When we pivoted, we rebuilt prototypes at the snap of a finger, while keeping a consistent user journey
  • We spent less time designing screens and more time on ‘discovery’, which was critical to reach product market fit 
  • We had very few QA returns based on UI, and little rework
  • We’ve been able to design a complex feature in a single day, it helped reshipping a whole Billing API with its UI in less than three months
  • Speed, speed, speed: it really helped reducing the ‘white page’ syndrome
  • Non-designers were able to use the design system to create screens too 

From Morgane and Alex, the ‘Front-end Engineering’ side

  • The design system helps maintains everything faster: whether it is to fix a behavior or add an option, all we need to do is to change a component
  • We spent less time on ‘plain design integration’ and more time on the logics and the quality of the code. It made it easier to bring newcomers to speed: full time employees or short-term contractors for specific projects 
  • If we need to rebrand (to pivot), we could change a theme or a color in a centralized way 

The only drawbacks were that it was a bet at the beginning, so we had to take a leap of faith. 

It took us three to four weeks of my time (I’m a Product Designer) and two weeks of a front-end engineer to build this. This can be a considerable investment for an early-stage company. 

If you want to learn more about ‘design systems’, here are some pointers: 

Two hosting options, same benefits

Whether you choose the cloud version or decide to host the solution yourself, you will benefit from our powerful API and user-friendly interface.

Lago Premium

The optimal solution for teams with control and flexibility.

lago-cloud-version

Lago Open Source

The optimal solution for small projects.

lago-open-source-version