Summary
Full Transcript
Learn how to build a design system in Figma. By the end of this course you will become a master of building design systems in Figma and understanding master components. ✏️ Course developed by Tim Sullivan. Check out his channel: https://www.youtube.com/channel/UCTGmiyXawbVmFJjpiYSw0Gw 🔗 Tim's website: https://tutorialtim.com/ ⭐️ Course Contents ⭐️ ⌨️ (0:00:00) Introduction ⌨️ (0:03:03) Creating a Color System ⌨️ (0:22:23) Building a Type System in Figma ⌨️ (0:35:16) Elevation ⌨️ (0:57:33) Product & System Icons ⌨️ (1:11:26) Text Legibility ⌨️ (1:30:58) States ⌨️ (1:50:53) Selection (Interaction) ⌨️ (1:55:02) Understanding Layout ⌨️ (2:04:15) Pixel Density ⌨️ (2:12:05) Spacing Methods ⌨️ (2:24:19) Responsive Grid Layout ⌨️ (2:48:59) App Bar - Bottom ⌨️ (3:07:55) App Bar - Top ⌨️ (3:22:37) Backdrop ⌨️ (3:41:58) Banners ⌨️ (4:06:45) Bottom Navigation ⌨️ (4:19:15) Buttons - Floating Action Button ⌨️ (4:38:54) Buttons ⌨️ (5:06:04) Cards ⌨️ (5:41:10) Chips ⌨️ (5:58:15) Dialogs ⌨️ (6:28:56) Date Pickers ⌨️ (7:32:22) Dividers 🎉 Thanks to our Champion and Sponsor supporters: 👾 Wong Voon jinq 👾 hexploitation 👾 Katia Moran 👾 BlckPhantom 👾 Nick Raker 👾 Otis Morgan 👾 DeezMaster 👾 Treehouse -- Learn to code for free and get a developer job: https://www.freecodecamp.org Read hundreds of articles on programming: https://freecodecamp.org/news ❤️ Support for this channel comes from our friends at Scrimba – the coding platform that's reinvented interactive learning: https://scrimba.com/freecodecamp
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
