Yo! If you wanna see the end result, you can duplicate the resource file here: www.figma.com/community/file/915706020494734586 Also, install the Blush plugin: www.figma.com/community/plugin/838959511417581040/B
This was simply a great tutorial. Easy to follow and I didn't feel like any of the steps were missing. I was able to achieve the same results as you. THANK YOU! You have a new subscriber now and I'm going to try the UI Components one now.
Thank you so much for your tutorials. You are such a great instructor. I'm completely new to figma and I've been able to learn so much very quickly thanks to your templates and tutorials.
When I make the three columns as an AutoLayout and Im trying to change the title position ( 7:16 ) nothing happens... If I don't make then as an AutoLayout it's working, I tried multiple times to do the same thing and sometimes the two columns where responding to the changes and one was not, but again if i select all three columns and apply AutoLayout, its not working. , anyone has the same problem?
When adding more texts it expands upward. Is there any possible way to make it downward while extending the size of the frame eventually and keeping the texts at the left bottom corner of the frame? Thanks.
Hi Pablo, thanks for this tutorial. I am facing one problem though, ... When I resize the content inside the columns to fill the container on both axis, it loses becomes a normal grid, not a masonry Grid that was before setting those scaling to fill the container on both axis. I hope you understand what I'm trying to say.
@@stopeCZ When you follow the guidelines in the article, you end up with a component the can scale and keep aspect ratio, but the component doesn't work in a vertical list with auto layout, the components are not updating height, and they end up overlapping each other. So back to manually fitting stuff for different screensizes...
@@waveandersson I've duplicated the original file and the instances of different aspect ratio master components resize and scale fine in my auto layout frames. You might be focusing and resizing a wrong layer in the instance.
Yes, I may have done something wrong, but I do not think it's that easy. I made the scaling work fine but not the vertical sorting ... were you able to get to cards expanding properly and push the other cards to fit as they should?
Powerful auto-layer! great episode, one question, i see you use plugins for made responsive the image, but is possible copy image direct to the figma board and make it responsive? thank you.
Great video! However I still have one question: On your first example the cards had different heights while on the same row, but when you select fill the container property for all your content it resizes equally all the elements. How did you make some cards with different size while keeping everything filling the container?
After he applied the fill container property to the card component, he manually changed the height on some of them. You can change the size of an instance without affecting the original component. Minute 8:26 aprox. I hope that makes sense.
Yo! If you wanna see the end result, you can duplicate the resource file here:
www.figma.com/community/file/915706020494734586
Also, install the Blush plugin:
www.figma.com/community/plugin/838959511417581040/B
You are such a good teacher. The way you teach...bomb!
How
Cool
is
That.
How
Cool
is
That.
How
Cool
is
That.
Seriously, no idea what I would have done without your tutorial! Thank you!
I love how it is packed with so many nuggets of best practices. Great video!
This was simply a great tutorial. Easy to follow and I didn't feel like any of the steps were missing. I was able to achieve the same results as you. THANK YOU! You have a new subscriber now and I'm going to try the UI Components one now.
Smashing the like button on all your tuts man. Great stuff, keep'em coming!
Thank you for the course!! I also used the Figma file and it was the most useful tool for learning autolayout. Thank you!!!!
Please, don't stop! It's amazing what you do
Thank you so much for your tutorials. You are such a great instructor. I'm completely new to figma and I've been able to learn so much very quickly thanks to your templates and tutorials.
When I make the three columns as an AutoLayout and Im trying to change the title position ( 7:16 ) nothing happens... If I don't make then as an AutoLayout it's working, I tried multiple times to do the same thing and sometimes the two columns where responding to the changes and one was not, but again if i select all three columns and apply AutoLayout, its not working. , anyone has the same problem?
Super cool video. I love the way u teach.
Awesome explanation! Thanks!
The projects really fun to do. Thanks Pablo
Another great video Pablo!
is there a way to force the images to stack in one column when resized to a mobile screen ?
This is amazing
I have tried this
Thank you so much
Clear and Concise, thanks
you explained it so amazingly clear and simple . thank you .
Excellent, clear lessons! Thank you so much!
your teaching skills are amazing! thanks for these !! : )
Great teacher, thank you!
Amazing content
This was such a clear explanation Pablo, thank you!
Awesome, thanks! So helpful.
When adding more texts it expands upward. Is there any possible way to make it downward while extending the size of the frame eventually and keeping the texts at the left bottom corner of the frame? Thanks.
What can I do if I don't use a plugin? When I paste an image, do I have to turn it into a frame? Thank you!
Hi Pablo, thanks for this tutorial. I am facing one problem though, ... When I resize the content inside the columns to fill the container on both axis, it loses becomes a normal grid, not a masonry Grid that was before setting those scaling to fill the container on both axis.
I hope you understand what I'm trying to say.
I was wondering if there is a way to keep the aspect ratio intact on the cards while resizing grid
medium.com/@solo_cube/figma-auto-layout-objects-on-top-of-the-fixed-aspect-ratio-elements-d709aa7f496c
@@stopeCZ thanks, i Will look into that article
@@stopeCZ When you follow the guidelines in the article, you end up with a component the can scale and keep aspect ratio, but the component doesn't work in a vertical list with auto layout, the components are not updating height, and they end up overlapping each other. So back to manually fitting stuff for different screensizes...
@@waveandersson I've duplicated the original file and the instances of different aspect ratio master components resize and scale fine in my auto layout frames. You might be focusing and resizing a wrong layer in the instance.
Yes, I may have done something wrong, but I do not think it's that easy. I made the scaling work fine but not the vertical sorting ... were you able to get to cards expanding properly and push the other cards to fit as they should?
please create a webpage in Figma using auto layout feature.
Are you able to keep the image proportions as you scale? I cannot seem to find this anywhere.
NO, I'm facingg the same problem
bro please make videos on microinteraction
Thank you so much
Powerful auto-layer! great episode, one question, i see you use plugins for made responsive the image, but is possible copy image direct to the figma board and make it responsive? thank you.
the same principles apply to all the elements in Figma (images, texts etc)
@@oss4maz thank you, I will try this one without the unsplash plug-in.
Great video! However I still have one question: On your first example the cards had different heights while on the same row, but when you select fill the container property for all your content it resizes equally all the elements. How did you make some cards with different size while keeping everything filling the container?
After he applied the fill container property to the card component, he manually changed the height on some of them. You can change the size of an instance without affecting the original component. Minute 8:26 aprox. I hope that makes sense.
n working
Thank you so much!
Thankyou so much
Most welcome 😊
the best
the best