"Design Systems" was retired on September 13, 2021. You are now viewing the recommended replacement.
- Design
- Beginner
About this Course
Learn how a scalable, repeatable design system leads to a more efficient design. Learn the components of a design system, and how to work with existing documentation.
What you'll learn
- The importance of a design system
- The components of a design system
- How to read design system documentation
- Advocate for the benefits of a design system
Understanding Design Systems
A design system is a set of rules that guide the design of a website or app. Design systems help create predictable experiences for users, and help designers work more efficiently and build interfaces consistent with an organization’s visual brand without wasting time exploring design problems that have been solved already.
4 stepsVisual Design Language
Design system documentation should specify clear rules for applying elements of style.
These design system building blocks include color, typography, spacing, image, and motion.
7 stepsUser Interface Library
In the User Interface Library, pieces of a design system’s visual design language are assembled together to create interactive elements.
3 stepsVoice and Tone
Imagine your product as a living person. What terms would you use to describe its personality? Friendly and playful? Confident and loud? Formal and serious? A design system should guide copywriters towards keeping brand voice consistent and tone appropriate.
3 stepsTeacher
-
Anwar Montasir
Anwar Montasir is a UX Design, Front End Web Development, and Full Stack JavaScript instructor.