Ask HN: How soon should we have a Design System?

[Rafsark]

Hi HackerNews,

As an early stage Product & Tech Founder, we often wonder what is the good timing to have a Design System.

- Do you think it's too soon during the early days? - How do you manage product consistency without it? - Do frontend engineers complain about not having one?

Our Founding Designer & Product Manager, Mike, took the mic and tell us why he thinks you should have a design system from day 1: https://www.getlago.com/blog/how-soon-should-you-have-a-design-system

Happy to have your thoughts on this!

[monjol]

As frontend engineer, I've used a DS in my current and previous companies.

I would say it's even better to have a DS if you don't have your PMF, as you want to save time instead of discussing about design implementation details and fix inconsistencies.

The sooner is the better IMHO. I've experienced the pain to build a DS on top of an existing app and it was a real nightmare. The effort to add the usage of the DS in our routine and the time spent to implement components and switch existing code to use them was not bringing any value to the business.

Also, it was very hard to advocate for its necessity while teams were not focus on feature build. I know we all love to say values does not only comes from what you ship but also from the code quality. However many companies in facts only look at KPIs, and building a DS on an existing product only have mid-long term impacts. Nothing you can notice soon.

You can base you DS on existing libs like materialUI or such. No need to build everything from 0. Iterating over already existing components and adjusting details is not that much an effort.

I don't see myself building a product anymore without one. It's such a time saver.

That said, I don’t think I would join a company that does not have a DS implemented.

[Rafsark → monjol]

Interesting comment. I feel like all engineers having a DS in past exp don't want to get back to a company without one. I had this feedback from several FE engineers.

Somehow, you don't know how painful it is until you have a company having a proper and clean DS.

You don't need to over eng it. Just a basic one is perfect before PMF

[gedy]

Depends on your people and what you define "design system" as. For most startups I'd highly recommend using off the shelf component libraries so that you don't waste time reinventing the wheel, and have your ux designers use those to assemble bigger patterns that can be reused. (Here's how we list things out, here's our tables, etc). Pick a framework that can easily use your branding colors and fonts, boring tech like Bootstrap, etc can go a long way here.

Developing a "Design System" can be a time sink in the wrong hands though, your people shouldn't be more interested in making that vs your product.

[michaelponrajah → gedy]

Fully agree at 100%, this is exactly what we did at Lago, use Material UI as a library, customised the CSS to make Lago-branding friendly. In that case we're not reinventing the wheel, we're using it and it helped us to go faster. I think it's just a matter of definition and our System is way far from ones you can see at Adobe, Shopify etc.

Goal is to go fast and having this base, this language between Front and Design is important to have sooner than later.

[ch_sm → gedy]

I absolutely agree with everything said here, and want to add this: building a design system + component library is much harder than it looks, and a very significant time sink and working with a bad design system and component library is extremely inhibiting, especially when you want to scale. Definitely use a full-featured existing library (Material UI, Vuetify or similar) and customize to your needs.

[heresjohnny]

In my experience not having a design system will produce so much overhead that investing in it early is warranted. It depends on how design-y your product is, though.

[Rafsark → heresjohnny]

Totally aligned with this. It takes about 2 weeks to implement (if you treat this as a proper feature), and it saves so much time after.

Some teams often say that it's not necessary before PMF, but I'm wondering how fast they ship without DS

[nailer]

What's the alternative? Cutting and pasting instead of using masters in Figma, or repeating styles everywhere rather than using variables in your CSS? The results either way are inconsistent UI everywhere.

Yes you should have consistent design. That doesn't mean you can't change your design, it just means you make that button change in one place rather than 94.

[Rafsark → nailer]

I can see a lot of drawbacks if you don't have one. But a lot of early stage don't produce DS before Product Market Fit. Our design and FE team love to have it for several reasons: - Design consistency - Boost productivity when implementing a feature - Onboarding new teammates

[appkale]

Like all things, it depends. (Disclaimer: I do this full time and have implemented at 2 different public companies now)

