In the book Atomic Design by Brad Frost, he says

” Ultimately, a project’s level of effort is much better determined by the functionality and components contained within those pages, rather than on the quantity of pages themselves. ”
Brad Frost

This is where a design system can help. Rather than building standalone pages one at a time, focus on creating reusable components that can be mixed and matched to create different layouts, whether it’s for presenting content on one or many pages. In addition to writing modular code, creating a design system also includes determining the process and workflows, writing documentation, creating style guides, and anything else required to make your product.

Throughout this article, I’ll be making an overview about all these different parts to help you decide what you need and how to get there.

The process

The process of implementing a design system may vary across projects and organizations, but the basic principles are:

Use a component-based approach to create reusable patterns
Standardize the workflow
Create a common toolkit
Documentation for the whole team

It’s one thing to say that you want to create a design system, and it’s another to actually do it. To get the full advantages of a design system, organizations must be prepared to make it happen. Let’s talk about some of the benefits first.

Benefits :

Design systems promote consistency by planning ahead and working towards one unified set of guidelines for your entire project. Consistency will improve user experience, and also help with design and development workflows, and team efficiency.
Design systems also reduce repetitive work. Creating a library of common patterns, writing modular code, and creating a framework means that elements can be reused, instead of recreated each time they’re used.
For the developers on your team that don’t specialize in front-end, they can also benefit from having a customized front-end took kit, rather than relying on generic UI kits.
Having documentation makes it easier and faster to onboard new team members, and also provides a centralized reference for the whole team.
Team communication is improved, because everyone has to work together to think about how changes, updates, or revisions will affect the system as a whole.
A more thoughtful approach to building the product , planning, collaborating, and writing documentation also helps to clarify thought processes and reasoning behind the decisions made in the process of creating the website or product.

A design system is an investment, and requires looking at the long-term benefits. For many teams, it can be quite a departure from their current workflow, which can lead to some challenges.

Challenges :

Decisions are often based on time and budget. Building an intentional design system requires time and people, and there’s no way around it
Depending on the skill set of your current team, you may need to hire some outside help to create and maintain the system, which can also affect the budget.
A design system is often a work in progress. If your product gets redesigned, updated, or changed in some way, then related materials should also be updated and maintained. If it isn’t, then all that effort may be wasted if the system gets neglected and out of date.

If you commit to creating a design system, then it cannot be treated as a side project or a nice to have item. It must become a part of your priorities and workflow. In a nutshell, the challenges around creating a design system really just boils down to being able to commit to putting the time, effort, and budget into it.

Hopefully the many benefits that a design system provides can convince the powers that be to invest in this process.

Thanks for reading .

Resources :

Lynda.com
Uxdesign.cc

design system

Posts

Developing a design system