1 Great Design System delivers consistency and uniformity
Save time while creating a consistent experience throughout your digital landscape.
The Internet has grown from being the strangely, ugly little duckling to a young, slightly matured, handsome beast. Gone are the years when we had no typography, video, or even entertaining animations to be gentle on our eyes. Nowadays, most organizations have their public website, but also a portal, and their custom web applications. “Don’t forget our app!” ah, yes. And an app. But how do you make sure that all these applications remain consistent in style and experience? Enter scene: Design Systems!
A design system is a library that stored the building blocks of your digital services or products. It’s an ideal starting point when considering Digital Transformation, even when you’re (still) a smaller organization.
Your organization has multiple teams: content, communications, marketing, or sales. Because they all work from a single source of truth, they will all have the same building blocks, creating consistent imagery and designs—a consistent design results in a consistent experience.
How did we even get here?
We all have that one older brother that, for some reason, has seen it all. He’s gone through everything we are currently struggling with. And for us digital natives, our older brother is print.
And print has documented corporate identities for decennia. One of the most famous examples is the analog design system of NASA for print design.
NASA’s documentation of its identity solved a lot of issues. For example, people are no longer messing with the logo. Adding things to it or simply even changing its colors. The document shows how to use the logo and all other graphical elements of the system. From letterhead to astronaut suits and spaceships.
But what about now?
It’s not easy creating great digital products. It requires a lot of hard work from a lot of people who have their way of doing things. Multiple disciplines that are involved work in their solutions and systems.
But we’ll do you one better: Modern digital products, software, saas products, apps are more complex than ever.
There is a need to improve the way we design together. Because we should all speak the same language when working for the same organization. We should all be able to offer the same, flawless digital experience to our users.
Creating consistency with Design Systems
Some call them Atoms, Components, or even Lego bricks. Design Systems do not only exists from these small, reusable parts, but it also explains the rules and vision behind the design. It is a library full of visual, effectively reusable elements.
The desired outcome of a Design System is always consistent. Not only in the way it looks, in the way it works, but also in the way we use it in a design. The smallest version of a Design System is an online style guide. The more complex Design Systems also include principles, dynamic front-end components, technical documentation, writing style (tone-of-voice), and even writing rules!
How will you describe your Design System?
An easy way to formulate the project of your Design system is as follows:
Our design system offers
A visual style, UI components, and accessibility procedures
released as an
React component library and Sketch assets via Lingo
and documented at
a systems team of 1 systems lead, 1 product manager, 1 designer, and 2 front-end developers partnering with a React-based engineering team
in order to serve
~10 web-based and 2 native app products and experiences.
We want to suggest adding an old but classic “why?” to this list. Are you experiencing tension between your designers and front-enders? A lot of complaints about exceptions or new patterns? Get them on the same page by working together on a Design System! It will result in more consistency and a better understanding between two specializations.
Material Design & Carbon Design System
If you’re looking for a bit of inspiration, take a gander at https://designsystemsrepo.com/design-systems – an online collection of some of the most prominent Design Systems from Apple, IBM, Microsoft, Google, Airbnb, Lonely Planet, Salesforce, and more.
Our Design System experience
During our time at The Dutch Financial Time, BuitenAardig has designed and implemented a new Design System. Our goal: To create a more consistent experience through multiple apps across multiple devices. You can find more information about the project below this article.
Last but not least, at ORTEC, Philip worked on redesigning locally run software (.exe files) to modern in-browser web applications. Leaving behind a Windows UI, we created a new ORTEC Design System based on Google’s Material Design with our personality. It created a consistent experience and a unique visual style for ORTEC’s products.
Is your organization ready to take its design to the next level? Investing in a Design System as early as possible will result in the highest possible ROI.
In May 2018 the Dutch Financial Newspaper “Het Financieele Dagblad” achieved an historic achievement when the membership passed 85.000 subscriptions. The previous years, the paper has been stable between 45.000-46.000 subscriptions. The Online Subscriptions of the grew with 41.000 readers. Check out the full project here.