The secret sauce behind great digital products: Design Systems

Sofía Acher, IT Copywriter https://www.linkedin.com/in/sofia-acher/
Matías Canobra, Full Stack Designer https://www.linkedin.com/in/nelocanobra/
Gonzalo Vilar, Lead Design Strategist https://www.linkedin.com/in/gonzalovilarzanetti/

The following text is a summary of the article, to read it completely visit https://www.onetree.com/blog/the-secret-sauce-behind-great-digital-products-design-systems/

Why is a design system important for your organization? Investment, consistency, and scalability. A design system really helps to save money in the development process in the long term. The design system provides order, guidance, helps and improves teamwork, and many other benefits. As we use validated components, we reduce the cost of maintenance in the long term. The investment may be higher at first when the learning curve is more steep, but in the long run, the savings are greater. In addition to this, it is also advantageous for product’s consistency and scalability. Big companies, that have a wide variety of products and services, in which digital products are highly valuable for their businesses, need reusage practices to agile development process and favour consistency.

What is the design system and what should be taken into account?

A design system has a company’s or brand’s reusable components, elements, and style guides. It is its language: how it looks, feels, and sounds, the brand’s voice (Levitt, 2020). It is a living document constantly shared between designers and developers. It is not only a styles’ guide created exclusively by designers, developers have to create code for each component. Designers need to design already with a development’s mindset, which is something that changed a lot in the role. They have to start from understanding the base grid, the design’s principles, what types of devices to use, what are the colours or texts to use, what type of icons and how they will be developed. They have to consider the constraints or limitations every technology has, when developing something for Native iOS, Native Android, or React Native, which have their own styles, as well as in which device it will be used, even if they are designing for Data Visualization in which other players take part, such as Tableau.

The added value the Design System brings

Everything is given in the design system, all designers and developers have to do is enter and check how it is done. This is fundamental for decision makers. For them, this process is a must, but for product owners it is beneficial for the ROI. Design systems save time and money; only by suppressing code redundancy, more than 20% of a developer’s time can be recovered. If we estimate 75 dollars an hour for a developer in a team of 10 developers, 2.5 hours per week would be saved, which results in an annual saving of 97500 dollars. At the beginning the learning curve may be more pronounced but then it becomes more stable, reduced to less development hours, less design hours, less hours of making decisions and developing a flow.

At Onetree we have designers and developers focused on design systems. The relevance of this lies in the fact that there is a community of practice because there are many different ways to build a design system, so we have to share knowledge and come to terms on which are the best practices.

This is a summary of the original article, to read it completely visit https://www.onetree.com/blog/the-secret-sauce-behind-great-digital-products-design-systems/

References

Levitt, D. (2021, 13 septiembre). Design Systems Will Change UX/UI Jobs

Delta CX. Medium. https://medium.com/delta-cx/design-systems-will-change-ux-ui-jobs-e29f1d978553