Horizontal and Vertical Scroll in Figma | Figma Tutorial

Поделиться
HTML-код
  • Опубликовано: 23 ноя 2024
  • In this video, I'm going to show you how to create horizontal and vertical scrollable sections in Figma.
    Check out Wix Studio👇:
    www.wix.com/st...
    📸 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.

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

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

    👉 Become a UI Designer with my UI Design & Figma Mastery course (17+ hours and 130+ lessons):
    bit.ly/43v79vX

  • @h.alexbrena7154
    @h.alexbrena7154 10 месяцев назад +5

    Congrats!!!, the explanation is by far the most crystal clear around!!!

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

    The timing of this video is unbeliavable for me. I was creating something yesterday and I couldn’t figure out how to do this, there was something I was missing and planning to check it from a video. Then your notification hit 😅 thank you

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

    Thank you, Arash. You are an excellent teacher, and I have learned a lot from you ♥

  • @ChrisTKelley
    @ChrisTKelley Месяц назад

    This is a good video. You explained it very well, but the margin on the left side of the horizontal carousel should not clip the content. In the "home" position if you will, it should have that 12dp margin on the left side, but as you scroll horizontally, the content should extend to the outer edge of the frame. At least that is how most horizontal carousels work. Is this possible in Figma? I'd love if you had an updated video on this. I think maybe you would just need to add the margin on the left side of the tags frame like you did on the right of the other container and have the frame start at X position 0.

  • @SaiSkanda-xf8su
    @SaiSkanda-xf8su 9 месяцев назад

    Haha! By far the simplest explanation, thank you! Could you also show how to add a button to automatically scroll left-to-right, please?

    • @DesignWithArash
      @DesignWithArash  9 месяцев назад

      Thank you. You can do that by creating an interactive component (with two variants).

  • @rogermortimer111
    @rogermortimer111 3 месяца назад

    Thank you. Great and simple video.

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

    Clean and informative tutorial, thank you Arash.

  • @Engelchen19
    @Engelchen19 8 месяцев назад +2

    I still have as position "scroll with parent"

  • @Bilbyflix
    @Bilbyflix 25 дней назад

    When I try to preview/present the prototype, the homepage is minimising to the left upper corner of the prototype screen. What am I doing wrong??

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

    This video is helps to understand prototype.... BUT how can i make page wise TABS Horizonal scroll in prototype?

  • @Jahnavieskala-o4u
    @Jahnavieskala-o4u Месяц назад

    does the overflowing part have to be a frame or can it be textboxes also?

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

    Thank you !!! It helped me a lot!! Very clear

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

    @DesignWithArash, how can we make prototype with TABs page changes too

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

    you are a great teacher Arash. but i have a question if you don"t mind

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

    Arash thank you soo much, but i have a question for you, Figma supports left to right horizontal scroll, but for my project I need a right to left horizontal scroll, just like the one in your video for youtube. For example when we click on any button on youtube bar, that bar is highlighted and we can scroll left as well. Can you please explain how to make a horizontal bar like that please

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

      Hi. No problem. You just need to increase the width of your frame (scrollable frame) from the left instead of right.

  • @AchmadB.Septiyantana
    @AchmadB.Septiyantana 28 дней назад

    my control and command key doesnt work, it croped the content inside it

  • @AyomidePopoola-kr7qz
    @AyomidePopoola-kr7qz 7 месяцев назад

    Thanks Arash.

  • @ytmuhammadsyarief3531
    @ytmuhammadsyarief3531 26 дней назад

    Kak minta file redesain youtube di figmanya boleh ga kak

  • @mrjacobsidhu3625
    @mrjacobsidhu3625 11 месяцев назад

    video starts at 02:25

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

    Excellent

  • @Ajadi_kun_
    @Ajadi_kun_ 3 месяца назад

    Thank you

  • @ashwinkumar4371
    @ashwinkumar4371 Месяц назад

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

    Thank you!!

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

    Eşq olsun Cənub Azərbaycanlı türk qardaşıma! ✌️

  • @dineshkumar-hx9vc
    @dineshkumar-hx9vc 6 месяцев назад

    When the scrolling ends I'm not getting that elastic effect

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

    piz do webflow advanced course
    i will ask you again & again

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

      I'm not planning to publish a new Webflow course in the near future.

  • @Manoj-hf2ls
    @Manoj-hf2ls 5 месяцев назад

    This is easy peesy, press of a button in Adobe XD, why figma had to make it complicated AF

  • @Haroonjan-2776
    @Haroonjan-2776 3 месяца назад

    how can i creat this animation
    file:///C:/Users/AFC/Desktop/yyy.mp4
    pleace tell me