Join Tom Green for an in-depth discussion in this video What is a design system?, part of Developing a Design System with UXPin.
- [Narrator] An obvious place to start this course is with an obvious question. What is a design system? A great answer is this very short one from UXPin itself. A design system is a single source of truth, Now that may sound a bit vague, but it strikes right to the heart of the purpose of a design system though many may regard a design system as a detailed style guide or a library for UI patterns they would be seriously missing the point.
A design system at its heart is a blueprint for product development it provides all of those involved in the design and development process with a single documented source for the design principles, visual assets, code references and UI patterns required to provide brand consistency across all screens and if any company is concerned about brand it is this one IBM in short everybody involved has access to the truth. That word consistency is critical to understanding why a design system is so important.
In today's complex team based UX work flow things can rapidly spiral out control as team A makes a small change to a component such as a button and team B changes a color tint and as the complexity increases inconsistencies and inefficiencies will tend to show up in the final product and all that implies. Here is a great example of the use of a design system: The BBC the British Broadcasting Corporation has had a strong web presences for almost as long as the web has been around in order to cope with this new medium the BBC developed these page layouts standards which was really nothing more then a general guideline than anything else and general guidelines tend to lead to inconsistencies.
This resulted in a rethink of the whole process and in 2010 the BBC released their Global Experience Language because as they admit prior to GEL the Global Experience Language the BBC's many websites were all designed differently resulting in a confused online experience. Their explanation for this change is quite succinct maintaining consistent ux design across all touchpoints from mobile phones to connect the TV's is vitally important for a number of reasons: It provides a recognizable and delightful experience giving users the confidence to explore more of our online content, It increases our efficiency and productivity by enabling us to move faster, It allows our numerous services to develop collectively rather then independently.
Those three reasons are why a design system is so important to the UX design and development process. It is that single source of truth such as the card base layout you're looking at here from the BBC's GEL guidelines it is that single source of truth that brings consistency to the disorder of inconsistency.
- What is a design system?
- Creating a design system
- Adding colors, typography, and other assets
- Integrating Photoshop and Sketch
- Wireframing and prototyping
- Sharing your design system with team members