I Taught Framer Website Animations to a Subscriber

[@mland22]

Nandi, what an awesome session together - really enjoyed the one-on-one. You have a wonderful way of making anything Framer easy to understand and implement. Great to be part of one!

[@framer.university]

Thanks a ton, Michael! I'm stoked you enjoyed the session, and I hope that, now it's been shared here on KZbin, others can learn from it too.

[@FloNocode]

Thx for you share your session this is useful

[@Akash_Chopperla]

Are yo michal landon jr

[@Akash_Chopperla]

Are you michael landon jr

[@cp3onmtv963]

Have to give you MAJOR props for this. Not only is this a cool animation that I dont see everyday, you also made it easy to follow along not only by watching but by the supplementary info you give while talking. Next, instead of just saying "oh you can do this or that for mobile" and moving on you actually took a few minutes to SHOW how that could be achieved, because that was going to be the question I was going to type instead of this lol. This is great for web but obviously the hover would not work for mobile/tablet. Anticipating possible issues like that one and giving a solution is definitely setting you apart from others. Keep it up! (you should make this a series by the way)

[@framer.university]

I’m super happy to hear you enjoyed this format! I might make more of these :)

[@JulianHowsonmedia]

Please make more videos like this! I haven't even watched it but the reality is that it' s never as easy as you make it look Nandy and we will often run into problems!

[@framer.university]

I also run into problems! That's the nature of website building. I just try to plan my videos carefully so we don't waste time with trying to debug.

[@garishanth]

This is great to see man! 👏🏽

[@framer.university]

Thanks! :)

[@emm5582]

ABSOLUTELY well explained!!! Thanks for sharing!!!

[@framer.university]

Happy to help 🫶

[@ProNoobDev]

This was cleaaaaaaaaaaaan and informative ! thanks

[@framer.university]

Glad it was helpful!

[@Michael.design]

Hey Nandi, since you’re the master of components, it would be really nice if you could do a video or a twitter thread on how to organize them. I’ve noticed my components are scattered all over my Framer workplace: primary components that are in many different projects, not knowing which ones are in the library, unable to identify the ones in the library, how to go about making changes to them, do I unlink instances or do I go back and make changes to the primary first, etc etc. Since you’re managing so much of them I wonder if you have a way to do this neatly. Maybe you keep all primaries in one single project? I think it would be very helpful to alot of people out there! Thanks a lot in advance if you ever want to shine a light on it. Youre doing great work!

[@framer.university]

Thanks! This is a great question! I never really add components to the library. I create new components for each project. The components that show up on all of my demo sites (navbar for example) is housed in a template that I just duplicate each time I create a new demo. Also you can organize components into folders within projects like “Elements/Button”. It’s also really useful. You can definitely add component to your library if you wanna be able to easily reuse them across different projects. You can browse what’s in your library with ⌘ + K and the searching for “browse library”. You can also “unlink and replace“ components brought over from other projects if you want to make changes to them that are specific to the project you’re working in. If you rather need a global change for the component, I’d navigate back to the project where it originates from (where you have its primary instance) and edit it over there so it will update across all your projects where you had used it. In this case you usually have to go back into each project and click the little update button next to the component on the assets panel. Lemme know if you have any more questions.

[@Michael.design]

@@framer.university Thanks a lot for the elaboration! Insightful to know how other people do these things as they're less often talked about. I find myself often just copying and pasting as well from other projects, even whole pages. I guess it's just a natural and easy way for most folks. Would be nice in the future if Framer would make it easier to organize components, maybe with previews or something like that. It's hard to remember what a component actually looked like just based on the title. Maybe some way I haven't thought of yet haha. For now we'll make it work somehow:) Again, appreciate the help!

[@ArifurRahmanHridoy-j4e]

Thank you so much :)

[@framer.university]

Happy to help :)

[@elias4314]

Hey, when is the course gonna release?

[@FloNocode]

Ahahah definitely !!! 😂

[@framer.university]

No exact date yet. Working on other things atm. Stay tuned tho :)

[@FloNocode]

@@framer.university that will be cool to make live stream in youtube sometimes

[@FloNocode]

Your are the G.O.A.T ! THANKS for this video. Can you make this animation in bento box design please and explain how use that in bento pleaaaase.

[@framer.university]

I'm glad to hear that you enjoyed this tutorial! I may create a bento box tutorial in the future. Meanwhile, it would be great practice for you to try it out based on what you've learned from this video.

[@filipegoncalves3038]

Thank you Nandi 🤠

[@framer.university]

My pleasure ✨

[@DeWetikus]

This was great!

[@framer.university]

Thanks! :) i hope u learned something

[@DannyBlicher]

Wow really good video! When to use stack vs frame?

[@framer.university]

Prioritize stacks. Watch my latest vid.

[@SoumikMallick123]

Courseeeee please.....I'm waiting for a long time....Launch soon as possible.

[@framer.university]

Will do buddy! Stay tuned :)

[@zilhaj-4291]

I also waiting from Bangladesh

[@user-anum702]

Awesome as always Nandi🔥Hey i want to know about thr launch of the framer university course

[@framer.university]

Thanks! No exact date yet. Sorry! Stay tuned:)

[@AnooBav]

Just what I was looking for, answered a few questions I was having regarding something similar. However, I have a question. Why did you create another variant instead of hover/pressed state feature of Framer for hover interaction?

[@framer.university]

Glad to hear it. Because for the hover states I had to also specify the card's width in percentages which is relative to its parent frame (the wrapping container) and that's why it can't be set within the card component. Does this answer make sense?

[@AnooBav]

@@framer.university Yes, make sense. Guess I don't need to stick with the hover state for every component. Thanks again.

[@jazzeeblaze]

It should have been me.... 😢😟😞

[@framer.university]

Feel free to schedule! 🫶