No video

Figma interactive components | Image Carousel animation tutorial | Hover animation

  Рет қаралды 20,441

Yariv BE

Yariv BE

2 жыл бұрын

Learn how to create an image carousel for your next or already existing website design. Using smart animate, hover interaction, variants and interactive components you will create this beautiful image carousel animation.
For better understanding of figma components and variants -
• Figma tutorial: compon...
• Figma tutorial: compon...
For better understanding of Auto Layout (which is used easily in this tutorial) -
• Figma tutoria: Auto La...
#yarivbe ‪@YarivBE‬

Пікірлер: 42
@jordangiles5481
@jordangiles5481 6 ай бұрын
Such a great video for someone new to Figma like me! Was super easy to then go and adapt it to look and function how I wanted :) Thanks!
@YarivBE
@YarivBE 6 ай бұрын
Thank a lot Jordan for this amazing feedback! I really appreciate it 🔥 and happy to know it was helpful! 🙂
@ginaraduski8184
@ginaraduski8184 2 жыл бұрын
Thank you, Yariv! That was awesome
@YarivBE
@YarivBE 2 жыл бұрын
Thank you so much Gina for the amazing feedback! I really appreciate it ⚡😊
@SpSveti
@SpSveti 2 жыл бұрын
מגניב בטירוף תודה רבה!!!
@YarivBE
@YarivBE 2 жыл бұрын
תודה רבה על הפידבק סבטה! שמחתי שאהבת ✌️🙂
@SoundaravalliSP
@SoundaravalliSP 4 ай бұрын
thank you so much for awesome tutorial..it works great👏
@YarivBE
@YarivBE 4 ай бұрын
Thank a lot for this great feedback! I highly appreciate it and happy to know it helps and works 🙂🔥
@ismaildhainy2644
@ismaildhainy2644 2 жыл бұрын
thank you man thats what i needed great video 👍🏻
@YarivBE
@YarivBE 2 жыл бұрын
You are most welcome my friend! Happy to know it did the job 😊✌ Thanks a lot for the great feedback!
@uzairdar6920
@uzairdar6920 7 ай бұрын
really helpful, thanks
@YarivBE
@YarivBE 7 ай бұрын
Your are m most welcome and thanks a lot for your great feedback! I really appreciate it 🙂🔥
@user-xs1ov1bd7c
@user-xs1ov1bd7c 9 ай бұрын
your video is really helpful thank you !
@YarivBE
@YarivBE 9 ай бұрын
Thank you so much for the great feedback! I highly appreciate it 🙂🔥 Hair to know it was helpful :)
@sinister9474
@sinister9474 6 ай бұрын
thank for your help 👍
@YarivBE
@YarivBE 6 ай бұрын
You are most welcome! And thanks a lot for the great feedback! I highly appreciate it 🙂🔥
@justdahana
@justdahana 6 ай бұрын
Thank u so much !!!!!
@YarivBE
@YarivBE 6 ай бұрын
Your are most welcome Dahana! Hairy your liked it and thank a lot for the great feedback! 🙂🔥
@rithikakumar7781
@rithikakumar7781 Жыл бұрын
Thank you so much!!! your videos are so helpful and easy to understand
@YarivBE
@YarivBE Жыл бұрын
Thanks you so much for the wonderful feedback Rithika! I really appreciate it! Thanks you for supporting the channel ⚡🙂
@jesamegbe1579
@jesamegbe1579 2 жыл бұрын
Thank you very much, this has been so helpful
@YarivBE
@YarivBE 2 жыл бұрын
You are most welcome! Thank you so much for the great feedback 🔥
@saritamon911
@saritamon911 2 жыл бұрын
גם את האלמנט הזה ניסיתי ועשיתי בזכותך!
@YarivBE
@YarivBE 2 жыл бұрын
איזה כיף לדעת 🙂 תודה רבה על הפידבק המקסים! 🔥
@kevmutua8
@kevmutua8 Жыл бұрын
thank you!
@YarivBE
@YarivBE Жыл бұрын
Thank you so much for great feedback Kevin! I highly appreciate it ✌⚡
@Well.Luiz55
@Well.Luiz55 Жыл бұрын
Muito Obrigado, amigo.
@YarivBE
@YarivBE Жыл бұрын
You are most welcome my friend :) Thanks for the great feedback! I really appreciate it 🙂🤚
@emanfatima5801
@emanfatima5801 Жыл бұрын
thankyou soo much
@YarivBE
@YarivBE Жыл бұрын
You are most welcome eman! Thsnks a lot for your great feedback 🙂 It is most appreciated ⚡
@stefanroxana6793
@stefanroxana6793 Жыл бұрын
Hi, this is very helpfull but I was wondering, if i have like 100 images that needs scrolling, I have to do the same thing for all of them? Is there a more simple solution? 😀
@YarivBE
@YarivBE Жыл бұрын
Hi Roxana :) and thanks a lot for your great feedback! I really appreciate it 🙂⚡ To your question: 1. The main idea in prototyping is that we demonstrate the behavior of an element, in this case the image carousel. You show a few times how it scrolls - thats it, the behavior is understood if it happens on 3 images or a 100. The developers will definitely understand that - be sure on it :) Nobody (never ever) will do a prototype like this for a 100 images :) 2. UX wise, it is definitely not recommended to do a carousel for a 100 images - up to 20 or a bit more, it can still be ok and make sense - more than that, a "see all" at the the end of this carousel or below the carousel will lead to a page with all the images - again, UX wise it makes more sense. 3. You can also create an infinite scroll, but again, up to around 20 or a bit more, it can still make sense. Hope the answer makes it more clear - please feel free to aske further if needed 🙂
@danhu4465
@danhu4465 7 ай бұрын
​@@YarivBEYou are absolutely right. This is prototyping, not developing the actual website. No need to include all the content.
@mohdmehdirizvi1287
@mohdmehdirizvi1287 2 жыл бұрын
But sir it didnt work on main page(frame) plz help me out
@YarivBE
@YarivBE 2 жыл бұрын
Hello there Mohd :) Can you try to explain to me what didnt work out for you? Its a bit difficult for me to understand like that where did it go wrong... We will work it out - dont worry - i just need to understand better what went wrong. Plz, as a first step, try the tutorial again, see that you go over it step by step - let me know whats the situation after you try again 🙂
@mohdmehdirizvi1287
@mohdmehdirizvi1287 2 жыл бұрын
@@YarivBE sir I make all the frame and prototypes all those frames and it work also but whenever I put it on my website main frame page it didn’t work sir
@YarivBE
@YarivBE 2 жыл бұрын
@@mohdmehdirizvi1287 Ok - i understand the situation. Can you plz share the file with me? i'll take a look there and see what went wrong. Share it to this email - yariv.be1@gmail.com Lets sort it out there :)
@mohdmehdirizvi1287
@mohdmehdirizvi1287 2 жыл бұрын
@@YarivBE ok
@mohdmehdirizvi1287
@mohdmehdirizvi1287 2 жыл бұрын
@@YarivBE sir I just send it , did you got it ?
Create a SWIPEABLE IMAGE CAROUSEL in Figma (Tutorial)
15:43
Mavi Design
Рет қаралды 126 М.
Joker can't swim!#joker #shorts
00:46
Untitled Joker
Рет қаралды 38 МЛН
Pool Bed Prank By My Grandpa 😂 #funny
00:47
SKITS
Рет қаралды 18 МЛН
OMG what happened??😳 filaretiki family✨ #social
01:00
Filaretiki
Рет қаралды 11 МЛН
Harley Quinn's revenge plan!!!#Harley Quinn #joker
00:59
Harley Quinn with the Joker
Рет қаралды 6 МЛН
How to create amazing carousels using components | Figma [part 1]
9:58
Animated Image Carousel and Slider using Figma | Image rotator using figma (2022)
14:04
Figma Carousel Animation in 8 Minutes
8:05
DesignWithArash
Рет қаралды 81 М.
Figma Tutorial: 3D Carousel Slider (+ free files 🎁)
18:18
UI Adrian
Рет қаралды 560 М.
Figma tutorial: Image Carousel with Pagination
23:10
Yariv BE
Рет қаралды 6 М.
Create Any Carousel in Figma (Beginner Tutorial)
10:01
Tim Gabe
Рет қаралды 118 М.
Joker can't swim!#joker #shorts
00:46
Untitled Joker
Рет қаралды 38 МЛН