Skip to main content
CourseFlix

Design System Course for Figma

0h 0m 0s
English
Paid

This course shows you how to build clear and useful design systems in Figma. You learn how to plan parts, set rules, and match your work with your team’s flow and feature needs.

Who This Course Helps

This course is for people who work with products and need clear design rules.

  • Beginner designers — working alone or in small teams that work close with developers.
  • Designers with workflow issues — dealing with fast changes and new feature demands.
  • Developers — who want clear standards but lack time to search for them.
  • Project managers — who use Figma and want to apply design systems with their team.

What You Will Learn

You move through two simple stages. Each stage builds skills you need for real work.

Theory

You learn core models that guide good design systems. These models help you make clear choices and solve hard layout and workflow problems.

Practice

You follow step‑by‑step videos to build a system from scratch. This helps you use theory in real tasks and work with confidence on any product team.

Built From Team Experience

This course comes from the full Headway team. We share methods we use every day. You see how real teams plan, build, and grow design systems that match their own needs.

Additional

  • Shipwright: Getting Started with Design Systems - Lesson 1-21
  • Shipwright: Build your first Design System in Figma -  Lesson 22-47

About the Author: Headway

Headway thumbnail

Headway — more than just a name. This is our approach to work and life. It is a commitment to help you focus on what truly matters in order to create impact and achieve results. To move forward, even when the wind is against you and the odds are stacked.

Watch Online 47 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 47 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: 1. Why Design Systems
All Course Lessons (47)
#Lesson TitleDurationAccess
1
1. Why Design Systems Demo
00:00
2
2. Understanding Atomic Design
00:00
3
3. Sessions and Workshops to Run Before Starting a System Build
00:00
4
4. Planning Your Design System Effort
00:00
5
5. Abstracting Your Design System
00:00
6
6. Accessibility In Design Systems
00:00
7
7. Setting Up Your Design Files in Figma
00:00
8
8. Establishing a Naming Convention for Your Design System
00:00
9
9. What are Design Tokens
00:00
10
10. Establishing Type Tokens
00:00
11
11. How Design Variables Work for Your Design System
00:00
12
12. Establishing Color Tokens
00:00
13
13. Component Properties
00:00
14
14. Base Bulk Edit Components
00:00
15
15. Complex Components
00:00
16
16. Block Based Systems
00:00
17
17. Slot or Replace Me Components
00:00
18
18. Coordinating with Developer Handoff
00:00
19
19. Creating a Design System Governance Model
00:00
20
20. Pattern Specific Documentation
00:00
21
21. Design System Documentation
00:00
22
1. Course Introduction
00:00
23
2. Lesson 1 Component Capture
00:00
24
3. Lesson 2 Creating a Color Palette
00:00
25
4. Lesson 3 Creating Design Variables in Figma
00:00
26
5. Lesson 3.1 Variables Naming Continued
00:00
27
6. Lesson 4 Type Scale
00:00
28
7. Lesson 4.1 Type Scale Line Height Tip
00:00
29
8. Lesson 5 Cleaning up Variables and Type Styles
00:00
30
9. Lesson 6 Building our first Component Toggle
00:00
31
10. Lesson 7 Avatars
00:00
32
11. Lesson 8 Cards
00:00
33
12. Lesson 8.1 Cards Part 2
00:00
34
13. Lesson 9 Buttons
00:00
35
14. Lesson 10 Galleries & Pagination
00:00
36
15. Lesson 10.1 Galleries & Pagination Pt 2
00:00
37
16. Lesson 11 Inputs
00:00
38
17. Lesson 11.1 Inputs Part 2
00:00
39
18. Lesson 12 Links
00:00
40
19. Lesson 13 Header
00:00
41
20. Lesson 13.1 Header Part 2
00:00
42
21. Lesson 14 Footer
00:00
43
22. Lesson 15 Blocks
00:00
44
23. Lesson 16 Publishing and Testing our System
00:00
45
24. Lesson 17 Finalizing our Components
00:00
46
25. Conclusion & Resources
00:00
47
26. Bonus List Items
00:00
Unlock unlimited learning

Get instant access to all 46 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription