How to Design Responsive Header Navigation in Figma - Autolayout

Поделиться
HTML-код
  • Опубликовано: 22 окт 2024

Комментарии • 51

  • @vandersonmarinho7414
    @vandersonmarinho7414 Год назад +3

    I'm Brazilian 🇧🇷 and I learned a lot from your explanation. thank you very much.👍

  • @ElMountaserBAbbas
    @ElMountaserBAbbas 6 месяцев назад +5

    To group auto layout click shift-A , this is my first video in figma and I used to use ctrl G usual to Group but its not the same I noticed , so I found this SHIFT A

    • @designleague
      @designleague  6 месяцев назад +1

      Thanks for watching and sharing your experience with the shortcut keys!

  • @emflit
    @emflit 5 месяцев назад +1

    Thank you soooo much for this amazing video! Finally, I got it! Good job :)

    • @designleague
      @designleague  5 месяцев назад +1

      Thanks for your comment, glad it helped you let me know if you have any questions!

  • @christina9898979
    @christina9898979 6 месяцев назад +1

    Thankyou for the tutorial :)

    • @designleague
      @designleague  6 месяцев назад +1

      Thanks for commenting, i hope it was helpful to you

    • @christina9898979
      @christina9898979 6 месяцев назад

      It is helpful :)

  • @marckobuendicho3883
    @marckobuendicho3883 10 месяцев назад

    bro, thank you really. I subscribe, you fcking made it work for me. Godbless. I hope you continue making videos, especially for a whole landing page design process.

  • @cahit7270
    @cahit7270 7 месяцев назад +1

    Hi, good aproach, but how can we check, whether it is responsive?

    • @designleague
      @designleague  7 месяцев назад

      Thanks for your comment, ideally it you select the header nav component (left or right) and move it you should be able to adjust it to specific screen size, when you add a mockup e.g. 1440px, try to specify header constraints (left/right/top) this should adjust it accordingly. I will create a step by step tutorial for you on this topic in a next few tutorials and will break it down into more details, would be happy to hear your feedback if it worked. Also subscribe not to miss it. 👋

  • @sikandarmushtaq48
    @sikandarmushtaq48 Год назад +1

    Great tutorial thank you ❤

    • @designleague
      @designleague  Год назад +1

      thank you for your comment @sikandar appreciate that :)

  • @PacoEm-p8e
    @PacoEm-p8e 6 месяцев назад +1

    thanks for your tuto

    • @designleague
      @designleague  6 месяцев назад

      Thanks for your comment 😉

  • @vamboo8918
    @vamboo8918 2 месяца назад +1

    Good

  • @lari7094
    @lari7094 Год назад

    Thank you so much for the video!

  • @pollux8132
    @pollux8132 Год назад +1

    nice video!

  • @alexsmith5868
    @alexsmith5868 Год назад +1

    ❤❤❤

  • @chakaravarthy1977
    @chakaravarthy1977 10 месяцев назад +1

    Bro ur voice sounds like Saul Goodman in quite manner

    • @designleague
      @designleague  10 месяцев назад

      Never thought about that i actually searched Saul Goodman to listen it 🤣🤣🤣 thanks for your comment, appreciate it 👍

  • @PureToneMusic
    @PureToneMusic Год назад

    Can you do one with how you'd add a hamburger menu for the tablet and mobile?

    • @designleague
      @designleague  Год назад

      Thanks for your comment, I have created a video on how to add hamburger menu for mobile devices ruclips.net/video/GLbbHmxqj10/видео.html

  • @tsiroukismichael9606
    @tsiroukismichael9606 Год назад

    Hi, i have an issue on creating an instance of the head navigator (@ 13:20 ). It produces only 1 of the 3 head navigators each time i copy and paste them over the frames (desktop, tablet and mobile). I cannot change the properties of the navigator header (S, M , L). I have followed the steps multiple times , but without luck. Is there any solution for that ?

    • @designleague
      @designleague  Год назад +1

      I will create a video, on this topic how to do it step by step. Please subscribe the video will be published on monday.

    • @designleague
      @designleague  Год назад

      Hi here is the new video that I have explained step by step ruclips.net/video/zyraRIgHU_w/видео.html please let me know if I answered your question. thanks

    • @Paris_objects
      @Paris_objects 5 месяцев назад +1

      @@designleague why I cant find this video anymore?! :(

    • @designleague
      @designleague  5 месяцев назад

      @@Paris_objects Hi Paris, thanks for your comment, I am not sure here is the URL: ruclips.net/video/TSs1Bx4go90/видео.html let me know if you have any questions, happy to help :)

  • @fUzZyboY420
    @fUzZyboY420 Год назад

    where are the urls to breakout rooms? How do I get into them?

    • @designleague
      @designleague  Год назад

      Thanks for your comment, please see the video description you will find the figma link, you can copy/duplicate the file if needed.😊

  • @Jwarddesign-ca
    @Jwarddesign-ca Год назад +1

    Am I a complete boomer or just a dummy? I can never see the details on the person's screen as they're showing us. I don't have bad vision either. How does everyone see everything they're showing? Can you zoom in on videos or something?

    • @designleague
      @designleague  Год назад

      Thanks for your comment! Sorry that you weren’t able to see the details, maybe try to increase the video quality to 1080p that might help!

    • @marckobuendicho3883
      @marckobuendicho3883 10 месяцев назад

      If you are familiar with the navigation on Figma, just listening already guide you where you need to go

    • @Jwarddesign-ca
      @Jwarddesign-ca 10 месяцев назад

      @@marckobuendicho3883 I know the interface well. I can't see the numbers. That's the problem.

  • @SomeOne-ri1ng
    @SomeOne-ri1ng 7 месяцев назад

    good tutorial ,but accent and pronocment could be beter

    • @designleague
      @designleague  7 месяцев назад

      Thanks for your comment, valid point, I’m working to improve it hopefully it will get better over time. 👍

  • @govalaputra4503
    @govalaputra4503 4 месяца назад +1

    Nice tutorial!, and don't forget to drink more water bro!

    • @designleague
      @designleague  4 месяца назад

      Thanks for your comment, happy to help! Yes, you are right i do need to drink more water. 💦 probably have to set reminders 😀

  • @ebtehals6374
    @ebtehals6374 2 месяца назад

    your voice not clear at all 😩😫

    • @designleague
      @designleague  2 месяца назад

      Try the other video i've done, the concept and the techniques are pretty similar ruclips.net/video/_gBeB3BM-dc/видео.html and let me know if you have any questions.

  • @artenman
    @artenman 8 месяцев назад

    This guy sounds like he's falling asleep

    • @designleague
      @designleague  8 месяцев назад

      Nice comment, i hope the tutorial was helpful for you! 😁

  • @RckDtar
    @RckDtar 10 месяцев назад

    this dude talks like my dentist

    • @designleague
      @designleague  10 месяцев назад

      🤣🤣🤣 I hope you like your dentist 🦷 thanks for your comment. 👍

  • @63nni39
    @63nni39 2 месяца назад

    This video confused me

    • @designleague
      @designleague  2 месяца назад

      Thanks for your comment. Please let me know if i can help you with anything that isn't clear for you.