Skip to content

PRO TIP Block youtube.com at the DNS level — Pi-hole, NextDNS or your hosts file — but allow youtube-nocookie.com and i.ytimg.com. These tutorials keep playing; the rabbit hole does not.

Learning without distractions

Document, improve and update your design system – Lesson 4 : Introduction to design systems

59.9K views on YouTube

Figma 71 tutorials here

Figma is free to use. Sign up here: https://bit.ly/3msp0OV

Habitz design system Community file: https://bit.ly/3BVcql4

Video course: https://bit.ly/3WwqzyI

Written course: https://bit.ly/3MrJE0m

In this lesson, let’s learn a few ways to support the ongoing success of your design system, like:

– effective documentation,
– improving your system through testing, feedback, and contributions,
– how to manage updates,
– and how to make sure people are using it.

____________________________________________________

Resources:

Google Material Design: https://bit.ly/3IBbfuN
Atlassian Design System: https://bit.ly/45qn68O
Storybook: https://bit.ly/3IZ6FXN
Notion: https://bit.ly/3q8JT9e
Design Lint by Daniel Destefanis: https://bit.ly/3WsWyQc
Roller Design Linter by Contrast: https://bit.ly/433HGdD
User Interview Templates: https://bit.ly/42TH5Lz
Design Research: https://bit.ly/43hBxLf
Semantic Versioning 2.0.0: https://bit.ly/3MPFRvg
Figma Help Center: Guide To Branch and Merging: https://bit.ly/3MRHh8v

____________________________________________________

00:00 – Introduction
00:23 – Documentation
01:13 – Documentation setups
01:49 – Component documentation link tip
02:00 – Habitz team documentation
02:35 – Spacer example
03:21 – Design linter tip
03:38 – Improve your design system
04:10 – User testing
04:48 – User testing tips
05:34 – Habitz user testing example
06:03 – Feedback
07:08 – Design system analytics tip
07:21 – Contributions
08:26 – Habitz team contribution example
08:57 – Versioning and change logs
09:24 – Semantic versioning
10:31 – Branching and merging
11:28 – Habitz team branching and merging example
11:55 – Advocacy
12:46 – Wrap up

____________________________________________________

Find us on ⬇️
Twitter: https://twitter.com/figma
Instagram: https://www.instagram.com/figma
LinkedIn: https://www.linkedin.com/company/figma
Figma forum: https://forum.figma.com/

____________________________________________________

#Figma #Config #FigJam #Tutorial #NothingGreatIsMadeAlone #design #tips #DesignSystems