Пікірлер
@0Kyron0
@0Kyron0 9 сағат бұрын
whats the need of the two duplicates of the text file?
@wyarn
@wyarn 16 күн бұрын
wish you the best, I learned a lot from this, even clipping content and cmd+y thing! I think it'd be a lil bit better if you could add the projects in timeline. like first one starts at 1:35 etc.
@unknownentity648
@unknownentity648 21 күн бұрын
Dam, im completely novice to figma, i followed everything, i even play the vid in 0.25 but unfortunately it did not work for me 😢
@unknownentity648
@unknownentity648 21 күн бұрын
Never mind, it worked! So, here's what I did at 4:45: I used CTRL + C and CTRL + Z to copy and paste, which was wrong. The solution is simple-you just need to hold ALT and drag, and it worked! HAHA 😅
@Ashi-z7g
@Ashi-z7g 23 күн бұрын
Thank you... 1. Smart Animate 2. Instant ( don't use smart Animate for both ) I spent hours here not knowing that this was the issue
@CarlaPerez-g6v
@CarlaPerez-g6v 25 күн бұрын
Once it hits the 4 variant, it bounce back and rotates in reversal, any idea how to make it really an infinite loop?
@epramatarov
@epramatarov 29 күн бұрын
Bro, you lost me. Just slow down a little, not everyone is a pro like you..
@jonathanwaterworth
@jonathanwaterworth 29 күн бұрын
Sorry mate, I get too excited talking about Figma 😅 will keep learning and try slow down in future videos! Thanks for your comment ✌️
@rootdeyan
@rootdeyan Ай бұрын
what about dropdown with scroll option with more selections?
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Thanks for the comment! Yep totally possible, I will add it to my list to make videos about. You need to have an extra wrapper for the content and change the 'scroll behaviour' settings in the prototype tab, you can follow this kind of method to get it to work help.figma.com/hc/en-us/articles/360039818734-Prototype-scroll-and-overflow-behavior
@herastudio543
@herastudio543 Ай бұрын
Hello, at 1:28 every time i try to drag my text box to the edge of the frame, it shifts my text & icons. did you do anything for your text shape to not change? thank you
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Did you group the auto layout frame? Check your side panel layers look the same as mine
@Funnyplanet818
@Funnyplanet818 Ай бұрын
what about fluid layout?
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
what do you mean?
@michaeldavid6276
@michaeldavid6276 Ай бұрын
It just blinking here
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Check that the layers are named the same
@jyotipoojari2340
@jyotipoojari2340 Ай бұрын
It would be great if you could upload a full video of this as it would really help beginners follow along more easily.
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Thank you for your comment, will add it to the list of videos to make 😄
@tranang1259
@tranang1259 Ай бұрын
THANK YOU SO MUCH YOU DON'T KNOW HOW MUCH THIS MEANS TO ME RIGHT NOW😭😭😭 I have been struggling and struggling with components and variants but with only a 5-min-long video of yours, my life is saved 😭😭I truly appreciate this
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Thanks so much! I'm glad I could help 😁
@GeoffroyGaborieau
@GeoffroyGaborieau Ай бұрын
this is great and very nicely explained. Thanks a lot for doing this.
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Glad you enjoyed it! Any other things you want to learn about Design Systems?
@juniorrpk3244
@juniorrpk3244 Ай бұрын
ok vc fez a copia e como faz isso? horrivel essa video aula. Odiei !
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Desculpe pelo incômodo. Qual parte você achou que não fez sentido
@davejeanclerc3066
@davejeanclerc3066 Ай бұрын
Thanks so much for this simple approach to making a dropdown. If I wanted to have multiple dropdowns on the same screen, each with their own distinct options, would I just duplicate each of the three key components? Thanks again!
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Thanks for the comment, Dave! Yes, that would work. You can place the instances on your page, open them individually, and fill out the menu options for each one. Then, set them back to the default variant so that when a user opens them, they will display the correct information.
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
A quick tip to avoid an issue I often run into: make sure they are the same width. If they have different widths, you might encounter a strange issue where the dropdown expands inconsistently when opened.
@sturm_wind
@sturm_wind 2 ай бұрын
Day fault?
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Not sure what that means sorry?
@Khelekwen
@Khelekwen 2 ай бұрын
A little more slowly with some more detail would be appreciated. I'm a Figma novice and trying to use this to learn something new for work but navigating FIgma is still difficult for me so following along at this speed was a challenge. Also, using the circles to show mouse position before click would be a tremendous help for me! You moved so fast from one thing to another that I couldn't even see what you were clicking on half the time. A bright colored cursor would also help to keep up with where you are in the menus (I use red or High Vis Yellow during presentations at work). Lastly, break out the steps more. When I was taught in elementary school how to teach or explain things, we had an exercise of teaching someone to make a peanut butter and jelly sandwich who knew nothing and only just popped into existence. You had to break down opening the cupboard, taking out the peanut butter, placing it on the counter, opening the lid by twisting it counterclockwise while holding the jar in place, opening the drawer, taking out the butterknife, etc. Simply saying "put peanut butter on one side of the bread...etc." was inadequate as they didn't know how to get the bread or peanut butter. If you take this type of mindset and speak to and point out every selection, I think it would help newbies such as myself quite a bit to learn from you. Beyond the critique, I really appreciate you making this tutorial and will watch it a few more times to try to create the menu. I've still not been successful as it seems every few steps it just isn't working for me as I see it happen on your screen and I don't quite understand why. I'm sure I'm just missing a step that you did or something isn't set up correctly but it's started to frustrate me.
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Thank you for your thorough comment. I’m always trying to learn and improve!
@VictorAlejandroOrmenoHidalgo
@VictorAlejandroOrmenoHidalgo 27 күн бұрын
@@jonathanwaterworth yes man try to do it again but slower haha anyway good video
@lilou8711
@lilou8711 2 ай бұрын
Super vidéo merci
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Merci d'avoir regardé !
@gloriacassidy
@gloriacassidy 2 ай бұрын
Thanks 🙏🏼
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Thank you!
@chind0na
@chind0na 2 ай бұрын
Free to use while they iron out bugs😂
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
This is true! I'm waiting for the email eventually saying how much it will cost as a add-on 😅
@lindamaile
@lindamaile 2 ай бұрын
this was so helpful. thank you so much!!!!
@jonathanwaterworth
@jonathanwaterworth Ай бұрын
Thank you!
@elizabethmorello-v9t
@elizabethmorello-v9t 2 ай бұрын
thank you very much. it is always nice to hear about books that have inspired other designers.
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
thanks so much!
@EcstasyJPEG
@EcstasyJPEG 2 ай бұрын
Thank you big bro
@davidvicencio1293
@davidvicencio1293 2 ай бұрын
AI beta feature is being gradually released for user in the wating list. Is not available for everyone right now.
@gasparcho
@gasparcho 2 ай бұрын
This is a great tutorial but how would you get the dropdown to open without pushing the other things underneath it down if you use auto layout. i.e. I have a dropdown in a big auto layout component and when I go to the prototype and open the dropdown it pushes everything else down. I see you didn't use auto layout so do you have any suggestions on if you are.
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
This is an annoying limitation i've found with Figma, there isn't a great way to do it within frame You can make the menu that opens position absolute, so then it doesn't push anything down BUT if it's within an autolayout frame it will go behind the items below it If this is something you need to test as example a filter menu with lots of dropdowns stacked below each other, I'd recommend not putting them all in an autolayout frame that way you can get the function of opening them and not affecting the items below
@gasparcho
@gasparcho 2 ай бұрын
@@jonathanwaterworth Yeah that is what I ended up doing. I used auto layout to get everything pixel perfect then detached that and grouped the elements together and it started to work. Thank you for the help tho!!
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
​@@gasparcho Great to hear you figured it out! Yep thats what I normally do, it's an annoying limitation of the way things 'stack' in Figma!
@LexieABr
@LexieABr 2 ай бұрын
Is it possible to link the individual items to different frames? I.e. if we select "Item 1", it takes us to "Frame - Item 1"
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
Yep this is possible, I could make a video on how to make a menu like this, would you find that helpful?
@saleksieva
@saleksieva 2 ай бұрын
That would be awesome! Yes, please!
@LexieABr
@LexieABr 2 ай бұрын
@@jonathanwaterworth That would be very helpful! Yes, please!
@elpedomasgrande1
@elpedomasgrande1 2 ай бұрын
where do i get the wrapper repeater feature. It's not there!
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
It's all getting rolled out to users slowly within figma, so you should have it soon!
@LexieABr
@LexieABr 2 ай бұрын
Hey, thanks for the great tutorial. I am struggling with the variants - I don't think I am clipping them properly but I am not sure how to fix it.
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
Sorry to hear, I'm happy to look at your figma file if you share it and try to help
@LexieABr
@LexieABr 2 ай бұрын
@@jonathanwaterworth All fixed - I just reloaded Figma.
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
@@LexieABr woohoo great to hear!
@LexieABr
@LexieABr 2 ай бұрын
@@jonathanwaterworth PS. Thank you for your prompt reply!
@JahnaviEskala
@JahnaviEskala 3 ай бұрын
I tried it multiple times till now. Why doesn't it work 😢It just doesn't move, there's no animation
@jonathanwaterworth
@jonathanwaterworth 2 ай бұрын
Oh no sorry to hear! Is there anyway I can help you with it? Can you link your Figma file below for me to look at it?
@animehubking1537
@animehubking1537 3 ай бұрын
It's paid tho
@jonathanwaterworth
@jonathanwaterworth 3 ай бұрын
This is true, sorry I didn't talk about the pricing, more focused on what it is. It does have a free option though Nice profile pic, have you been watching 100 year quest?
@anissa1822
@anissa1822 3 ай бұрын
Hi ! thanks for the video, I managed to do everything except that my menu appears as a whole and not item by item (in a drop down style) and it's driving me crazy !! I tried everything, the interactions are set on smart animate (ease out from closed to open and ease in from closed to open)... I don't know what else to do to make it work
@jonathanwaterworth
@jonathanwaterworth 3 ай бұрын
Sorry to hear you are struggling with it! Did you set up the items within the menu correctly? Can you link a Figma file here so i can have a look at what you have done wrong?
@lewto
@lewto 3 ай бұрын
Thank you!!!!
@jonathanwaterworth
@jonathanwaterworth 3 ай бұрын
Thanks for watching!
@nraczynska
@nraczynska 3 ай бұрын
you saved me, thank you for sharing!!
@jonathanwaterworth
@jonathanwaterworth 3 ай бұрын
Glad you enjoyed it!
@A_sudden_stranger
@A_sudden_stranger 4 ай бұрын
Seriously Man ❤❤!!! It's what exactly I want to know
@jonathanwaterworth
@jonathanwaterworth 3 ай бұрын
Thank you!
@Manutd001-jb
@Manutd001-jb 4 ай бұрын
pls how did you break the the text in its own box pls
@jonathanwaterworth
@jonathanwaterworth 3 ай бұрын
Hi there, do you mean seperate the words, so make a copy and then reduce each text box to one word only?
@Manutd001-jb
@Manutd001-jb 4 ай бұрын
PLS HOW CAN I BREAK TEXT PLS ANYBODY PLS
@shifatmasud
@shifatmasud 4 ай бұрын
Shift+A can help to create quick autolayout frame. ❤
@marylinestrama6366
@marylinestrama6366 4 ай бұрын
Need a full tuto 😭
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Will get on it! I've been slowly turning all my shorts into full length videos! Thanks for the comment!
@shifatmasud
@shifatmasud 4 ай бұрын
Figma file please 🙏
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Oh, I hadn't thought of that! I think I can do that. Would you find that helpful to follow along with?
@shifatmasud
@shifatmasud 4 ай бұрын
@@jonathanwaterworth ofcourse 😍❤
@life_Of_Bowie
@life_Of_Bowie 4 ай бұрын
Can you please make another video tutorial about this. It would be so helpful to go through this a bit slower and also show a few more examples. I tried making a frame with a shape blur gradient and wanted to pin that to the background. Then I wanted to add cards into that frame and make it responsive. Could not figure it out.
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Thanks for the comment! Will try to start putting together another video with more examples and make sure I try to move slowly through it 😀
@cjn2109
@cjn2109 4 ай бұрын
Just found your channel and immediately fall in love with that content bro! Keep it up, I'm new here (in ui/ux world) but i would love to give myself a chance in that industry :D
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Thanks so much, that's very kind! It's a great industry keep learning and designing and you'll be sweet!
@diegogarcia-serna9773
@diegogarcia-serna9773 4 ай бұрын
Didn't know about the wrapping multiple objects part! Super cool
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Glad I could help!
@fatjay9402
@fatjay9402 4 ай бұрын
Sorry this is a little bit to fast ... i did first try and it didnt work.. i found my mistake .. ( cliping was still on ) but it was 100% because of the speed.. anyway thanks i learned something
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Thanks for following along! Sorry, I'm still trying to find my 'teaching speed' I sometimes get a bit carried away and move a bit quickly! Thanks for the feedback 😀
@baragoziq
@baragoziq 4 ай бұрын
i didnt have this in new version
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
I think they are rolling it out to more users soon!
@keerthanavenkatraman1471
@keerthanavenkatraman1471 4 ай бұрын
How to export as gif?? I couldn't do it
@MyNickNameIsNice26
@MyNickNameIsNice26 4 ай бұрын
pretty easy, nice! Solved my problem since i've a divided progress bars of indicator and remaining bar with percentage inbetween.
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Thank you glad I could help!
@solomonakinrefon7055
@solomonakinrefon7055 5 ай бұрын
How to make it slower?
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Change the duration in the smart animate panel when you are prototyping will adjust the speed :)
@pavlinamalikova8259
@pavlinamalikova8259 5 ай бұрын
I lostet it when you said create component and in your Figma nothing appeared my variants show under the first one
@jonathanwaterworth
@jonathanwaterworth 4 ай бұрын
Oh no sorry, did you figure it out?
@saleema6308
@saleema6308 5 ай бұрын
good but you used an outer frame to wrap the cards.
@venomousuiux
@venomousuiux 5 ай бұрын
Can it do jamaican rap?
@jonathanwaterworth
@jonathanwaterworth 5 ай бұрын
🤣you send me a video of what that sounds like and i'll check