If your goal is to figure out PMF, Im not convinced you need a design system.

If your goal is to scale once you have PMF, I think its really important. Helps a lot with speed as you go from 3 engineers to 30 to more.

[michaelponrajah → appkale]

Of course it depends on the context of a company, the ressource you have internally, the seniority of the team …

If you're chasing PMF, a design system will not help you to find it directly, but it can help you to deliver features faster, try things and to not be afraid to throw it away.

In a way, indirectly, it's helping to move forward quickly which is really helpful when you're chasing PMF.

[Rafsark → appkale]

I do think there are a lot of advantages before PMF too. Somehow, if you need to pivot and throw away you initial product, you can start over a new one pretty easily if your design system is on point. At least, we had this strong feeling when we had to pivot.

[rafaelBG]

I have no experience with big projects and infrastructure but I believe that having a design system from the beginning can avoid a lot of headache in the future. I personally always make a "mini design system" for my personal projects. Besides, it's kinda cool to make design systems.

[Rafsark → rafaelBG]

I'm aligned with your comment. I feel like it saved us a lot of time, even creating a product from scratch & before PMF. We started with a simple one, without over-engineering the DS

[AnhTho_FR → rafaelBG]

Have you seen good resources / examples to build a 'mini design system'? Looks like most of the content about this is made for larger design teams (>20 designers)

[rafaelBG → AnhTho_FR]

Not really... When I'm making a "mini design system", I just create a Figma file with the colors, gradients, shadows, components and typography. I think this is enough to use in a smaller project and you don't have to make it fancy or anything. Just put things there in a way a normal person can understand and that's it. My suggestion is: don't overthink it. If it's not a big project (yet), you can just use your intuition sometimes.

[thibo_skabgia]

When do you think it's too late though?

In some of the companies I've worked at, design was the last priority and at some point, making the effort to switch to a proper design system and do the front-end migration seemed too daunting. So it was never prioritized, until the exit.

[AnhTho_FR → thibo_skabgia]

I doubt there's a formal answer to this, but to me it's like 'branding': won't give immediate results but compounds over time. And if you're a company who's never done branding, catching up after 3y is possible but super hard.

At the end of the day, I think it depends on the founders' sensibilities, because with no measurable ROI there are all the reasons in the world to deprioritize that!

[michaelponrajah → thibo_skabgia]

I think it's never too late to implement a design system, interesting fact is the more you're waiting the more work you'll have to do 'cause you'll have to deal with more migration. At least one way to tackle it is to start with the foundation like a visual language systemised.

[ianpurton]

Your site looks nice but you should fix your page load times.

Looks really slow to me? SPA?

[AnhTho_FR → ianpurton]

Thanks Ian, I work at Lago. May I ask in which geography you are? We can't reproduce it on our end at the moment.

[Rafsark → ianpurton]

Can you test again, we made an improvement and should be better. Thanks again

[Rafsark → ianpurton]

Oh thanks! looking into it

[ponyous]

> - Do you think it's too soon during the early days?

No, but you can just take one off the shelf and adjust colors / fonts.

- How do you manage product consistency without it?

You'll need experienced designer that knows how to gradually build it. Otherwise I can't see a way without.

- Do frontend engineers complain about not having one?

No, because we have one, but they complain when components could be used but something slightly different was designed.

A friend runs a consultancy and we recently spoke about it. They build e-commerce type of websites, they start with a simple mockup, once they are ready they build style guide/components. All other pages are just assembled from these components - don't think this works for completely bespoke software, but it demonstrates that in some cases it's integral to the rest of the process.

[Rafsark → ponyous]

We build a DS from scratch since the beginning, and we feel we saved a lot of designing and engineering time. Releasing new features has been pretty smooth thanks to it. It took about 2 weeks to implement with basic components and it gives us consistency when designing/specifying a feature. But I totally understand what you say. It's not necessary to build a startup reaching PMF.