Design your first website in Figma (crash course)
ฝัง
- เผยแพร่เมื่อ 27 ธ.ค. 2024
- In this tutorial, you will learn all of the basic tools you need in order to start using Figma with confidence.
Download starter file to follow along 👉 www.figma.com/...
Want to go deeper and really master Figma? Enroll in ‘Figma for Web Designers’ at Flux Academy 👉 bit.ly/3B2CON6
CHAPTERS
0:19 Figma layout
3:37 Overview of starter file and resources
6:48 Frames
8:55 Styles
13:50 Buttons
25:48 Grid
28:27 Navigation
38:56 Hero
50:46 Section - We work with all dog breeds
1:01:37 Section - How we can help
1:19:55 Section - About us
1:30:37 Section - Reviews
1:41:51 Section - On the blog
1:49:06 Section - Instagram feed
1:53:01 Footer
📱 Find us on SOCIAL MEDIA
Chantelle’s Instagram 👉 / capriandrome
Flux Academy's Instagram 👉 / flux.academy
Flux Academy's TikTok 👉 / fluxacademy
Thank you so much for these detailed tutorials! Super helpful for beginners like me 💕💕
Happy to hear it's useful!
Awesome! I am very pleased. I want more video like this but about unique ui design.
Amazing tutorial thank you! The way she explains is so understandable!
28:02 it is actually SHIFT G. CTRL G is to group items.
Thanks. I thought I was losing my mind. Again.
I see you are making a design system based on the design you already have. What if we are designing from scratch? I have seen many design system video where they are creating various component in system is that really necessary to create everything in design system?
You did spacing so well. :)
I was thinking about this content today...
Glad we hit the mark!
Thank you for this!
How about designing another website but now with the in-depth use of auto layouts?
Thanks for the idea! noted!
Thanks Dear for tutorials, but couldn't see the color palette in the starter file download. Could you pls upload them
I eventually figured it out. I created 7 rectangles and filled them up with the HEXCODE. Thank you
I LOVE YOU !!
Great introduction to Figma, thanks! I was wondering if there is a way to set a horizontal grid, the same way you set a vertical grid...or do you just eyeball the frame heights and text positions? What is the secret sauce? :-)
Yep! you can choose whether you'd like to add columns or rows when adding a layout grid
Am new to Ui/Ux I want to ask after designing this website how to do you put transitions or animations on your website
Easy to do in Framer or Webflow
@ thank you
Colors are not metioned in Figma File. Its my Figma bug😶. Just asking. Its not a problem🤭
Gracias!!!
NICE!
Where are the color swatches?
I had same issue. Create 7 rectangles and filled them up with the HEXCODE, you'll notice the hexcode for each color while the instructor is labeling them
@@kevinkay4886 That's exactly what I had to do. Not a huge problem, but very frustrating searching for something that didn't exist.
@@scottcitron Ok that’s kool! I’m actually new to Figma, managed to find my way, using my Wordpress knowledge. Cheers
Thanks
yay!
U r cute 🥰
Dog on hero screen looks like he ask for help from bad owners not dog for training )