Figma Tutorial: Auto Layout | Master Auto Layout in 15 Minutes
ฝัง
- เผยแพร่เมื่อ 17 พ.ค. 2024
- In this video, I'm going to show you how to design responsive elements using Figma Auto Layout. You will learn everything you need to know about Figma Auto Layout. We will go over the basics of Auto Layout all the way to creating advanced responsive layouts.
Try Figma for free:
bit.ly/3LiRVEF
📂 Get the Starter File from the link below:
bit.ly/3S8DJyk
0:00 Intro
0:39 What's Auto Layout?
01:14 Auto Layout Basics
04:18 Advanced Settings
08:13 Resizing Property
09:25 Create a Responsive Card
👉 Become a UI Designer with my UI Design & Figma Mastery course:
bit.ly/43v79vX
👉 Get my FREE UI/UX Design e-book here:
bit.ly/4aVc7pR
📸 Instagram: / uiux.arash
Who is Arash Ahadzadeh? Well, I'm a UI/UX designer and a university instructor with 7+ years of experience, and I teach people how to design great user interfaces and experiences. I've helped over 30,000 students become UI/UX designers from scratch worldwide.
Auto Layout got updated andi it now has more features than ever. Check out the following video to master its new features.
th-cam.com/video/jrQNtNm2-Qs/w-d-xo.html
Thanks for this giving this link at this video itself coz I was searching for the missing feature of "Packed,Space inbetween" in current updated figma. But It has been explaind in your updated video! Really Thanks a lot!
Its been 4 days im trying to understand auto layout. after watching many videos you are the most professional and clear. Thank you for the great information
I had been struggling to understand this concept despite watching over 10 tutorial videos. However, I am extremely grateful to have come across your teachings and have finally grasped this complex subject. thank you so much Arash keep going 🌸
Glad it helped! Thank you very much.
I watched 5 videos, but I couldn't get a hold on this "Auto layout". But now I am pretty confident. Thank you so much!
Glad it helped.
So far the best tutorial i have seen explaining auto layout and constraints. Smooth and easy to follow. Thanks 🙏
Glad it was helpful! Thanks.
Hi Arash. I really like the way you teach. Everything is on point, no unnecessary talking. It makes more sense when you teach something with real-world examples. Will definitely follow your other tuts.
Hi. Thanks a lot. Glad you liked my content.
Honestly, best auto-layout video ive seen. And i have watched dozens. Thank you.
Glad it was helpful!
I have never commented on a TH-cam video before but I wanted to express my gratitude for finally, a clear explanation of autolayout AND more advanced tricks. I am now at the point in my career where I understand the foundations of visual design and UX, but my designs were never "quite" there. I think having mastery of spacing is what was missing, and now with autolayout mastery, my designs are sooo much better! Many thanks.
Thank you so much for your comment. I'm glad you found the content helpful. Wish you all the best.
Amazing, everything is well explained and loads of knowledge packed into 15 mins video. Good work!
Thank you so much.
Thank you for this.
This has saved me time a lot of time. I love how you explained these entire concepts in a simple and succinct way in no time. Thank you
No problem. Glad it was helpful!
Thank you! Straight to the point, as always.
No problem.
Incremental explanation is an excellent idea. It makes sure that we get the concept without gaps. Thanks for such a well-organised and valuable tutorial.
No problem. Thank you.
came here to clarify single doubt and you surprised with multiple options. Great effort and the way of teaching is stunning sir
Your tutorial was the only one that fit! I had watched so many and was starting to give up when i decided to watch yours. It seems the other creators were using an older version of figma when they made their videos. Aithough, the 'packed' and 'space between' option is gone, i just typed in 'Auto' and it still worked. Thank you for taking the time to do this!
Thank you so much. Glad you liked it.
Regarding the Space Between option please check out the first comment.
The way you explained the mistakes that new designer might make while using these features helped a lot in understanding how things work. I watched 5 other videos before coming to this one, your explanation was the best!
Thank you so much. Glad it helped.
Your narration, patience in explaining makes understanding and learning so easy. Thanks for these easy to comprehend tutorials.
No problem. Thank you so much.
The most outstanding video I've seen regarding this subject. Thanks, Arash Jan.
Glad you liked it! No problem, Amir jan.
love your content mate!
Glad to hear that.
I am based in Poland too, where are you located in Poland? @@DesignWithArash
I’m very grateful!
All-in-one auto layout video!! Great work!! 👍
Thanks.
Thank you for this!! Very well explained. I've watch so many tutorials to try and figure out auto layout, after watching yours I finally get it :)
No problem. Glad it helped.
brilliant! I have watched your tutorial for a whole day and it really helps a lot!!
Glad to hear that.
The samples file to follow was the KEY to this. Having the exact files to learn from was awesome!
Glad it was helpful!
I don't know how to thank you for this amazing explanation. I spent days trying to learn auto layout on my own and watched like 5 tutorials and still couldn't understand somethings properly. Thanks to your video now I understand how easy it would've been if I watched this in the first place. I can't believe the time I wasted trying to make one frame fully responsive. Please keep on doing more videos. This helps a lot
No problem. Glad it helped.
Thanks for your great work Arash !
My pleasure!
This is one of the best TH-cam channel about ux design i have ever known! Thanks a lot for giving us too much valuable content, Arash.
Thank you very much. I'm pleased to hear that.
Hi Arash, I had done your UI course on Internshala and fallen in love with Figma! Thank you for these series of lessons on TH-cam🙏
Hi. No problem. Glad you found them useful.
Thank you for this, it was so helpful and direct as I wanted
No problem. Glad it helped.
Dear Arash,
I just wanted to drop by and leave a quick note of encouragement for you and your channel. I've been following your content for some time now, and I must say, you're doing an incredible job! Your videos are always informative, entertaining, and inspiring, and I truly appreciate the effort and dedication you put into each and every one of them.
please keep doing what you're doing, and never forget that your passion and creativity are truly appreciated.
Thank you for all that you do, and I'm excited to see what amazing things you'll achieve in the future!
😍
Dear Vahid,
Thank you so much for your kind comment. I'm glad you liked my content. Stay tuned for more design content.
Amazing tutorial❤
Thank you! 😊
you have a genuine kindness in your soul and are a very bright person that wants to share what they know. You also do so in a highly intelligent way by distilling things down to their basic essentials. Well done, Sir! Great video.
Thank you very much. That's very nice of you. Always happy to help.
Thanks for this! ✨
You're so welcome!
Man this tutorial is marvelous. I'm quite new to the Figma world and this open my mind to the possibilities that I have with this software. Keep going with the good work, thanks a lot from Brazil!!!
No problem. Glad it helped.
Informative tut, crisply delivered. Thanks.
No problem. Thank you.
Great tutorial and really helpful examples of how to use the different features. Thank you!!
Glad it helped. Thank you so much.
Nicely explained 🎉Thanks Sir
Your content is so good please keep making more ! 🎉
Thanks a lot. I’m pleased to hear that. Sure. 🙏🏻😊
You are really a great tutor. Thanks cause i just had a good and better understanding of Auto layout.
Thank you very much.
I feel like I finally get it. Thank you!
Glad to hear that. No problem.
Ok. You're THE best. Thank you very much for your contribution to the design community.
Thank you so much.
this video was really awesome! I had seen a lot of videos before this but just this one worked for me. really appreciate Arash!
No problem. Glad it helped!
Hi Arash! Thank you so much for all your videos! They have been extremely useful to me as a new designer. All the best and keep up your great work!
Hi. My pleasure.
Thank you Arash! it was very helpful,
No problem.
Thank you so much Arash, that was useful and easily to understand.
No problem.
Dude you are so helpful. I've been struggling with this for ages and no amount of "just learn autolayout" from reddit users was helping.
Glad I could help!
Been looking at soo many videos but didnt understand. Thanks yours is the best
Glad it helped! No problem.
Best tutorial for auto layout. Thank you!
Thank you.
Thanks Arash! Your explanations are very easy to follow.
Thanks.
Man you are a life savor i was gonna quit learning responsive designing cuz of this but damn you know how to teach you just got a new subscriber pls keep posting
Glad it helped. Welcome to the channel.
brother, you are great.
Thank you so much !! It's very helpful tutorial
You are welcome!
Amazing explanation!! Really grateful u made this video
Glad you liked it!!
you basically saved me with this tutorial...had a hard time grasping the concept behind this...thanks very much
Glad it helped.
Super helpful! It made me see that autolayout is very easy to use.
Glad it helped.
Best autolayout tutorial evaaahhh ...
Thanks.
a complicated topic, in simple words; shows your profession, Many thanks 🙏
No problem. Glad you found it helpful.
awesome! thanks a million arash
No problem.
Great video! Easy to follow explanation.
No problem.
You made renissans to my UX/UI learning!
Thank you.
You rock. Plain and simple.
Thank you so much.
Thank you, Arash! it's really helpful
No problem. Glad it helped.
Very clear and precise information. Really liked it. Thank you so much :)
No problem. Glad you liked it.
This was so helpful. Thank you!
No problem.
You are really good at this job😃 Thank you for this beautiful tutorial
Thank you so much.
Nice work, very clear and useful. Thank you
Thanks.
Great video as always! cheers to you mate
Thanks a lot.
Super helpful! Thanks a ton! 😊
No problem. 😊
Many thanks for making this video. Well explained and to the point :)
No problem.
Thanks for your content! It's priceless!
My pleasure! Thank you.
Awesome clear and concise explanation, thanks Arash :)😍
Glad you liked it!
Hi Arash , just wanna say that your tutorials are amazing and well explained
Hi Thomas,
Thank you so much. It's very nice of you.
Arash. thanks for your tutorial and content sharing. your video helps a lot. I have subscribed. May I ask a question, if I need to design a mobile app and this app will launch on the Google Store and Apple Store, should I have to design two versions based on the different UI design resources provided by Google and Apple? because I see these two platforms have different UI standards. Thanks again. ❤
I love all your content. Thankyou very much, i hope you make another tips for figma too from beginner to master. Its very helpful. Thanks a lots! 🤩🥰👍
Thank you so much. I'm so happy to hear that. More to come.
Arash thank you so much. I've been on this for days
No problem. Glad it helped.
Thank you so much. I just watched your video now and its very helpful because I just finished designing a website and was imagining how to design the mobile
Glad it was helpful!
No music, straightforward, amazing.
Thanks.
Thanks a lot Arash..very well explained...Cheers
No problem.
Thank you very much for your valuable content 🥰. I learned a lot of things from you.
No problem. Glad to hear that.
Thank you ! I love this lecture
You're most welcome! Glad to hear that.
Brilliant! Thanks!
Glad you liked it!
This really cleared my concepts. Thank You Arash.
Glad to hear that. No problem.
Thanks Arash, I get autolayout better because of this clear simple tutorial
No problem. Glad it helped.
Awesome video, thanks!
Glad you liked it!
Great tutorial. Thank you.
Glad it was helpful!
Thank you Mr. Arash.
No problem.
Finally, I found some peace. Now that I can use auto-lays and constraints with better understanding, Thanks a bunch.
No problem.
That was amazing!
Thank you.
Thank you Arash!
My pleasure!
Wow you made it so easy 😊😊😊thank you
My pleasure 😊
The best auto layout video ever
Thank you sooo much arash
No problem.
you are my insparation,i really liked your video,learn easily
Thank you.
Damn, Finally a good video about auto layout, I was searching for hours and all of they explain so fast and the videos has tons of cuts, but this one was perfect, I finally got it how to use this tool in Figma, THANKS :DDDDDDDD
No problem. Glad it helped.
Perfect tutor for FIGMA..!
Thank you.
Thank you So much Sharing explaining auto layout and constraints. Today i learn figma amazing feature
No problem.
Thank you for this ❤❤
No problem.
This guy is so good
Thank you so much.
Super helpful video. Thanks man. ✌️
No problem.
Thanks bro it's very helpful 👍
No problem. Glad it helped.
thank you Arash. This helped me a lottttt
No problem. Glad it helped.
THANK YOU FOR YOUR HELP!
No problem.