Horizontal and Vertical Scroll in Figma - Quick Prototyping Tutorial

Hello and welcome to our channel. In this quick step-by-step tutorial, we are going to show you how to prototype horizontal and vertical scrolls in Figma.
Enjoyed this tutorial? Learn more about UX/UI Design through our comprehensive UX/UI Design Mastery Course. It's a one-course you'll need to kickstart your UX/UI design career, packed with in-depth lessons, practical hands-on exercises, and invaluable tips straight from industry professionals.
Transform your passion into expertise and master UX/UI Design:
www.uxpeak.com/
Feel free to join our community
Instagram - / uxpeak_
Twitter - / uxpeak_
Linkedin - / uxpeak
#Figma #UXDesign #FigmaTutorial #uidesign #ui #prototyping #horizontalscroll

[@SimonaTselova]

THANK YOU. I spent hours trying to do this and your tutorial saved me 😭

[@mercyoladipupo573]

One of the best tutorials on RUclips so far. The instructor is amazing and calm.

[@user-kq2is8tl5j]

Love the peace and tone of the voice, it just keeps me interested in the video. Thanks for the tutorial by the way

[@uxpeak]

Glad you enjoyed the tutorial! Thanks for your kind feedback. Stay tuned for more content like this.

[@macacones]

Great tutorial! Thank you very much!

[@vincentdg3499]

So easy, Thank you!

[@Imnotlewis44]

You save me, thank you so much !

[@niluseneviratne3709]

great video. quick and easy to understand and it actually works! thanks

[@kazeemoluwatobilobasimeon5984]

Thank you for the video!

[@nurmanah247]

Thank you very much for the tutorial, it is very useful 👌

[@cncmachinistaartist2160]

THANK YOU!!!

[@savedbygrace.slowedreverb]

Wow! Cool, thanks.

[@natalialeitura5389]

Obrigada MUITO OBRIGADA !!!! Tava quebrando a cabeça pra descobrir como fazer

How do I make it scroll further than the content? It’s not showing me all the content. Cause the menu bar covers it.

[@Official_mohamedfayez]

Set the bottom of the frame at the top of the bottombar, not the top. This should solve the problem I was having too.

[@esu_uxui_designer]

Wow..very slow tutorial...like this type tutorial..and more videos about figma prototype videos please upload your channel..we are support your channel😮❤❤🎉🎉🎉

[@Gobothechairman]

Thank you!

[@mr.protienewing8343]

thanks bro i was actually stuck with it
it worked haha

[@menaammar289]

Great toturial thank you❤

[@uxpeak]

Thank you for your kind words! :) We're delighted to hear that you like this tutorial.

[@souravshah2938]

Thank you sir for your helpful video..

[@aryheic]

Loved the video. Helped me a bunch!

[@RedFunJester]

i what way f*ck how &

[@thebestreveal]

Love it!

[@uxpeak]

Thank you!

[@dominikd6772]

This is amazing 🎉

[@uxpeak]

Oh, that's nice, thank you for your comment

[@miroslavak.3666]

Awesome tutorial

[@uxpeak]

We are very happy to hear that you like it :)

[@esu_uxui_designer]

I want daily more prototype videos in figma...pls upload

[@karenpires4532]

the overflow option doesn't appear to me when I select what I want to move, only when I select the entire frame (and I don't want to move the entire frame, just a specific category). can someone help me? :(

[@KushEdits99]

Very Helpful

[@lunapro8003]

Great tutorial

[@uxpeak]

We really appreciate your feedback :) Super happy to hear that.

[@ashrafloubani3174]

thank you😄

[@user-zq3oo2wl2p]

You mentioned at the top hello Nina! How does it change when a user types some other name?

[@envyvb0535]

Nice tutorial, thanks!💫

[@uxpeak]

Thank you for watching :)

[@Montford_]

Thanks mame!

[@cherryc0smos1]

Thanks

[@andrealiptakova9168]

Very cool video 😊

[@uxpeak]

Thank you. Glad you enjoyed it.🙂

[@najwanaura7171]

very easy to follow! Thankss

[@dominikd6772]

Great video

[@uxpeak]

Thank you :)

[@deborahodinga8739]

Thank you

[@uxpeak]

❤

[@saradia9263]

Very helpful :'))

[@user-cy5pq7qf7n]

What should be the interaction for horizental scroll? I've followed the steps but its not showing there

[@SinisterStrange2029]

How to make prototyping navigation appear when scrolling in figma??

[@mdgolamrabby156]

if you haven't any problem you can share your file for your online students in the video description thanks

[@kwombat5306]

command key doesnt work

[@IAm-ui6bq]

time saver stg

[@richardappow6770]

can we get source file and the assets used?

[@metternich05]

Do you really have to add the intro music with 5x volume? It's youtube 101 you normalize levels before publishing. Not just throw in the first stock audio you find in the junkyard.

[@BellsDev]

Show what you have got... Nothing

[@candace200]

Should have mentioned the padding within the horizontal scroll. Its a minimal requirement.

[@olaleyesylvester9148]

Pls can I get this figma file link?

[@mat.0565]

chef mate asap

[@pinayhazelvlog]

Hello. Why i can't do a vertical mode from scroll behavior for my prototype? It showed an exclamation mark and I don't have a fix position when scrolling. Please help me. Thanks.

[@karenpires4532]

the exclamation mark appears when you have no elements outside the screen spacing. To move vertically, you have to make sure there are elements that extend beyond the size of the frame. I hope this helps.

[@IraHamdan-xs8mv]

can i know the key for windows?anyone can help me on this?

[@plutouzi2740]

Is there a File for this?

[@uxpeak]

Thank you for watching :) No, we didn't include the source file for this one but our other videos usually have one.

[@Wenaartgr]

Idk what is command key and I'm on windows

[@borathossain]

Plz design website

[@uxpeak]

Hello! In our most recent video, we demonstrate how to create a 3D animated carousel for a website hero section using Figma.

[@drakata27]

intro not loud enough