Shipwright Academy – Design System Course

Course Introduction

• Lesson 1: Component Capture
• Lesson 2: Creating a Color Palette
• Lesson 3: Creating Design Variables in Figma
• Lesson 3.1 Variables Naming Continued
• Lesson 4: Type Scale
• Lesson 4.1: Type Scale Line Height Tip
• Lesson 5: Cleaning up Variables and Type Styles
• Lesson 6: Building our first Component Toggle
• Lesson 7: Avatars
• Lesson 8: Cards
• Lesson 8.1: Cards Part 2
• Lesson 9: Buttons
• Lesson 10: Galleries & Pagination
• Lesson 10.1: Galleries & Pagination Pt 2
• Lesson 11: Inputs
• Lesson 11.1 Inputs Part 2
• Lesson 12: Links
• Lesson 13: Header
• Lesson 13.1 Header Part 2
• Lesson 14: Footer
• Lesson 15: Blocks
• Lesson 16: Publishing and Testing our System
• Lesson 17: Finalizing our Components
• Conclusion & Resources
• Bonus: List Items

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.