Design languages and systems
How enterprises create consistent digital experiences
Design languages and systems are a hot topic these days. They are a response to the challenge of creating consistent, seamless, and compelling digital experiences in the context of an increasing number of devices, channels and touchpoints. Within the design constraints presented by responsive and adaptive design, libraries of experience principles, (visual) design elements and sometimes even code examples for enterprise digital experience design are emerging.
Although design languages and systems come from a tradition of patterns and design frameworks, the emergent examples have a broader scope than just a style guide for branding or user interfaces for products. In these examples, not only are design rules for typography, iconography, and photography specified, but also experience principles, task structures and re-usable interaction components. And some examples even contain accompanying resources, such as color palettes, templates for Adobe Illustrator/Photoshop or code snippets on Github. A remarkable fact is that some of them are freely accessible to everyone, in order to elicit feedback from design professionals.
According to Wikipedia, a design language or vocabulary is “an overarching scheme or style that guides the design of a complement of products or architectural settings. Designers wishing to give their suite of products a unique but consistent look and feel define a design language for it, which can describe choices for design aspects such as materials, colour schemes, shapes, patterns, textures, or layouts. They then follow the scheme in the design of each object in the suite.”
Two impressive examples of these public design languages and systems are from IBM and Google.
IBM’s Living Language: A shared vocabulary for design
“The IBM Design Language is a set of living guidelines that communicates a brand promise through our products’ experiences. Our goal is to design for experiences that work together, work the same and work for our users. We create many different kinds of products, so our language is designed to be more instructive than prescriptive. This effort is relatively new and intentionally crafted to evolve through feedback from product teams and users. We invite you to use our language and join the conversation at IBM Design.”
The IBM Design Language is especially relevant in the context of the slew of mobile enterprise applications to be launched as a result of the alliance between IBM and Apple.
Google’s Material Design
“We challenged ourselves to create a visual language for our users that synthesizes the classic principles of good design with the innovation and possibility of technology and science. This is material design. This spec is a living document that will be updated as we continue to develop the tenets and specifics of material design.
The foundational elements of print-based design—typography, grids, space, scale, color, and use of imagery—guide visual treatments. These elements do far more than please the eye. They create hierarchy, meaning, and focus. Deliberate color choices, edge-to-edge imagery, large-scale typography, and intentional white space create a bold and graphic interface that immerse the user in the experience.
An emphasis on user actions makes core functionality immediately apparent and provides waypoints for the user.”
Material Design is used for the fast range of products and services Google delivers for the web and its mobile Android platform.
Design Systems at Work: Optimizing design processes and aligning design work to company identity: Master’s thesis Collaborative and Industrial Design School of Arts, Design & Architecture Aalto University (Aïcha Konaté, 2018)
Examples of design languages and systems are those from Airbnb, Intuit, The Guardian (Containers), SalesForce, Atlassian, BBC (Global Experience Language), Hudl, QuickBooks, FutureLearn and Gov.uk. And more to find at StyleGuides.io.
Since 2016, there is the Clarity Conference (on design systems) accompanied by a regular newsletter with curated collections of articles, podcasts, and blogposts on Design Systems.
Alla Kholmatova (@craftui) wrote the seminal book on Design Systems (2017).
Finally, an in-house presentation I gave on Design languages and systems (2015).
About the author
Peter Bogaards (a.k.a. @BogieZero) is the editor-in-chief of our blog BiRDS. Peter also works as a curator and coach at Informaat experience design. He has been an online content curator avant-la-lettre in various UX-related fields for almost three decades, choosing what he thinks is interesting, relevant or remarkable to share.
Customer experience (77), Design systems (3), User experience (51), UX management (13)