Figma Tutorial for Beginners (Part 1): Homepage Design | Creative Agency Website
7.8万 次观看 · 2025-10-06
UI 设计
Welcome to Week 1 of the Creative Agency Website Design Series!
In this video, we’ll design the Homepage, covering layout planning, hero section, typography, and call-to-action setup.
🎥 Watch Part 2 here: https://youtu.be/pu30XiRaFfc
🎥 Watch Part 3 here: https://youtu.be/9UmSq9aJd4g
🎥 Watch Part 4 here: https://youtu.be/ACAb4k3Hsyc
🎥 Watch Part 5 here: https://youtu.be/Fwb9Sh3uJ9Q
🎥 Watch Part 6 here: https://youtu.be/2tJl2n6XH8Y
🎥 Watch Part 7 here: https://youtu.be/g8_HD0tsUZM
🎥 How to Prototype: https://youtu.be/iW9RmDD1yDs
For anyone who wants the finished Figma file without building it from scratch, you can grab it here → https://emulodavid.gumroad.com/l/creativeagencyfigma
⏱️ Timestamps
00:00 – Intro
01:50 – Workspace Setup (Color Styles)
05:12 – Setting Up the Layout Grid
06:48 – Hero Section
15:30 – Buttons (CTA)
25:50 – About Us Section
34:30 – Logos Section
55:40 – Benefits Section
01:18:08 – Nav Bar
01:22:30 – Outro
In this video, we’ll design the Homepage, covering layout planning, hero section, typography, and call-to-action setup.
🎥 Watch Part 2 here: https://youtu.be/pu30XiRaFfc
🎥 Watch Part 3 here: https://youtu.be/9UmSq9aJd4g
🎥 Watch Part 4 here: https://youtu.be/ACAb4k3Hsyc
🎥 Watch Part 5 here: https://youtu.be/Fwb9Sh3uJ9Q
🎥 Watch Part 6 here: https://youtu.be/2tJl2n6XH8Y
🎥 Watch Part 7 here: https://youtu.be/g8_HD0tsUZM
🎥 How to Prototype: https://youtu.be/iW9RmDD1yDs
For anyone who wants the finished Figma file without building it from scratch, you can grab it here → https://emulodavid.gumroad.com/l/creativeagencyfigma
⏱️ Timestamps
00:00 – Intro
01:50 – Workspace Setup (Color Styles)
05:12 – Setting Up the Layout Grid
06:48 – Hero Section
15:30 – Buttons (CTA)
25:50 – About Us Section
34:30 – Logos Section
55:40 – Benefits Section
01:18:08 – Nav Bar
01:22:30 – Outro