A Design System is the single source of truth which groups all the elements that will allow teams to design and develop a product, or a set of deliverables. It should evolve constantly with the product, the tools and with new technologies.
Essentially a design system allows any designer or developer to go to one source of truth to understand how a brand designs and builds their products in any of their digital channels. No need to continue digging around for brand guidelines, which were most likely not created for digital channels and are probably out of date. Also, no need to chase that digital agency from 5 years ago, who built built the employee portal, for the icons they created in Adobe Illustrator.
It starts with an up-front investment which is needed to create the design system. It takes careful planning and a mixture of design and front-end development expertise. However, this investment will pay off in the long run, if maintained. The larger the organisation digital footprint (number of digital channels and products), the greater the potential cost saving.
A design system is a living resource and should evolve as products evolve and new products are designed, with new technologies. For example, if Apple were to release the iPhone Circle (cannot think of a cooler name), with a circular user interface, then companys' design systems must be updated to include new UI components, objects and libraries to deliver the same optimum user experience on this new interface. Otherwise, the design system becomes out-of-date and defunct, and all that initial investment will be lost.
So how does it speed up design delivery? On the design front, essentially, if you have one single source of truth for designers, then you greatly increase design efficiency for access to guides and resources. The creation of objects and icons etc is not needed, and should be a lift and shift for designers.On the development front, again it acts as a library for front-end code and styles. Again, increasing efficiency in delivery.
A recent report from Gartner in March 2021, found the following 3 key findings with design systems:
- Digital products designed from scratch often lead to inferior usability, visual and behavioural inconsistencies, and longer design cycles.
- Many product teams create original, custom-made design systems, resulting in unnecessary complexity that requires too much time and effort to design, build and maintain.
- Design systems age quickly, eroding their capacity to increase product usability and quality and decrease time to market.
What this report is telling us is that design systems are a very valuable resource and can greatly speed up design and development cycles, however, they take careful planning and should have a continuous maintenance.
When starting a new design system, you have to start from scratch and involve every team which has a design or development input in any of the products and channels. Collaboration is key at the beginning to avoid several design systems in parallel. Its strength lies in its Single Source of Truth.
More and more organisations are creating design systems and one of the first challenges they face is: how are we going to build this? There are 3 main options to consider, with lots of variables in between, and each with their advantages and costs etc.
- Build from scratch using any front-end architecture
- Out-of-the-box solution or utilise existing design systems (e.g. Invision Design System)
- Use accelerators to lessen development time (e.g. Storybook)
At everis we talk these options through with our clients to help them choose the right options, according to their needs. Get in touch to find the best way to create your own design system, to invest wisely and realise the benefits for the long term.
In the meantime check out this resource for a host of different design systems available online: https://designsystemsrepo.com/design-systems/
A design system is one of the most important strategic assets for your company.