Development Design Projects Contact Blog

Design System for a startup, best practices

As we've mentioned in the previous post, design systems against popular belief CAN and SHOULD be used by startups as well. They don't need to be as robust as ones made for established brands, but adapting the "design system" first approach allows you to iterate faster on MVP stage as well.

Here's the why and the how. ➡️

design systems diagram

Why do I need a design system?

To keep consistency and order in the product. That way you won't spend time doing repetitive tasks over and over. You can focus on what's truly important. 🍺

Also you don't want to waste money on paying many times for fixing design miscommunications, do you? 💸

How to do user testing with a design system?

The good thing about user testing your UI is that you clearly see what works and what doesn't. Make a plan, build the first iteration and then validate. 🧪 💥

If your initial idea fails and another idea turns out the be better, you can actually add both to the documentation of the design system and specify the new one as the "master".

The old one can serve as an example for future design system updates to be taken into consideration. So you can use the old one as a warning basically.

Rush to market, harsh reality of inconsistencies

As most startups go rushing to market, the inconsistencies can yield false results - what it means is that your users can dislike a perfectly good product, because they feel it kind of sucks. That's harsh, I know. Having a design system would create a level of consistency that's completely apart from personal taste. 😳

Let me repeat that. Rules and consistency are generally apart from personal taste. People will appreciate consistency even if they dislike the colors or fonts you used.😖

even big brands do silly ui mistakes

This is an example how you can find inconsistencies and bad UI even in big banking apps. The photo is from my talk back in early 2018, and even though some of the apps got updated since then, they're still not error free. This is what design systems and QA are for.

Design.

In this new agile world the word "design" has been tossed around quite a bit. At this point it may have lost it's meaning, but generally a "design" means "according to plan".

If you don't have a plan, but "artistically" improvise as you go, you may have created art. 🎨🖼 But that's not design and in nearly ALL the cases art doesn't work for product interfaces. 🥵

So don't be an artist painting pixels and creating vector paths on a canvas. Be a designer and plan around how objects are built and how they relate to one another.

On a side note I know that for some stupid reason the individual canvases in most tools are called ARTboards. Someone at Sketch probably had a sense of humor. 💎🤔

All the below projects were based on at least a very minimal design system. None were designed by "just painting pixels".

design systems apps

Go generic if you have to. It's always better than artsy.

If you're really on a budget and need to test your MVP fast, it's a way better route to use an existing design system. Not a perfect choice, but better than coming up with a half baked one. Even Material Design if followed precisely (that's without bending the rules) can make more sense than randomly putting together some objects and shapes that you personally like.

The notion of designers being "artists" goes a long way back. I remember clients back in 2009 saying stuff like "I'll let you paint the buttons your way, you're the artist!". 😡

It was frustrating back then as it is frustrating right now.

🤦‍

art vs design

Art vs Design 🥊

Of course there's a place for "art" in design. But only one.

Illustrations are "Art pieces" that can serve as part of the overall design of a product. Currently they're quite popular and trendy too. But aside from some visual aid and look&feel they don't have a functional purpose. They're not "interface". They're the part that adds some personality to the interface. They're also not necessary, but a nice to have.🎈

Don't confuse the two and you'll be fine.

Stay up to date!

Sign up for our bi-weekly newsletter to get extra tips and tricks on how to make better products.

Privacy policy

Also Read

Design + UX

Quickly fix your UI Marketing messages to avoid confusion

Design + UX

Analysis of design trends in cryptocurrency websites

We gained our expertise by working for clients such as

Viacom logo
mBank logo
Samsung logo
Payback logo
Analizy logo
Kup Fundusz logo
Seachange logo
Nickelodeon logo
Comedy Central logo
MTV logo
Paramount logo
Viva logo
Szkoła Wyższa Psychologii Społecznej logo
Sage logo
Renault logo
BWM logo
Multikino logo
Oriflame logo
Analizy logo
Kup Fundusz logo
Paramount logo
Viva logo
/user/themes/hype4-theme/img/2019/

Let's talk about
what you want to create.

Contact us! We will get back to you shortly:

Additional contact:

Michał Malewicz

[email protected]

Szymon Adamiak

[email protected]