Great tut. I appreciate the low fidelity approach you take. I've found myself getting bogged down by a lot of tutorials that create entire designs in one sitting.
It took me 2 hours to find a video like this! Step by step, easy to follow and exactly what I was looking for!! Thank you and please keep making videos like this!! :)
Muchas gracias! para hacer que se moviera en automático, edité las interacciones entre slides y seleccioné after delay, ahora se mueven y se ven hermosas ! Gracias por el contenido !
You are one of the few people who shoots how to design correctly, each topic is chosen well. Keep up the good work and we will encourage you. Best regards 🔵🟡
hey there, I'm also learning Figma and I wonder, what if I want to add another slide, I will have to: 1 - add another navigation component 2 - edit all the navigation components 3 - add the slide and change prototypes the third step is kind of ok to me, but 1 and 2 looks a bit goofy is there a way to fix that?
To get personalized & specific help + feedback with your project, please join my free Discord server. You can send me an Instagram DM or reach out to my email (About section of my channel) to get your invite. I'm unable to help everyone over RUclips - thank you for your understanding! Mavi
Hi, it was amazing it was so helpful can you tell me that how can i organize the prototype section when i have 4 pictures??? please tell me as soon as possible🥺🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏
Hello! Thank you for your tutorial. I have a question. I tried to not include the left arrow on the first slide (which ends up arrow's being smart animated and just not working) and tried having the last slide smoothly slide to the right to the first slide (not looking like going reverse). But I reazlied that can't be made in figma. So.. if I can't make exactly what I want in figma how should I show clients? Do people animate in after effects and show it to clients or how do designers make detailed interactions?
Great question. In this case I’d suggest duplicating the the three slides so that when you click the “next” arrow , it’ll move to the next slide which is just a copy of the first one, making it look as if it’s infinite. And regarding not showing the arrow at the beginning, try hiding it in the very first state - I think that should work? Anyway when there’s something that can’t be made in Figma , then yes, after effects or some kind of Figma workaround needs to be done :) Figma workarounds usually help you with a very specific case, but eliminate the possibility to have a scalable / reusable / universal template for different use cases
Hi. The slide container is not going inside the slider. Did exactly what u did but it just not going. What could I be doing wrong, I dont get it. Can someone help
Hi, thanks for making this tutorial! It's well organized compared to others. I just have a question: I changed my test frame to 1440 x 900 px, but somehow the text is off-center even if I tried to fix the slides container (didn't seem to have problem on that frame). Perhaps I should create a separate frame in the "slider" component for the texts, and it would behave the same as the "navigation" (dots) component? Ultimately, my goal is to make the text to be in the center (as intended) even if I resize the "test frame" to smaller (or bigger) width. Could you advise?
@@mavidesign Sure, where shall I send you the link? In the meantime, I just resized the slides' width inside the "slider" component so that the text is centered in the test frame (with 1440px width). I'm thinking taking out the text from the "slide" component and bringing it together in the "slides_container" instead might make it work...
Thanks for the suggestion! You might want to check this out in the meantime. Not 100% identical to this slider, but similar in a lot of ways: ruclips.net/video/g6L2xdX-TXc/видео.html
@@mavidesign thanks Alot, you're really doing an amazing Job, I salute you... Do you work in a tech firm or basically your freelance? Cause you're really good.. I've learned so much from you
@@mavidesign That's awesome, I am a freelancer as well but I haven't gotten any gig yet, am still taking some courses online to perfect my skills.. you've been really helpful. Wishing you the very best
It legit won't let me paste the slides container in the slider. I've tried it so many times. So frustrating when basic copy paste functions don't work. Has anyone else got this problem?
Yes, it’s all about setting up the slide contents (can be text , image, or combination of both) Also video on an image carousel is coming soon, stay tuned:)
This is very informative Mavi! Can you pls show how can we make that button in the slide be interactive as well? Like when we click the slide, it should lead to another page. I have been struggling figuring that out. Also, you have a sub from me.
if you want the button to change color, for instance, you can turn the button into a component and then use the hover effect just as he did with the arrows. More over, if you also want to be able to click the button and then go to another page you open the component in the slide and then you open property and conect the button to the page you wish using 'click' and 'instant'.
![BLACK BAG - Official Trailer [HD] - Only in Theaters March 14](http://i.ytimg.com/vi/Du0Xp8WX_7I/mqdefault.jpg)
Great tut. I appreciate the low fidelity approach you take. I've found myself getting bogged down by a lot of tutorials that create entire designs in one sitting.
Thanks for the feedback! 😊
This tutorial combined with the Instagram carousel one made my life a little easier, thank you very much for helping this student!!!
your videos are literally finding water in the middle of the desert! thank you so much for your help
It requires a lot of patience
It took me 2 hours to find a video like this! Step by step, easy to follow and exactly what I was looking for!! Thank you and please keep making videos like this!! :)
your tutorials helped me a lot for my assignments. Thank you so much, sir 🙏🏻
One of the best youtube channel for learn ui design
I would enjoy thunderstorm and then make the video, but you're enjoying the thunderstorm and making the video, great!
This video was fantastic, super easy to follow, thank you so much!
Actual goated tutorial, quick and easy to understand. Thank you a million times 🙏
Complicated but effective... THAKS A LOTTTTTTTT
there is the easy way and there is the right way you did it in the right way thank you
thank you so much for this, now I can make high fidelity designs
love your tutorials! they are helping me so much :>
THANK YOU VERY MUCH! This was really helpful
Muchas gracias! para hacer que se moviera en automático, edité las interacciones entre slides y seleccioné after delay, ahora se mueven y se ven hermosas ! Gracias por el contenido !
le coloque 2 interacciones, la primera after delay y luego one click para que el usuario pueda navegar a su gusto :)
You are one of the few people who shoots how to design correctly, each topic is chosen well. Keep up the good work and we will encourage you. Best regards 🔵🟡
absolute legend, you explain everything great
Thank you so much ! that helped me with my assignment
18:10,I followed your tutorail to add drag interaction to sliders_container,but my figma change to is gray(unavailable).
This was really helpful, thank you!
Only thing I had to add was a close button :D
thank you so much for this wonderful tutorial☺
Thanks Mavi you make my day♥
Goated for real!!
Amazing stuff thank you so much! This is really useful for ecommerce card components
Mwuuuuuuaaaaaahhhhhh!!!!! 😂😂😂😂 thank you so much for this tutorial!!!! It has helped me a great deal!
Can you easily copy and paste to duplicate. Changing out to put new images instead of doing all the steps over again?
thank you man! good job
Hi i would like to ask, why when i paste the slide container, it becomes mirrored, all the text are backwards
Thank you very much!) you helped me a lot)
GRACIAS AMIGO, ME SALVASTE
😭🤧
hey there, I'm also learning Figma and I wonder, what if I want to add another slide, I will have to:
1 - add another navigation component
2 - edit all the navigation components
3 - add the slide and change prototypes
the third step is kind of ok to me, but 1 and 2 looks a bit goofy is there a way to fix that?
Great tutorial. Thank you very much.💯
at 14:20 it doesn't let me choose the slide option, just the first three options, whats wrong!!
To get personalized & specific help + feedback with your project, please join my free Discord server.
You can send me an Instagram DM or reach out to my email (About section of my channel) to get your invite.
I'm unable to help everyone over RUclips - thank you for your understanding!
Mavi
Very useful, Thanks a lot man
Hi, it was amazing
it was so helpful
can you tell me that how can i organize the prototype section when i have 4 pictures???
please tell me as soon as possible🥺🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏
Thanks for your perfect tutorial.
Hi ,i want to know how to use the slide component can be prototyped with frame/rectangle
Question: if I have 4 slides, then how can I display slide #2 and slide #3 in the "slider"? Align center doesn't work. Thank you.
how do you make when you have more than 3 slides at 14:19 min ? I do not understand. Thamk you.
Hey, I have the same question. Have you managed to solve this?
thanks man 💌
Hey ! but I can't understand the main step at 11:20
Brilliant. Thank you!
Hello! Thank you for your tutorial. I have a question. I tried to not include the left arrow on the first slide (which ends up arrow's being smart animated and just not working) and tried having the last slide smoothly slide to the right to the first slide (not looking like going reverse). But I reazlied that can't be made in figma.
So.. if I can't make exactly what I want in figma how should I show clients? Do people animate in after effects and show it to clients or how do designers make detailed interactions?
Great question. In this case I’d suggest duplicating the the three slides so that when you click the “next” arrow , it’ll move to the next slide which is just a copy of the first one, making it look as if it’s infinite.
And regarding not showing the arrow at the beginning, try hiding it in the very first state - I think that should work?
Anyway when there’s something that can’t be made in Figma , then yes, after effects or some kind of Figma workaround needs to be done :)
Figma workarounds usually help you with a very specific case, but eliminate the possibility to have a scalable / reusable / universal template for different use cases
doing modifications in the middle of resolving the solution made me very confused as i was learning and felt lost when you went back in the subject.
Hi. The slide container is not going inside the slider. Did exactly what u did but it just not going. What could I be doing wrong, I dont get it. Can someone help
Hey have you managed to solve this? I have the same issue
What if I want to create the appearance of a loop? What am I supposed to do? Please help me.
Very useful. Thank you
I can't understand where I did it wrong(, could you help me, if so, where should I drop the link, because RUclips will delete it.
I have downloaded the fig slider file and imported it but how do add it to my own prototype for use there ?
nice very good, i like it
Thank you so much .. Thank you Thank you Thank you.
awesome, thank you
Hi, thanks for making this tutorial! It's well organized compared to others. I just have a question: I changed my test frame to 1440 x 900 px, but somehow the text is off-center even if I tried to fix the slides container (didn't seem to have problem on that frame). Perhaps I should create a separate frame in the "slider" component for the texts, and it would behave the same as the "navigation" (dots) component? Ultimately, my goal is to make the text to be in the center (as intended) even if I resize the "test frame" to smaller (or bigger) width. Could you advise?
Could you share your Figma file with me? That would be faster for me to get to the core of the issue:)
@@mavidesign Sure, where shall I send you the link?
In the meantime, I just resized the slides' width inside the "slider" component so that the text is centered in the test frame (with 1440px width).
I'm thinking taking out the text from the "slide" component and bringing it together in the "slides_container" instead might make it work...
Either my email in the “about” section of my RUclips channel or send a dm to my instagram page @mavidesignyt
@@mavidesign I DM-ed the link! Thank you so much!
@@charityworks.studio i have the same issues right now. can you explain?
Thank you :)
thank you
Slider Container thing doesn't work.
GREAT WORK AND THANKS SO MUCH FOR SHARING THIS.. PLS CAN WE HAVE THE MOBILE APP VERSION OF THIS? THANK YOU
Thanks for the suggestion! You might want to check this out in the meantime. Not 100% identical to this slider, but similar in a lot of ways:
ruclips.net/video/g6L2xdX-TXc/видео.html
you're a literal SuperSan
What's the name of the instrumental playing in the background
Causmic - Distant Love from the RUclips audio library
@@mavidesign thanks Alot, you're really doing an amazing Job, I salute you... Do you work in a tech firm or basically your freelance? Cause you're really good.. I've learned so much from you
@@harrymorgan595 that’s so nice of you to say! Thank you:) I’m a freelancer right now with the vast majority of my clients being tech companies
@@mavidesign That's awesome, I am a freelancer as well but I haven't gotten any gig yet, am still taking some courses online to perfect my skills.. you've been really helpful.
Wishing you the very best
The best
It legit won't let me paste the slides container in the slider. I've tried it so many times. So frustrating when basic copy paste functions don't work. Has anyone else got this problem?
Try dragging it in instead of pasting
bro you making tutorial it,s so confusing some time
a very confusing tutorial
😂😂yes I think it's very confusing
Extremely confusing tf😂
Not at all
Would this work as an image carousel?
Yes, it’s all about setting up the slide contents (can be text , image, or combination of both)
Also video on an image carousel is coming soon, stay tuned:)
@@mavidesign thankss
there's also this: ruclips.net/video/IkL0bYUO0Is/видео.html
@@mavidesign thanksss
And now this (the img carousel) haha: ruclips.net/video/g6L2xdX-TXc/видео.html
i want to buy source file?
Check the link in the description:)
This is very informative Mavi! Can you pls show how can we make that button in the slide be interactive as well? Like when we click the slide, it should lead to another page. I have been struggling figuring that out. Also, you have a sub from me.
if you want the button to change color, for instance, you can turn the button into a component and then use the hover effect just as he did with the arrows. More over, if you also want to be able to click the button and then go to another page you open the component in the slide and then you open property and conect the button to the page you wish using 'click' and 'instant'.
This does not work you cant add the slide container to the slider
did you mnage to resolve this issue? i keep trying to copy paste it, cut and paste it but still i cannot see my arrows and slider buttons below
great
😂
Amazing tutorial! Thank you so much.
Fantastic tutorial. Thank you so much!