FINALLY! Someone that does a video for advanced tips and tricks! There is such a bombardment of tutorials out there - most of which are aimed at the noobie. It is really like finding a needle in a haystack for more advanced technique tutes. Awesome job, you found an untapped niche! I hope to see many more like this.
@@mdsnotavailable 😊 Hey there. Just thought of something maybe you can help out with ... In Figma, is there a way to click on something to make it animate THEN click on it again to make it stop animating? Kinda of a toggle-ish type thing except the toggle is between animated state and non-animated state. Make sense? For example, make an item spin (like a record). Click on it, it spins. Click on it again, it stops spinning. I am sure there is at the very least a hack... I haven't found anything out there, so it would be a good video!
@@thekuzicartoon You can't pause an animation, but you can kind of fake it by having a set of animated objects and a set of static objects, with a click toggling back and forth between those sets. Here's a quick example: www.figma.com/file/H1FFlmURSQP5rSLD2jvBto/Untitled?node-id=0%3A1
Great video! I love doing everything inside of Figma. Thanks for sharing. I just have one suggestion: lowering/changing that background music (kinda like a metronome, not sure though) and the keyboard sounds, as I had a hard time to follow along. I had to turn on captions and lower the volume, as the mixture of the keyboard sounds and the background music was a bit too much for me.
Agreed. My dynamic mic was on the fritz so my shotgun was the only option. Definitely picks up clicks way more. The music definitely isn’t helping in retrospect. 👍
This is great! I enjoy the fact you say this is not the only way to do it but probably the fastest way, and no need for apologizing man, it makes you humble! Thanks a lot.
This was interesting to watch! I'm still learning the power that Figma holds. Although I'll admit I will have to repeat it a few more times to have it sink in. Your explanation was fun to watch! Appreciate you taking the time to create this 🙏🏾
I've never seen anybody delete variants and paste in the default component. That's absolutely brilliant and I'm gonna play around with that! Thanks for the video!
Love watching this video. The way you showed how interactive components work seems much easier to learn. Please make some more videos on how to improve and scale the designs.👍
Awesome. This is a nice solution. I am looking into something similar but I would add a challenge / complexity by allow the color part to allow for users to tap multiple colors at once
This might be another random comment around here but I've been watching a lot of design tutorials on here but not once did I try to actually apply those. Well, you sir changed this for me. Subscribed, and on my way to buy the course! Such a breath of fresh air :)
@@mdsnotavailable I don't make videos, unless I'm annoyed, or representing info. But you might appreciate this early Figma video I made (which had to be made back then sadly) ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-Nz7Ww1sGdEE.html&ab_channel=ReichartVonWolfsheild Firma is getting better and better, which is rare in software these days.
Honestly, this would take less than 2 minutes to do once you know what you’re doing (Matt, it’d take you probably about 15 seconds without talking). Absolutely no point in changing design tools, saving time and money. Thanks for the video!
@@mdsnotavailable I’ve been following your content for a long time and I’ve finally signed up for the next enrolment of Shift Nudge. Thank you so much for your work Matt, all the best.
I'm really hyped to start Shift Nudge in a few days!!! Keep it going Matt, you're really inspiring dude. P.S.: Yes, please add the office renovation video! 💪
I avoided Figma for years and after losing my design job I finally have time to look at the tools that have come out over the last five years. When I started my job I used to have time to research and keep up. I maintained and designed websites for a company for 13 years. After five years the work load became so great I was working ten hours a day six days a week with barely time to breathe. In retrospect I should have quit but you know how it is.
I'll say you should post but not sure if you should post it on this channel coz when people search for design videos it could be that the algorithms start pushing your channel behind other design channels just coz you post fun stuff too. I don't know how yt works but I am pretty sure that with more automation yt engineers too find it hard to understand recommendation feature of yt. Btw awesome video man subscribed within 5 mins.
This is the absolute shit!! Thanku! Been searching for hours for a tutorial on how to do this (was needing to do sizing buttons XS, S, M, L).. Mind blown.🤪🤯
yes please you can post a vid of office renovation here it’s totally cool!!! keep everything in one place, you can create a new playlist for stuff that are not design related! okaay bye! I’m your biggest fan I guess😂❤️❤️
Super great stuff, love it. Would be interesting to see if making a number choice could affect which colors are available to be selected. I'm thinking of a scenario where you select a t-shirt size, but not every size is available in all colors. Simple use case, more complex interaction.
You totally could, but would need to combine the color and number variants and create a “super variant set” that contained all possibilities. I would probably only do this for one combination to show how it would work (to get buy in from stakeholders) and not build out every version. 👍👍
Thank you! I've been searching for a multiple choice type tutorial. How much more complicated is adding a hover state? I know radio buttons can only have 2 states. I am almost done with my bootcamp, so a baby UX designer but eager to learn. Any response would be greatly appreciated!
I have been sqeezing my brain for hours on how to do this, thanks fo the video man, great stuff! I also would like to know, how could you insert a hover and click in this situation?
Hi, MDS, this video is sooo great!!! But one thing I still don't understand is the prototype. When I click number one, why the number one show up in the blue circle, not the number two or three. My confusion is number one is connected to the component which contained 1, 2, 3, and why only number one shows up?
Hi MDS, thank you for this amazing video but I have a little quetion : I am struggling doing a full custom from scratch calendar in figma and all those connexion are insane when you have 31 days multiplied by 12 for all the connexions.. How can I do that ?
My first question would be to ask why you want to do that? I would ask you to consider greatly simplifying what you’re trying to create with a Figma prototype.
has anyone really tried? I cannot link to the a variant set, only to the elements inside ... I was trying to build a star rating prototype following the same principle ...
Awesome video! Thank you so much. I have a question and I'm really desperate with this... there is a way that I could click on a button that it's inside of a box of Interactive components, and when I click on it, navigate to another screen? For example, I'm on the web, on the Home screen, but I wanna go to a Profile screen, so I pass the mouse over the button and happen all stuff I establish on the Interactive component, but I wanna add the property that when I click on then, navigate to Profile screen. I don't know if I'm making myself clear.
the short answer is: put your hover interactions in a separate component, then put those instances into a nav group component and link those instances to the pages, not the rollover ones... the long answer is: just made a video about this and should have it up later today. =)
Make sure you're enrolled in the Figma Beta program first as it's currently a beta feature. More info on how to do that here: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-slmLyaolF50.html
Great stuff! Thanks for that! 😁 But if I want to carry the user to another screen with only the selected number and color, how can I do that? Like, the user picked 2 and yellow and clicked on "next", how can I make it display only the number 2 and the yellow color?
That would be tricky. You could fake it by transitioning only some of the screen content to something different by linking it to the "next" button, but what you're asking would be much more logic based and might be too difficult.