Figma tutorial for Beginners: Complete Website from Start to Finish
3.3M views · 2022-05-20
UI Design
✨ FREE Resource: Put AI to work on your next project. In our Web Designer’s Guide to AI, we show you which tools make sense at each stage of a design and how to use them without losing your creative direction. Download for free 👉 https://bit.ly/4xVs5LX
Here in 2026? Check out our most up to date Figma crash course 👉 https://youtu.be/m9uXR4xt95w
-
Build alongside Ran by downloading the starter file here 👉 https://bit.ly/figma_tutorial
Need a new Figma account? - https://psxid.figma.com/s8z3306bhq0h
FREE TRAINING: 3 Steps to Build a Thriving Web Design Career 👉 https://bit.ly/3Tiua2G
See part 2 on how to build this site with Webflow: https://youtu.be/JnwATqjYohI
📽️ CHAPTERS
00:00 - Introduction
01:00 - Figma interface overview
04:30 - Page & grid setup
09:30 - Designing the hero & navigation
21:20 - Creating the background effect
25:00 - Building the content section
30:50 - Masking & blend modes
36:30 - Using Gradients
39:00 - Building the footer
40:40 - Designing a form
42:00 - Next steps
🎨 Learn the Art & Business of Web Design. Check out all our courses 👉 https://bit.ly/3jMxocU
📱 Find us on SOCIAL MEDIA
Flux Academy's Instagram 👉 https://www.instagram.com/flux.academy/
Ran's Instagram 👉 https://www.instagram.com/ransegall/
Thanks for watching our video!
#Figma #WebDesign #FluxAcademy
Here in 2026? Check out our most up to date Figma crash course 👉 https://youtu.be/m9uXR4xt95w
-
Build alongside Ran by downloading the starter file here 👉 https://bit.ly/figma_tutorial
Need a new Figma account? - https://psxid.figma.com/s8z3306bhq0h
FREE TRAINING: 3 Steps to Build a Thriving Web Design Career 👉 https://bit.ly/3Tiua2G
See part 2 on how to build this site with Webflow: https://youtu.be/JnwATqjYohI
📽️ CHAPTERS
00:00 - Introduction
01:00 - Figma interface overview
04:30 - Page & grid setup
09:30 - Designing the hero & navigation
21:20 - Creating the background effect
25:00 - Building the content section
30:50 - Masking & blend modes
36:30 - Using Gradients
39:00 - Building the footer
40:40 - Designing a form
42:00 - Next steps
🎨 Learn the Art & Business of Web Design. Check out all our courses 👉 https://bit.ly/3jMxocU
📱 Find us on SOCIAL MEDIA
Flux Academy's Instagram 👉 https://www.instagram.com/flux.academy/
Ran's Instagram 👉 https://www.instagram.com/ransegall/
Thanks for watching our video!
#Figma #WebDesign #FluxAcademy