KILLER Auto Layout Tutorial in FIGMA

Sdílet
Vložit
  • čas přidán 7. 11. 2022
  • Figma file: www.figma.com/community/file/...
    Instagram → / mds
    Twitter → / mds
    Dribbble → dribbble.com/mds

Komentáře • 148

  • @mdsnotavailable
    @mdsnotavailable  Před rokem +6

    what do you want to see next?

    • @arbanai2735
      @arbanai2735 Před rokem +8

      A killer components tutorial :)

    • @LuigiChelli
      @LuigiChelli Před rokem +1

      Tokens!! possibly Tokens Studio (ex Figma tokens) plugin rundown and examples.

    • @user-bz8xe2vp3p
      @user-bz8xe2vp3p Před rokem +2

      it will be cool to see how to create some elements using components, autolayout, variants and prototype them

    • @shadowhere_
      @shadowhere_ Před rokem

      Basic ux research video please.

    • @owaisfazil1464
      @owaisfazil1464 Před rokem

      Components! Also I firkin love your shitty song

  • @rogietheking
    @rogietheking Před rokem +32

    Not only is this an amazing tutorial, but your production value is off the hook, Matt. GO GO GO!

  • @MelindaMatturro
    @MelindaMatturro Před rokem +31

    your water bottle metaphor is so simple yet so genius. love your editing style! THANK YOU for making auto-layout easier to wrap my head around!

  • @giftedgeek
    @giftedgeek Před rokem +6

    The Visuals are just amazing, and the Sound design for typing and expanding just awesome!

  • @sahilbhat7328
    @sahilbhat7328 Před rokem +3

    Had seen many videos related to Auto Layout before this but this is undoubtedly the most understandable and fun to watch. Exceptional editing.

  • @CarlosAndresVelasquez
    @CarlosAndresVelasquez Před rokem +3

    This is by far one of the best tutorials Ive seen with autolayout. Adding to my “always be learning” playlist.

  • @underscoreroa
    @underscoreroa Před 8 měsíci +1

    one of the best AL, hug/fill explanations I've seen yet. And the tip about holding off on AL during ideation is brilliant.

  • @RPBR84
    @RPBR84 Před 11 měsíci

    Omg been struggling for three days with auto layout this is the only tutorial I’ve seen that makes any sense!!! Thank you

  • @lexib9516
    @lexib9516 Před rokem +1

    Bravo sir!!!! An explanation that virtually covers all of my headaches with auto-layout. Much of my headaches were due to adding auto-layout at the beginning vs at the end once I have the layout designed. Thanks so much for putting this together & taking the time to share it with us. Nicely done.

  • @Faguoyo
    @Faguoyo Před rokem

    Fourth tutorial I've seen about auto layout today and from far the best. Many thanks!

  • @msummer
    @msummer Před rokem

    This is amazing Matt, thank you! You’ve been killing it with the CZcams content, super excited to see what else you’ll be sharing!

  • @TheRiddleDungeon
    @TheRiddleDungeon Před 11 měsíci

    Loved it just how you simplified the layout stuffs straightway! I've struggling with auto layout stuff and stressed out as hell.. I was not finding any motivation to break things out. Thank you for your time :)

  • @JaneDimeski
    @JaneDimeski Před rokem +2

    Wow, the best explanation of auto-layout I've seen 'til date. Your CZcams content is amazing Matt, lots of respect for you and what you do. Excited for future content along this line. Keep it up!

  • @ThingaNguyen-du5fg
    @ThingaNguyen-du5fg Před rokem

    I have seen many auto-layout youtube video BUT this one is by far the best one! man - you nailed it! keep on going! and ofc, thx for sharing 😎

  • @nebookyn
    @nebookyn Před rokem +10

    Hey Matt, the effort you put into this video is incredible. Keep up the good work man!

  • @pm2228
    @pm2228 Před rokem

    Wow! This tutorial is amazing. The way your structure and deliver the content makes it so fun to watch! you earned a suscriber

  • @alecsandrugrigoriu5809
    @alecsandrugrigoriu5809 Před rokem +1

    Really love this new style of editing you applied on the video. Awesome stuff!

  • @krispy.26
    @krispy.26 Před 9 měsíci

    I would like to thank you for this is the ONLY autolayout tutorial that actually stuck with me. I really like the horror elements >:)) keep em comin

  • @sanjeevtanguturu4531
    @sanjeevtanguturu4531 Před 3 měsíci

    Thank you so much! I really appreciate the way you teach. It really helped me a lot, especially the water bottle example.

  • @codemathics
    @codemathics Před rokem

    Everything creative = MDS. So 🐐ed!

  • @danielruiz2471
    @danielruiz2471 Před rokem

    This is really nice work Matt!

  • @Cor-mac
    @Cor-mac Před rokem

    Simply awesome tutorial! The quality is out of this world, you’re the 🐐.

  • @user-fx6lq4gt3d
    @user-fx6lq4gt3d Před rokem

    Thank you so much!!! I can't believe I figured out how to use it after a YEAR of working in Figma.

  • @michellewren_
    @michellewren_ Před rokem

    this is such a well done tutorial - the content, the editing, the myers theme... so so good! thank you!

  • @pauladeka1593
    @pauladeka1593 Před 7 měsíci

    Now this is how I want to be taught... Really straightforward in a fun way, thanks man.

  • @JayCarver
    @JayCarver Před rokem

    Man you had me cracking up and learning at the same time lol...dope video and way to keep people engaged all the way through!

  • @NadjibIxe
    @NadjibIxe Před rokem

    Excellent !!! the best autolayout tutorial☠🎸

  • @ellivizcaino4307
    @ellivizcaino4307 Před 6 měsíci

    Not only did this video help me understand auto layout a bit better, but it was also hilarious and entertaining! A welcomed surprise!

  • @MilanB
    @MilanB Před rokem

    A man who knows how to explain. Fantastic video focusing on what we actually need to understand. Thanks Matt.

  • @riturajborah6169
    @riturajborah6169 Před měsícem

    Thank You So much for this Video. You have explained it so well.
    Keep up the hustle and your CZcams channel will grow for sure ❤️

  • @Mythril
    @Mythril Před rokem

    this is the best auto-layout tutorial i've found!

  • @nahidmodan4824
    @nahidmodan4824 Před rokem

    this is exactly what I needed I actually had a hard time with using the fixed, fill and hug options. Now I will always remember the water bottle analogy , thank for helping me this issue.

  • @larissasaad7378
    @larissasaad7378 Před rokem

    Beautifully edited video, fun and informative. Well done MDS!

  • @shadowhere_
    @shadowhere_ Před rokem

    Just amazing, learned a lot from this video, Keep giving us more value like this one.

  • @_thesoulsjourney
    @_thesoulsjourney Před rokem

    Wicked tutorial. Genius bottle analogy!

  • @ArifKhan-uf3nm
    @ArifKhan-uf3nm Před 9 měsíci

    This is only tutorial in MDS Style loved the work and inspired 🌟

  • @mohammadjavadmozaffari1686

    So simple and useful grate job that was the easiest way to learn autolayout thing ❤

  • @U7traman
    @U7traman Před rokem

    Never had so much fun watching a Figma tutorial. Amazing.

  • @muhammadalikhan7096
    @muhammadalikhan7096 Před rokem

    That's how you entertain and educate your audience. dude you just made my life way simpler. . Btw that's how you gain a subscriber. thank you so much

  • @fulldeploy
    @fulldeploy Před 9 měsíci

    Brother this is by far the BEST auto layout tutorial I’ve watched. Sub’d!
    (Although I disagree with the AL disclaimer, this is a great tutorial).

  • @alfredosmith6107
    @alfredosmith6107 Před rokem

    You’re definitely underrated
    👍🏾🚇🔔

  • @mateusvidal3187
    @mateusvidal3187 Před rokem +1

    It was amazing! The video editor deserves congrats for this one!

  • @arzach_0x
    @arzach_0x Před rokem

    Awesome video!!! So helpful

  • @hoangphat5979
    @hoangphat5979 Před rokem

    OMG the struggle was REAL, i was stuck with this typing with autolayout but thank you for point out " Fixed for parent and Fill for child ". It's working

  • @ochjich
    @ochjich Před rokem +7

    wow its crazy but also balanced not overdone, amazing tutorial!

  • @aaronruiz816
    @aaronruiz816 Před rokem

    This edit is so awesome!

  • @underscoreroa
    @underscoreroa Před 8 měsíci

    Also, when I first started with Figma wish I'd learned that starting small with auto layout groups is the best way to go. Would have saved me so much stress.

  • @uxtools
    @uxtools Před rokem

    Can tell you had fun with this one. Really well done/terrifying/useful 💪

  • @Kram3r
    @Kram3r Před rokem

    Brilliantly done and very scarily explained! I’m gonna use auto layout with caution!
    Great video and very well explained!

  • @arff_f
    @arff_f Před 3 měsíci

    I don’t know y this one isn’t getting million views. Even the figma yt itself can’t teach auto layout effectively like this

  • @raviblr8227
    @raviblr8227 Před 11 měsíci

    Excellent.. now I got some confidence and knowledge about on Auto layout.. Thanks for sharing this valuable topic.. If possible do one more video about autolayout complete procedure and with tips and logic. Thanks.

  • @GOKU019
    @GOKU019 Před rokem

    awesome video... sound effects ❤❤

  • @user-oh6fs5ti2y
    @user-oh6fs5ti2y Před rokem

    fantastic work and well explained video!

  • @lilyshevchenko7048
    @lilyshevchenko7048 Před měsícem

    The production value of this video is insane! Everytime I'll hit SHIFT-A I'll always have a mental metal riff 😂Bravo!

  • @marlonmarcello
    @marlonmarcello Před rokem

    Instant fan of your channel!

  • @izikprinx
    @izikprinx Před rokem

    Hey man, thank you so much for this explanation, I was wondering if you can make a video about rapid prototyping using figma. Thanks x

  • @ahmedesam9922
    @ahmedesam9922 Před 11 měsíci

    Screw CZcams algorithm, I watched every single autolayout tutorial on CZcams trying to understand the concept and this is by far the most interesting of them all !!

  • @MarcusBoyDS
    @MarcusBoyDS Před rokem

    For me the real killer insight was the fill/fixed water bottle concept, the perfect storytelling to teach auto-layout

  • @pixiedev
    @pixiedev Před rokem

    Amazing men also your editor have my respect.

  • @elysiumcore
    @elysiumcore Před 10 měsíci

    Wicked tutorial tutorial 🔥

  • @lavenderweasley
    @lavenderweasley Před 11 měsíci

    The most memorable tutorial ever!

  • @Shatz
    @Shatz Před 10 měsíci

    Amazing video, thank you very much!

  • @kmdesignsolutions
    @kmdesignsolutions Před rokem

    Perfect tutorial✌️

  • @WB-zr7pq
    @WB-zr7pq Před rokem

    Been trying to explain this to others, and this is the funnest way I have seen yet.

  • @lonhetrick
    @lonhetrick Před rokem

    Excellent! Way more entertaining than the Auto-Layout training I gave our UX team last week.

  • @drdennsemann
    @drdennsemann Před rokem

    Learning from the best!

  • @SheisaCreative
    @SheisaCreative Před rokem

    Thank you for the awesome tutorial. 😊😊

  • @GabriellaBajkai
    @GabriellaBajkai Před měsícem

    The most entertaining tutorial I've ever watched

  • @M4rt1nX
    @M4rt1nX Před rokem

    Thanks a lot. I finally understood.

  • @arbanai2735
    @arbanai2735 Před rokem

    That's it! Finally I can understand auto layout.

  • @Adlip_Kun
    @Adlip_Kun Před 19 dny

    Wow! Thank you so much. This is a killer video.

  • @clementine5672
    @clementine5672 Před rokem

    Killer content man

  • @Elizabeth-mf3dn
    @Elizabeth-mf3dn Před rokem

    BLESS you saved me such a headache

  • @remywu7706
    @remywu7706 Před rokem

    Thanks MDS

  • @martinpenkov2492
    @martinpenkov2492 Před 8 měsíci

    Hello, I want to ask in which cases we don't need to use auto layout & thumbs up for this video it's really helpfull.

  • @danielmota6322
    @danielmota6322 Před rokem

    On the very second example, where you are doing absolute positioning, and adding the effect on the text box, I can 'see' (if I click the layer, when it highlights) through the grid that it is working--in a sense that as Long as I type, the effect follows. But, I can't see the effect in itself. How do I fix that?

  • @rizkyakbarmubarok2662
    @rizkyakbarmubarok2662 Před 10 měsíci

    thanks for your video, very helpfull

  • @juansandia5060
    @juansandia5060 Před rokem

    Amazing!

  • @madhoundes
    @madhoundes Před rokem

    this tutorial like a gem

  • @MartinAlejandro
    @MartinAlejandro Před rokem

    You're the best.

  • @maha2531
    @maha2531 Před 9 měsíci

    really enjoyed Watching this HORROR auto layout 😂

  • @brandoxide6392
    @brandoxide6392 Před 10 měsíci

    I loved this video as you have spoken the truth.

  • @musikundspiel1008
    @musikundspiel1008 Před rokem

    wow, thank you!

  • @lanaveldanova1397
    @lanaveldanova1397 Před 3 měsíci +1

    Amazing

  • @nikitagoncharuk2234
    @nikitagoncharuk2234 Před rokem

    Love it

  • @ioanaienciu2049
    @ioanaienciu2049 Před rokem

    That was good.;) 👍

  • @naufalammarrauf166
    @naufalammarrauf166 Před rokem

    HAHAHA really love this auto layout tutorial 🤣

  • @robinklaiss
    @robinklaiss Před rokem

    Epic!

  • @manashkashyap7780
    @manashkashyap7780 Před rokem

    Please make fancy design tutorials

  • @deekshasatapathy9009
    @deekshasatapathy9009 Před 11 měsíci

    damnnn, you saved my life

  • @zerox9646
    @zerox9646 Před rokem

    on the one hand it is interesting to watch, on the other it is difficult to perceive

  • @irissolanolopez2899
    @irissolanolopez2899 Před rokem

    Genius!!!!!!!

  • @harshaandhillon8649
    @harshaandhillon8649 Před 5 měsíci +1

    Love this advice! :) 04:45

  • @blurryace2807
    @blurryace2807 Před rokem

    subbed!

  • @user-gp4uu9fd5m
    @user-gp4uu9fd5m Před 7 měsíci

    Great :)

  • @arff_f
    @arff_f Před 3 měsíci

    The only tutorial u need hahahaha i swear.

  • @ridd
    @ridd Před rokem +1

    Lol I love it. So so much.

  • @danielgolden90
    @danielgolden90 Před rokem

    It was worth it.

  • @wzywgwzywg
    @wzywgwzywg Před rokem

    SHIFT+A!!!!

  • @alfredosmith6107
    @alfredosmith6107 Před rokem

    I want to be like you when i grow up
    - a grown man