Create ADVANCED Image Slider Animation In Figma | Figma Tutorial

In this video, I tried to show you how to create an advanced image carousel animation using Figma. If you found this video useful, don't forget to like, comment, and share this video.

Check Out Previous Videos

[gaolin]

Thank you much for the tutorial! I’m a Figma noob and could follow so easily you literally saved my UX assignment <3

[Thao-zc]

great tutorial! I just started learning Figma and this video really did help me! Thanks a lot :)

[steviesmith]

no written captions or voice for the directions?

[mohamedhoussamboutaleb]

If you have this problem :
The slide of images doesn't work as expected, try this :
turn on clip content for the frame (make sure it's the case)
If it still doesn't work, select all the images => right click => delete auto layout. It should work
I spent more than 2 hours to find out about this :)

[williamcopelandiv]

EDIT: Figured it out!

Thanks for the tutorial! Quick quedstion, I am trying to use this within a bigger frame on a landing page. When I move it in and prototype it on page, when I get to the section everything goes away except the image slider. How do I go about keeping it on a full page view while keeping the image slider functional?

[pongalelalupa]

Thank amazing tutorial am exist a second part ? for add the funtionality to the buttons of stories contests and login?

[musicalmotivation]

Bro instead of this background music can you use voice (Yours /AI).It would be really helpfull

[Gomorrah_TV]

Great work, thank you for your effort.

[sapnabisht]

Great work! But I wish it was a explained through words instead of using music. It's much earlier to understand.

[muteahmdv]

İnstead of desktop I used components, yet my text didn't rolled as landscape shifting to portrait

[samielkaddach]

is it possible to create a component out of this and paste it in the middle of a website page on figma?

[ToluwanimiVictoria]

hi, Just came across your video and trying to duplicate what you did here. but I'm stuck how you duplicate 3 more of rectangle 1

[Travellandmore]

Heyy can help me how you add the snap story, discover, stories, option from the video 5:31 minutes.
And how you create frame 5, 4, &2
Everything I am complet but stuck in 5:31 how you add these can you Plzz explain me.

Bhai 5:31 second ru au bujhi hauni thk explain kro ki frame 5, 4, 2 kemte create krilo au text guda kemte kn create krilo

[poojamirchonia]

hii i need help
how to place this flow in main landing page

[RokiMANABU]

how to download after the slider animation is finished

[chaccoromi]

hello, I want to ask. maybe this is a little off topic. I am very new to UI UX design and at that time I was designing for my college assignment. I was really confused when I wanted to expand the page, the icon that I had placed well actually shifted. Can you explain how I solve it, or is the icon part added after all the designs are ready? Hopefully this question can be answered

[FloNocode]

Who's is here and is actually a Framer User ?
Maan u will test to make this awesome tutorial directly in framer

[alessandrobalzano]

Hi, is there any chance to embed this carousel in a bigger figma page? thank you

[pragyanshvardhan]

I have kept the same settings while prototyping, but the effect is not working for some reason. Can you help me out ?

[mma-peft]

pls can you explain what you did with the ruler, i am trying to shift the image slider but it is not disappearing.