There isn't anything particularly new about the concept of design systems or style guides. As many have pointed out before, the movement to components evolved from the style books that dominated print design for decades.
Over time, pages were added to those style books that specifically addressed digital concerns. Today, the opposite dynamic exists and the emphasis has shifted firmly to the digital experience.
If we could teleport back in time, we would find a very different digital landscape in the era surrounding the launch of the smartphone. Design was stripped down, unable to express the style of an organization beyond the use of color and maybe a logo. Web typography was in its infancy, browsers still had a lot of incompatabilities with one another, and the ability to transmit images across dreadfully slow cellular bandwidth constrained what designers could do.
When the smartphone arrived, it allowed people to imagine a world where the internet truely portable. The emphasis here is imagine and to best explain why, just watch a few minutes of the debut of the iPhone.
https://youtu.be/vN4U5FqrOdQ?t=2497
As you can see from the video, the future was coming but there was still a lot of work to do. Over the course of a few years, a truly mobile web experience did arrive but it took progress on several different fronts to become reality.
Strides were made in HTML and CSS to make responsive design possible. Bandwidth speeds did gradually increase. Web typography grew steadily as more type foundaries realized that future growth was probably online. All the while, the Open Source movement - dedicated to the free movement of knowledge and digital assets - was expanding.
As designers struggled to create experiences that could translate between the world's of desktop and mobile, the grid was a logical open source starting point. By 2011, frameworks like Bootstrap, which was built by Twitter, and Foundation were providing designers with reusable digital assets that were built for a responsive world.
The entire digital world would begin to suffer from 'Bootstrapification,' as adoption of these frameworks became an easy crutch that quickly drained creativity from the process. The fight to address such conformity while retaining the efficentcy of these frameworks would soon begin.
As designers began too reject the monoculture impact of frameworks, pockets of creativity began to emerge. While Twitter was one of the first to export their design for broad use, others began to openly discuss how they developed their internal design guidelines and systems.
This open dialogue encouraged designers to leverage common knowledge of the community to build their own unique sets of assets.
Design consultant Brad Frost wrote extensively on the topic, eventually compiling his work into the book Atomic Design. Design System advocate and former Salesforce designer Jina Anne launched the Clarity conference, which provided a focal point to the growing design systems movement. Surrounding it all, countless companies and agencies have shed light on their internal work and process through blog posts and documentation. Some are formal design systems, other are less-strict guidelines and many are documented here.
Depending on your perspective, we're either in the very early stages of a movement in design or we're simply entering the next decade of evolution. Either way you choose to view it, it's clear that there is momentum within the design community to continue pushing forward.
Associated Exercises
| Name | Section |
|---|---|
| Designing components | New Pragmatic |