Design like Apple (Figma Tutorial)
HTML-код
- Опубликовано: 30 июн 2024
- This Figma tutorial is perfect for beginner! In this tutorial, you will learn how to use Figma by recreating Apple's AirPods Max webpage. But the lessons taught in this Figma Tutorial will also help you create and edit a variety of design assets, including wireframes, websites, apps and even prototypes.
My name is Andres Gonzalez, and I'll be guiding you through Figma's interface and teaching you everything you need to know to get started.
👇🏼 Create your Figma Account 👇🏼
psxid.figma.com/2w07we2t2h0z
👇🏼 Download the free Figma File here 👇🏼
andresthedesigner.ck.page/238...
👇🏼 Sign up to Tella (our sponsor) 👇🏼
www.tella.tv/?referer=andres
Chapters
00:00 - Figma basics
02:01 - Autolayout
04:20 - Tella (Sponsor)
04:54 - Constraints and responsive design
06:08 - Components
07:18 - Prototypes
09:02 - AirPods Max webpage
09:34 - Secret Bonus Step
____________________________________________________________________
Say what's up!! And connect with me!
Instagram: / andresthedesigner
LinkedIn: / andresthedesigner
____________________________________________________________________
My Favorite Tools
Figma (best design tool ever)
psxid.figma.com/2w07we2t2h0z
Webflow (favorite website development tool)
webflow.grsm.io/free-portfoli...
Hello Bonsai (Best Freelancer Software!!)
www.hellobonsai.com/?fp_ref=a...
Framer (Free Portfolio Websites!)
www.framer.com/templates/cate...
Notion (The Best AI-Powered Productivity Tool EVER)
affiliate.notion.so/o5hocp5my...
____________________________________________________________________
UX Resources:
Google Certified UX Design Course (best value $$$)
imp.i384100.net/1rP6R6
![mgk - Sun to Me (Zach Bryan Cover) [Live from Cheshire Cottage]](http://i.ytimg.com/vi/_ZnbTEs4O6U/mqdefault.jpg)
![Megan Thee Stallion - Otaku Hot Girl [Official Audio]](http://i.ytimg.com/vi/USxIYOaIpig/mqdefault.jpg)
*👇🏼 Download the free Figma File here 👇🏼*
andresthedesigner.ck.page/238c47da3b
This is an amazing tutorial! I learned more about prototyping which I'm not the best at. Also, love the Proverbs 3:1-7 verse in the end.
Subtle blessings for everyone who's watched till the end. 🤫 🤣
I legit used Figma for 2 years for photos and a makeshift CAD website before finding out it was for websites. I was already knowledgeable in web design and web building but this just exploded my head that there were animations and prototyping elements all along that I didn't know about! Thanks man!
Truly amazing video Andres. I recently signed up for your UX Design course and I’m looking forward to it. In the meantime I’m learning Figma and checking out some good portfolios like you pointed out in your UX Guide!!!
So helpful ❤
thanks Andres! this tutorial was on fire! So succinct and easy to follow.
🔥 Firrreeeee! haha Thanks for the kind comment 🙏🏼
Wow! This is indeed a UX Design well done job. it was a fast pace learning but very insightful
Glad you found it insightful 🙏🏼
Amazing video, thank you so much for always sharing your knowledge
No problem bro! Thank you for always supporting.
Man! You’re doing great with your craft, as well as making youtube videos. I’m so blessed to have seen your channel way back 6months ago, and here I am again watching your content. Someday I will apply to your team as a Junior and make you proud. Cheers!
Wow! Thanks for supporting Kenjay. I appreciate the love 🙏🏼
Great video Andres!
Thanks Arnau! 🙏🏼 Appreciate the love.
insane ❤🔥
🙏🏼 thank you!
Magical Voice and it's an outstanding video for Advanced Learners ✨️
Hahaha thanks 😅
that was veryyyyyyyyyyy great
Glad you enjoyed it! 👏
goated like kobe
Woow! I see some CSS stuffs going on in here... very nice😊❤
Thank you! 🙏🏼
excuse me, i want to ask about how to install more font on macbook, my mac is old version anyway😢?
I’m switching from Adobe XD. Question: For the prototype example you gave can you make those small colour buttons into master variants of their own. Then once you set where the master should link to in the prototypes it also sends the children there. Estimating the step for having to wire up every button on all 5 colour panels. You can just do it once for the master variant. This was possible in XD, but curious about Figma
Yup! Exactly. You can set prototype interaction to the master variant and they'll transfer over to child components. However, if a child component has been modified, it might not update!
This is great but anyway you can kinda slow this down for an actual beginner?
I appreciate the feedback! Will probably slow it down next time. On this tutorial, pause the video & repeat to make it easier for you 🙏🏼
You are right but, slow is kinda boring for this type of educational content, I love what he is doing and how he is doing. Probably you wouldn't watch this video if it was slow. 🐢
@@MrTopu-hi3bk Interesting. Thanks for sharing your feedback too! hahaha I typically like faster tutorials too.
Comment: "Can we make this logo bigger?" 😄😂
😂😂😂
i didnt got the free figma file in the mail.
i have even checked all the sections of my mail.
can you please check the issue and resend it to me
The make a logo bigger, i don't understand why everyone asks that lol
hahaha, right!? 🤣