This course and kit helped these companies

What designers love about the course

Reflected a realistic workflow
"Appreciated that it reflected a realistic workflow - some of the order of operations represent what I work through in my job, NOT a polished linear “YouTube” or bootcamp experience and I loved that."

Mercedes Mack

UX Designer, Fuzzy Math

Practical steps to tackle problems
"It provides practical steps to tackle all of the problems when setting up, maintaining, and implementing a healthy, evolving design system."

Clint McManaman

Interim Head of Design, UnitedMasters

Complete end-to-end resource
"Whether one is starting from zero or somewhere in between, I liked how clearly the material was presented and having access to real resources."

Ryan Tauss

Design Manager, Bestow Life Insurance

Why listen to us?

Credentials that speak for themselves

Our design resources have been downloaded thousands of times in the Figma community. The Headway design team has contributed countless hours to mentorship and design education. We don't like to brag, but we think it's important to share what makes our work stand out from the rest.

60K

Resource downloads in Figma Community

Our UI Kit is a favorite in the Figma community, and for good reason. With its high-quality design elements and customizable features, it's the perfect starting point for any designer.

120

Hours of Dribbble and ADPList mentorship

Our design teachers have dedicated over 100 hours into mentorship and education on platforms like Dribbble and ADPlist. This video course will tap into this wealth of experience and expertise.

30

Happy clients using our Shipwright UI kit system

With the principles in this course, we've developed a powerful design system kit called Shipwright that we use to jumpstart the design system process with clients.

Benefits

Gain control of the process

With our video course, you'll learn how to create a system that works for you—not against you.

Create consistency

Use atomic design principles to set up your design system with consistent naming conventions.

Leverage systems

Build components with a systematic approach using concepts like bulk edits and “replace me.”

Improve hand-offs

Document and manage your design system for better hand-offs to the development team.

Design System Templates and Videos

Super-charge your design workflow

preview of shipwright ui kit in figma
Establishing Building Blocks

Who is this for?

There's something here for everyone!

Rookie Designers

You're alone or on a small design team that collaborates with a lot of developers.

Struggling Designers

You’re struggling to keep up with the ever-changing demands of adding new feature sets.

Developers

You don’t have the time to scour the internet to keep up with evolving industry standards.

Project Managers

You're comfortable working in Figma and want to leverage the design systems with your team.

a look at what's inside

What do the courses Help You Do?

There are two required paths to becoming a design system expert.

Learn the theory

What are the models you can use and why do they matter? This helps you solve complex design challenges within projects. In these videos you gain wisdom

Then you build

Put the theory into practice with step-by-step tutorials. With the theory and practical skills combined, you will become a powerful resource and leader for any product team.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Design System Foundations
Beginner
6 Lessons
1h 03m
Why Design Systems?
7:25
Understanding Atomic Design
10:04
Sessions & Workshops to Run Before Starting a System
16:37
Abstracting Your Design System
10:56
Accessibility in Design Systems
5:19
Design System Core Concepts
Intermediate
7 Lessons
1h 41m
Component Capture
25:15
Creating a Color Palette
18:22
Creating Design Variables
31:46
Variables Naming Continued
11:33
Type Scale
16:36
Establishing Building Blocks
Beginner
6 Lessons
2h 05m
Establishing a Naming Convention
7:08
What are Design Tokens?
11:41
Establishing Type Tokens
20:52
Setting Up Your Design Files in Figma
14:34
How Design Variables Work for Your Design System
58:42
Building Components
Intermediate
14 Lesson
4h 09m
Building Our First Component Toggle
25:22
Avatars
27:58
Cards: Part 1
48:14
Card: Part 2
19:12
Buttons
19:14
Component Architecture
Beginner
5 Lessons
1h 26m
Component Properties
8:36
Base / Bulk Edit Components
12:09
Slot or Replace Me Components
14:56
Complex Components
30:37
Block Based Systems
8:47
Publishing & Using Our Design System
Intermediate
2 Lessons
36m
Publishing and Testing Our System
9:44
Finalizing our components
25:47
Documentation and Maintence
Beginner
4 Lessons
38m
Pattern Specific Documentation
4:58
Coordinating with Developer Handoff
2:50
Creating a Design System Governance Model
19:05
Design System Documentation
10:50
Building Skills for Tomorrow

Invest in your career and future

Try risk-free! If you don’t think this course delivered you value, you can get your investment back within 14 days.

Can your company to pay for it?

Added Bonuses

Figma UI Kit
Figma Variables Guide
Design System Checklist
Component Best Practices Guide
Design System Structures Guide
Governance Model Template
Product Team Interview Guide
Type Scale Worksheet and Plugins
We've seen it all

Learn from our collective experiences

The course wasn't created by just one designer. The entire design team at Headway is working together to share the best ways to craft design systems that meet your unique needs.

Breanna Clemens

Design Lead

Sam Pecard

Senior Product Designer

Riley Hennigh

Product Designer

Clint McManaman

Staff Designer

Taran Singh

Product Designer

Kady Jesko

Senior Product Designer

Damiano Redemagni

Senior Product Designer

Melissa Gallagher

Senior Product Designer

Billy Sweetman

Head of Design

Thinking about it?

Check Out A Free Lesson

FAQs

How long does it take to complete a typical course?

These lessons are self paced, but we recommend a pace of four weeks. The important thing is to go at a pace you are comfortable with and see how you can apply what you learn to projects in the real world.

How can I get my company to pay for it?

We actually have a handy dandy email and message template to use to help you ask your company so you can expense it. Grab our "Can I expense this?" Template here.

Do you have any free content?

Yes we do! Our YouTube channel has over 800k views and 10k subscribers full of videos on design systems, UX audits, and design leadership. We also have articles and resources at headway.io.

Is this thing really worth it?

Fair question. Why trust us? Our team at Headway uses these lessons and templates to for training designers at companies like Ford. We also use them for onboarding new designers at Headway.

Will there be more videos added to the courses?

The plan is to make these courses and the Shipwright Academy a living, breathing educational resource. If Figma has updates, we'll add new videos to fill in the gaps. We also plan to add other courses for specific topics such as UX audits, typography, and even design systems for developers.