Uploaded May 2026 | Updated September 2026, 2 weeks ago
Learn Figma. Go from an absolute beginner to a confident UI/UX designer, ready to build real-world projects and a strong design portfolio.
You’ll learn core Figma tools and advanced UI/UX concepts, including:
- Figma interface, tools, and essential shortcuts
- Professional style guides and color systems
- Low-fidelity wireframes to high-fidelity prototypes
- Components, Auto Layout, and Constraints
- Real-world projects like travel websites, car dealership sites, and food delivery apps
- Advanced techniques such as multi-dimensional components and 3D web elements
Support the channel: If you found this course helpful, please Like, Subscribe, and hit the Notification Bell to support my work and get notified of future tutorials!
Course created by Wish @supercreatorlabs
Connect with Wish on LinkedIn: linkedin.com/in/heyimwish
Instagram: instagram.com/heyimwish
Email: wishkaemail@gmail.com
Wish's Udemy Courses -
Figma - bit.ly/4pebj6B
Davinci Resolve - bit.ly/davinciresolve50
❤️ Support for this channel comes from our friends at Scrimba – the coding platform that's reinvented interactive learning: scrimba.com/freecodecamp
Course Chapters:
- 0:00:00 Announcement
- 0:01:26 Introduction
- 0:03:07 Who is a designer?
- 0:13:35 Figma Installation
- 0:16:28 Exploring the Browser Page
- 0:22:09 Figma Editor
- 0:24:43 Move tools & Frames
- 0:30:31 Shape Tool, Creation Tool & Text Tool
- 0:35:43 Resource, Hand Tool, Comment
- 0:38:16 Start of Section 02
- 0:39:56 What to expect from section 02
- 0:42:02 Color Palette
- 0:47:06 Low Fidelity Wireframe
- 0:48:03 Style Guide
- 0:55:07 Creating a Component
- 1:05:04 Boolean Operations
- 1:10:16 Setting Constrains in FIgma
- 1:18:07 Layer Panel
- 1:24:25 Creating a Layout Grid in Figma
- 1:30:57 Travel Website
- 2:16:02 Car Dealership Website
- 2:26:07 Creative Gradients
- 2:32:36 Creating a Quick 3d Website
- 2:39:27 Tomato Food Delivery App
- 3:56:45 Donut app
- 4:19:40 Nike Inspired App
- 5:05:28 Image Slider Project
- 5:24:46 Multi-Dimensional Components
- 5:34:33 Rotating can Website
- 6:16:54 End of Complete Course
🎉 Thanks to our Champion and Sponsor supporters:
👾 @omerhattapoglu1158
👾 @goddardtan
👾 @akihayashi6629
👾 @kikilogsin
👾 @anthonycampbell2148
👾 @tobymiller7790
👾 @rajibdassharma497
👾 @CloudVirtualizationEnthusiast
👾 @adilsoncarlosvianacarlos
👾 @martinmacchia1564
👾 @ulisesmoralez4160
👾 @_Oscar_
👾 @jedi-or-sith2728
👾 @justinhual1290
--
Learn to code for free and get a developer job: freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news
Learn Figma. Go from an absolute beginner to a confident UI/UX designer, ready to build real-world projects and a strong design portfolio.
You’ll learn core Figma tools and advanced UI/UX concepts, including:
- Figma interface, tools, and essential shortcuts
- Professional style guides and color systems
- Low-fidelity wireframes to high-fidelity prototypes
- Components, Auto Layout, and Constraints
- Real-world projects like travel websites, car dealership sites, and food delivery apps
- Advanced techniques such as multi-dimensional components and 3D web elements
Support the channel: If you found this course helpful, please Like, Subscribe, and hit the Notification Bell to support my work and get notified of future tutorials!
Course created by Wish @supercreatorlabs
Connect with Wish on LinkedIn: linkedin.com/in/heyimwish
Instagram: instagram.com/heyimwish
Email: wishkaemail@gmail.com
Wish's Udemy Courses -
Figma - bit.ly/4pebj6B
Davinci Resolve - bit.ly/davinciresolve50
❤️ Support for this channel comes from our friends at Scrimba – the coding platform that's reinvented interactive learning: scrimba.com/freecodecamp
Course Chapters:
- 0:00:00 Announcement
- 0:01:26 Introduction
- 0:03:07 Who is a designer?
- 0:13:35 Figma Installation
- 0:16:28 Exploring the Browser Page
- 0:22:09 Figma Editor
- 0:24:43 Move tools & Frames
- 0:30:31 Shape Tool, Creation Tool & Text Tool
- 0:35:43 Resource, Hand Tool, Comment
- 0:38:16 Start of Section 02
- 0:39:56 What to expect from section 02
- 0:42:02 Color Palette
- 0:47:06 Low Fidelity Wireframe
- 0:48:03 Style Guide
- 0:55:07 Creating a Component
- 1:05:04 Boolean Operations
- 1:10:16 Setting Constrains in FIgma
- 1:18:07 Layer Panel
- 1:24:25 Creating a Layout Grid in Figma
- 1:30:57 Travel Website
- 2:16:02 Car Dealership Website
- 2:26:07 Creative Gradients
- 2:32:36 Creating a Quick 3d Website
- 2:39:27 Tomato Food Delivery App
- 3:56:45 Donut app
- 4:19:40 Nike Inspired App
- 5:05:28 Image Slider Project
- 5:24:46 Multi-Dimensional Components
- 5:34:33 Rotating can Website
- 6:16:54 End of Complete Course
🎉 Thanks to our Champion and Sponsor supporters:
👾 @omerhattapoglu1158
👾 @goddardtan
👾 @akihayashi6629
👾 @kikilogsin
👾 @anthonycampbell2148
👾 @tobymiller7790
👾 @rajibdassharma497
👾 @CloudVirtualizationEnthusiast
👾 @adilsoncarlosvianacarlos
👾 @martinmacchia1564
👾 @ulisesmoralez4160
👾 @_Oscar_
👾 @jedi-or-sith2728
👾 @justinhual1290
--
Learn to code for free and get a developer job: freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news
