Видео

I'm happy to hear it! Hopefully you find the video helpful. If you have Figma related questions let me know

Perhaps you've made changes to the instance directly, so it seems out of sync with the parent component. If this is the case, you can right click on the instance and select `Reset all changes`. Then it should update. Try to make the changes directly to the component and create variants instead of changing the child instances directly, if possible. Not sure this is the case, but I hope this fixes your issues.

Do you mean working on OneExercise or in general. In general it's hard to say, since i've been doing it on and off, but for the past year It's been pretty much almost all i do.

It takes a lot of time. I've been busy working on other things, but will try to come back to it.

Hey, sorry for the late reply! Not sure what you mean really, do you mean how to use the Material 3 components directly without using them as a base for your custom components?

You're welcome

شكرا علي الاقتراح بفكر فيه فعلا لكن للأسف مشغول حاليا

Sorry for the late reply. I resized it because I chose a specific size for the design of my frame (which is the size of a specific mobile device), and by using constraints it will follow the size of the frame anyways. So if we choose a new device with new size the android frame should just change accordingly. I hope this makes sense. But since we want it (the Android frame) to follow our device frame around thus we resize it and apply constraints to it to stick to our device no matter what size we change our device to.

Sorry for the late reply, haven't been here for a while. It is hard for me to tell without having a look at the file, but I have found that Figma prototypes are sometimes buggy. Hope you solved the issue.

Nice! Happy your found it helpful

Yup. This was a mistake 😢😔

Hey Jodi. I just checked and it doesn't. But you can do in a couple of extra steps. Let's say you selected your frame opened the responsify plugin and ran it, selecting iPhone. You'll get 4 new iPhone frames. Then you can from the 'Design' panel while having all 4 frames selected, change the frame orientation to 'Landscape'. But then everything will be broken, because Responsify wraps your original frame into an iPhone frame, and it has no constraints. So before you change the orientation, press enter to select all the frames inside the iPhone frames, and add left & right, top & bottom constraints from the design panel. Then when you change the orientation it will work. This might seem a bit complex but it can be done pretty quickly. Here are the steps again if you found it confusing: 1. Select the frame you want to responsify. 2. Open the responsify plugin, and press on run, then choose the device type. 3. Duplicate the frames responsify gave you. 4. Press Enter (to select all the frames inside the new device frames) 5. From the design panel add Top & Bottom, and Left & right constraints. 6. Press on the Canvas to deselect the inner frames. 7. Select all the frames you just duplicated again. 8. From the design panel change the orientation from Portrait to Landscape. The frames will be on top of one another so you can from the Design menu, alignment options, select 'Tidy up', then the option to change the spacing between will pop up in the Frame settings. Make sure it's a positive number and they won't be on top of each other anymore.

You're welcome. Happy you're find them helpful. And thanks for the kind words. Really appreciate it.

All responsify does is test many devices quickly. So you can avoid using it and test your frames manually.

Happy you find them helpful. Been busy lately but planning on making new vids, soon I hope. Will try to squeeze some responsive mobile design vids. Thanks for the feedback. Really helpful.

Hey Gabriella. I'm happy you found them helpful. Thanks a lot for taking the time to leave a comment.

I agree. 😞 One of my older and very first vids. In recent ones I keep the background low-key or use none. Thanks for the feedback.

Hey Showbik. I've never used the scale tool before, so I need to have a look at it. But I'm also not sure what you mean by make them all in one. If you mean that you create multiple separate frames for the same design and want to put them into one frame. I don't think that's possible in Figma, as far as I am aware. There are workarounds to present them into one frame using break points ( I talked about this in the make a design fully responsive in Figma using breakpoints (ruclips.net/video/3KUZ3o0ddcE/видео.html)). But this is just for presenting inside of Figma. While coding you'll have to use CSS media queries for certain widths ranges to be able to make it responsive. The reason I use auto-layout is under the hood it uses CSS's Flex-box. This makes a frame automatically adjust it's size when the size of it changes and also when you inspect the frame inside Figma you get CSS code that you can apply into your code. But still you'll have to resort to using media queries while coding. Check out this video (ruclips.net/video/2U750Bd3CbM/видео.html) where I talk about How I coded my website's Figma design, you might find helpful.

Danke.

Thanks man. Happy you're find it helpful.

You're welcome. Really happy you found it helpful. If you're still having trouble with it let me know. I'm still exploring but perhaps I could help.

Thank you

I agree. It would really be nice if breakpoints work in Present mode. Never tried Webflow but now I'm intrigued.

Responsive web pages is Webflow's turf to begin with. Figma's main purose isn't making web pages, I dont think webflow with drawing tools makes figma useless.

@@jayt3972 I'm very clear on what Figma does and doesn't do. I've been using Webflow for over 6 years, Adobe XD for 4 years, and I've been using Figma day in and day out for almost a year now. I've been a web designer for over 23 years. The issue with programs like Adobe XD and Figma is they only allow for HALF of the web design process. The other half is the HTML/CSS code that makes the page. I live and breathe web design every single day, and as I said from an obvious point of experience... if Webflow had similar drawing tools, then Webflow would render Figma useless overnight. Being a good web designer is not just about the design process, it's also about understanding and being able to work with code. You'll never be a good or great web designer unless you fully understand and can work with BOTH design and code.

Thanks!

Hey Toan. If I understand your question correctly you want to have your components in a separate page than your design. The reason I keep them in the same file because I can make my prototype connections on the component directly and all its instances will have the same connection. You can have your component in a separate page, grab an instance of it into your design file, first make the connections you want then copy it into your different design screens. For example If you have a header component in the components page and you want the home button to navigate the home screen that you have in your design page, you can grab an instance of it into your design file make a prototype connection to navigate to the home page when the home button is clicked, then make copies of this instance in all your pages, then you can remove it. However if you decide to update your connection or make changes to the animation for example, You'll have to make them manually to each header.

Thanks!

Sorry. It's just a part of longer vid. You can watch it in full screen here: ruclips.net/user/shortsAFYwccZy0Ks?feature=share

Hey Reema. Sorry for the late reply. Currently I just use the Figma frame presets. If I come across a better plugin than `responsify` I'll let you know.

you're welcome

Thanks!