Тёмный

How to Make Automatic Photo Carousel in Figma | 3 Minutes Figma Tutorial 

Studio XD
Подписаться 853
Просмотров 82 тыс.
50% 1

Hey guys ! In this Video I'll show you how to make an Automatic Photo Carousel in Figma.
Like and Subscribe for more Content like it.

Опубликовано:

 

5 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 56   
@mels287
@mels287 8 дней назад
Clear, short, simple to understand! Thank you!
@marialauracometta2633
@marialauracometta2633 Месяц назад
Hi, this was great, but I followed the steps to the detail and it doesn't work when I try to Preview. Any idea of what could be happening?
@MuhammadNizzalMalik
@MuhammadNizzalMalik Месяц назад
same I got the same problem
@caydaf
@caydaf 21 день назад
Try to place all elements in a frame too.
@abychemu6994
@abychemu6994 5 месяцев назад
This worked, thank you!
@RenukaChaudhari-n3z
@RenukaChaudhari-n3z 7 месяцев назад
Useful Video
@Witchydeviloffl
@Witchydeviloffl 5 месяцев назад
thanks a lot its working❤🎉
@Josh-rm4ig
@Josh-rm4ig 3 месяца назад
I love this! thanks
@designersis
@designersis 6 месяцев назад
Very nice good luck
@mariaemiliapigini3333
@mariaemiliapigini3333 2 месяца назад
Gracias ♥
@MarcjohnVillacorta
@MarcjohnVillacorta Месяц назад
Muchas Gracias Senior
@nihan2702
@nihan2702 4 месяца назад
Thank you so much
@MarcianitoPlus
@MarcianitoPlus 3 месяца назад
Gracias, fue muy funcional para mí. Era justo lo que bucaba.
@studio_xd
@studio_xd 3 месяца назад
De nada, estaré feliz de poder ayudar.
@nazwadhr4674
@nazwadhr4674 20 дней назад
thankyou!!!
@snowcrunch016
@snowcrunch016 День назад
Is it possible to make an endless carousel, but in such a way that when you hover the mouse over a photo, it stops?
@studio_xd
@studio_xd День назад
Yes you can do that by using variables. You need to create placeholder component for each image.
@snowcrunch016
@snowcrunch016 8 часов назад
@@studio_xd Thank you for your answer! It sounds difficult 🤯 Maybe you can make a tutorial or know of another one to watch?😭
@mariannebos2817
@mariannebos2817 3 месяца назад
How do you make the carousel continue from the 1st picture, instead of it going back to the left, continue right?
@studio_xd
@studio_xd 3 месяца назад
To start the Carousal from the 1st picture instead of going to it from the last picture from left to right. You need to select the prototype settings of last image and set the animation to Instant instead of Smart Animation. Then the carousal will continue from 1st picture instead of going to itm
@joesumat
@joesumat Месяц назад
is there a way we can control the direction of the flow?? like instead of going to left, it's going to be on the right side?
@studio_xd
@studio_xd Месяц назад
Yes, All you have to do is to place the images on the left side (like we placed in this video on the right side) Do the prototyping and it'll go to right side from left.
@CHSHAKISH
@CHSHAKISH 9 дней назад
We can use instant option instead of Smart Animate for transition from frame 4 to 1 this will resolve the issue of opposite direction flow.
@uifry
@uifry 6 месяцев назад
Amazing !!
@AliKhan-j8g2p
@AliKhan-j8g2p Месяц назад
hello is to be much easy ha
@nobody-my5yv
@nobody-my5yv 21 день назад
i did this exactly the same and it did not work why :(
@jmrenteria100
@jmrenteria100 3 месяца назад
Once I run animation in preview mode the component won't automatically work. I've completed the other steps. Just don't know what i'm doing wrong. Can you help?
@studio_xd
@studio_xd 3 месяца назад
Does it work at all ? By clicking or it doesn't responds ?
@jmrenteria100
@jmrenteria100 3 месяца назад
@@studio_xd Dose not respond
@jmrenteria100
@jmrenteria100 3 месяца назад
I just got it to work. I then added it to my wireframe, and it dose not work again.
@jmrenteria100
@jmrenteria100 3 месяца назад
ok. I deleted the frame and re-installed the instance. Works now. thanks for responding and the video!
@ilsegarciasaldivar8822
@ilsegarciasaldivar8822 6 месяцев назад
Woow michas gracias 💖
@nllxm
@nllxm 4 месяца назад
thx
@charvinangia5532
@charvinangia5532 6 месяцев назад
bestt !!!!!
@rashmir5731
@rashmir5731 6 месяцев назад
How to make last pic automatically go to first pic without blurring other pics?
@studio_xd
@studio_xd 6 месяцев назад
While prototyping last pic. Instead of Smart Animate, Select "Instant" and It'll instantly shift to first pic without blurring other pics.
@ebenjohnson2875
@ebenjohnson2875 4 месяца назад
Hi I did all the steps But when i present it is not working Please help..
@studio_xd
@studio_xd 4 месяца назад
Hi ! I can't tell which step you did wrong. Kindly export your file and email it to studioxd0428@gmail.com, I can find the issue in your file and report you back.
@klavamysh
@klavamysh 4 месяца назад
How do I do this scrolling, but when sliding my finger?
@studio_xd
@studio_xd 4 месяца назад
Instead of using "After Delay" use "On Drag" while prototyping. Further select "Move" and Apply directional arrow you want to go.
@klavamysh
@klavamysh 4 месяца назад
@@studio_xd thank you very much!
@Paulineisspooky
@Paulineisspooky 4 месяца назад
I followed all the steps but rather the sliding it just fades out like a slideshow, help pls :
@studio_xd
@studio_xd 4 месяца назад
Make sure you group photos before applying Frame selection after that select "Smart Animate" and then "Ease Out" while Prototyping.
@applep11e
@applep11e 5 месяцев назад
it's not working on me😔😔
@studio_xd
@studio_xd 5 месяцев назад
What seems to be the issue ?
@fabiobruno7385
@fabiobruno7385 4 месяца назад
How can i add it to another project?
@studio_xd
@studio_xd 4 месяца назад
You can simply add it to another project by "Cut and Paste (not copy and paste)". Cut either Component or the Asset and paste it in any new project.
@lynx8989
@lynx8989 4 месяца назад
why i cant use change it to,i so frustrating
@studio_xd
@studio_xd 4 месяца назад
You can not use "Change to" between separate components. To fix this issue, select all the components you've made and in design section click on "Combine as Variants" this will allow you to use the option.
@alfisyahrin1879
@alfisyahrin1879 6 месяцев назад
why my change to in my prototype is grey cannot be selected ?
@studio_xd
@studio_xd 6 месяцев назад
You need to make sure you select all frames and click on "Create Component set" if you made components separately then select them all and you'll see an option to make component set in design section.
@alfisyahrin1879
@alfisyahrin1879 6 месяцев назад
very helpfull thank you so much !
@itsadityapal
@itsadityapal 7 месяцев назад
why my 1st photo don,t clip
@studio_xd
@studio_xd 7 месяцев назад
You need to make sure you group all photos first then apply frame selection. Press Control Key and drag the frame upto your fiest photo. Select frame and your grouped photos then apply Clip.
@raidenshogun-k3c
@raidenshogun-k3c Месяц назад
ctrl key?
@studio_xd
@studio_xd Месяц назад
I'm sorry for not mentioning, Ctrl is Control Key for Windows and Command for Mac
Далее
Create a SWIPEABLE IMAGE CAROUSEL in Figma (Tutorial)
15:43
How to design Automatic Carousel/ Slider in @Figma
8:39
Figma Carousel Animation in 8 Minutes
8:05
Просмотров 87 тыс.
Create Any Carousel in Figma (Beginner Tutorial)
10:01
Просмотров 130 тыс.
Create an Interactive WEB SLIDER in Figma
20:22
Просмотров 160 тыс.
Card swipes/ carousels in Figma
18:41
Просмотров 64 тыс.
Scroll Animations in Figma! (Without scroll support)
22:56