Nuthing automatic with this. Hell, you need to really go to work with tons of manual labor to get the so called auto layout working. Having said that I enjoyed the tutorial, probably the best on this topic around. Thanks for sharing.
What a journey from Sketch to InVision to Figma. I marvel daily at what the Figma team have done that is so far and beyond the other UI design tools. It really is the closest integration between design and development and auto-layout (Flexbox) is the key.
Wow! What a great explanation! Thank you very much! I was looking for a good material for a long time and finally I found your video! It was really a pleasure to watch it!
wow great tutorial!! you explain it in such a way that its easy to follow. im very new to autolayout and theres much to cover and youve done an amazing job. Thanks!
Glad to have found your channel! Pretty good info and very well explained 👏🏻👏🏻 I just feel like you forgot to show at the end how auto layout makes it super easy to add more menu links and buttons without any effort!
Nice tutorial Pablo, thanks. I am curious, when you design a web, what screen size do you design it for? what is the width of the frame? is it 1440 px, 1280px? and why you choose that size?
Hi, now i always use group ctrl+g for the group my object. if now I use only ctrl+a for auto layout on my all object, is this possible and good? Thanks!
Always use Frames to group what you want. To turn your selection into a frame, select everything you want to group > use shortcut "Ctrl+Alt+G". Use this shortcut because you wont need auto layout in every scenario so it is better to first turn it into a frame and later add auto layout if needed.
Autolayout allows you to create responsive designs that adapt to any screen/frame size. The surrounding elements also adapt to the inside, for example the width of a button changes to the amount of text it has inside of it, that is a huge time-saver. You can also use AL to replace elements, say one icon for another. Groups don't allow any of this, if you expand or reduce a group every element just gets distorted. You can only do equal spacing and that's about it. I recommend watching the Figma channel tutorial: Autolayout (8min) this tutorial is old and its slightly different than the actual Figma Ui, but it's very enlightening.
Nuthing automatic with this. Hell, you need to really go to work with tons of manual labor to get the so called auto layout working. Having said that I enjoyed the tutorial, probably the best on this topic around. Thanks for sharing.
What a journey from Sketch to InVision to Figma. I marvel daily at what the Figma team have done that is so far and beyond the other UI design tools. It really is the closest integration between design and development and auto-layout (Flexbox) is the key.
Thank you so much!!! I couldn't get my head around the auto-layout feature, but you made it soooo simple!!
Another clearly explained tutorial from Pablo. Thank you!
Wow! What a great explanation! Thank you very much! I was looking for a good material for a long time and finally I found your video! It was really a pleasure to watch it!
Thanks Pablo! I can finally wrap my head around auto layout - a big thanks to you!
very nicely and simply explained. I got the auto layout fully by practicing your 2 videos. thanks for such videos and a simple explanation.:-)
Thanks for share this with us, really helpful!
Immensely helpful! Huge thanks from Russia, Pablo!
Love your videos 😍 you make things so clear to understand. Way Better than the tutorials that figma make!!! 🤗 Thanks for making these.
This is so cool! Just like Flexbox! Thank you for the fun tutorials!
Thanks for sharing this tutorial, pretty easy to use!
Thanks for making this type of content Pablo! Learning a lot from the course.
Great stuff, as always.
Amazing ! I am new to Figma. I know about Sketch but Figma looks more intuitive imo. Thanks for the great course
wow great tutorial!! you explain it in such a way that its easy to follow. im very new to autolayout and theres much to cover and youve done an amazing job. Thanks!
Amazing video! love your spirit! super helpful! Thank you!
Thank you so much for putting together this course, I feel like I finally get it :)
You tutorial look good that i never seen befor. Thank
I love this Crash Course! Thank you Pablo, awesome work. Keep going! 💪
Thank you! Great tutorial. Wait so long for the next chapters until next year)))
Thanks, Pablo, this awesome! love your tutorials and videos so much!! Keep up the good work!
Awesome Pablo! You rock man!!! Thanks!
Thank you so much for all your videos, your channel is amazing and very helpful 🤩
Thank you, very useful! Hope that Figma will add a "max-width" to auto layout, it would be awesome 😍
That would be cool!
I have wondered that too. A min and max width and height would be dope!
This was so helpful, thank you so much for making this!!!
Glad to have found your channel! Pretty good info and very well explained 👏🏻👏🏻
I just feel like you forgot to show at the end how auto layout makes it super easy to add more menu links and buttons without any effort!
Cool tutorial! Thank you. What font were you using?
*Learned a lot in this video thanks*
Awesome video man! I’m Still half way through it, but had to stop already to drop this comment 👊🏻
Legend! Thanks, Tiago 👊
Nice Tutorial! You could have done the nav-buttons with variants.
Perfect, but could you show haw to made dropdown Menu ???
Starting this right now, thanks mate~
Hell yeah! Hoping you find it useful, Junio :)
@@SketchTogether the last 3 were amazing, so yup! Saved me plenty of time and Monday I’ll implement everything in actual work files 🙌
Pablo you da man! Great tutorial! :)
Nice tutorial Pablo, thanks. I am curious, when you design a web, what screen size do you design it for? what is the width of the frame? is it 1440 px, 1280px? and why you choose that size?
Nicely explained.. thank u very much
Pablo you rocks!
thanks for sharing your knowledage with us
thanks , this was very helpful
How about optimizing the same navigation for mobile resolutions?
Hello,
How you color inside the picture do you use any plugin or you make picture own your own
Thank you so much! :)
genial Pablito! gracias!
Super helpful!
man you are really great
Hi, now i always use group ctrl+g for the group my object. if now I use only ctrl+a for auto layout on my all object, is this possible and good? Thanks!
Always use Frames to group what you want. To turn your selection into a frame, select everything you want to group > use shortcut "Ctrl+Alt+G". Use this shortcut because you wont need auto layout in every scenario so it is better to first turn it into a frame and later add auto layout if needed.
Ok, now I know how to build navbar with auto layout but why should I do this instead of making just a group? What are the main advantages?
Autolayout allows you to create responsive designs that adapt to any screen/frame size. The surrounding elements also adapt to the inside, for example the width of a button changes to the amount of text it has inside of it, that is a huge time-saver. You can also use AL to replace elements, say one icon for another. Groups don't allow any of this, if you expand or reduce a group every element just gets distorted. You can only do equal spacing and that's about it. I recommend watching the Figma channel tutorial: Autolayout (8min) this tutorial is old and its slightly different than the actual Figma Ui, but it's very enlightening.
How to export the whole thing for it to work like in browser ?
Gracias amigo.
long story short: that's very cool!
how to auto-layout 8k width in figma?
Gracias!
thanks this helped me
thank you !
Yay!
Aww yissss!
Thank you!! :)
Helpful!!
thanks
the best
8px like for video!!!
Very well explained