4 Tricks For Best Figma To Framer Export

[@TimGabe]

link to the Figma file 💜: www.figma.com/file/Wwa4YMB39SZwiNgwUfmChH/Figma-to-Framer-Export?node-id=302%3A741&t=sIJgGobu0kSZuH9k-1

[@martalaw100]

I love all of your content, Tim. Thank you so much for making it so easy to understand. I'm currently trying to import a drop-down content information FAQ style into Framer from Figma, and I'm not able to. Do you have any tips on how to do it or if it's even possible? Thank you very, very much.

[@TimGabe]

thank you marta!! unfortunately you can't copy-paste it over with functionality, but the best practice would be to build it with proper auto layouts in figma (make the structure perfect) and then copy it over. after that you can create a separate component for it in framer!

[@hectorwearden202]

Great tips. Loved the last idea about treating everything like lego pieces. So much easier to break the design apart into components and then export. Much easier to update and upgrade modularly in future too.

[@TimGabe]

happy it resonated with you, Hector!! thanks for commenting 🤩

[@jskprakash]

Thank you so much Tim! It's really help for exporting. Great Tutorial

[@TimGabe]

so cool to hear that you found it helpful JSK 🤩🙌

[@xhongaronga]

This is so freaking cool! I'm stoked to try Framer when it's time for me to build a portfolio site. Great tutorial, Tim! I'll definitely be coming back to this when it's time to create. Keep the tutorials coming, my dear friend!

[@TimGabe]

Erman, my brother 💜 appreciate the nice feedback as always!! I'm planning on really ramping up the Framer tutorials these coming weeks, so hopefully there'll be a ton of material for you when it's time for the portfolio 🤩

[@xhongaronga]

@@TimGabe That would be sick! Do you plan on covering Framer animations in the future? That's one of the aspects I'm really looking forward to trying.

[@TimGabe]

@@xhongaronga yes, that’s one of the videos in my upcoming Framer series 🤩🙌

[@xhongaronga]

@@TimGabe Looking forward to it then!

[@cosmiqdesigner]

Great tutorial. These surely makes exporting easier.

[@TimGabe]

really appreciate it Cosmiq! 🙏🥳

[@piliq3774]

Nice that you included the Figma file!!!

[@TimGabe]

appreciate the comment and the support, my friend 🤩

[@OPE-kc6dp]

Good day, great video. I have a question and I would really love @tim gabe response. I started UI/UX just last year and Figma is the only major designing and prototyping tool I know of. Please I'll like to know if I should stick to figma for designs and prototype. or do i learn framer and invision and protopie as well. Like I need to know if I should be adept in other design softwares as well

[@TimGabe]

I can only say what I would do, and that would be to learn Figma and use that as your go-to design tool for everything DESIGN. then, if you want to kick ass with web design, Framer is going to be your best friend as a designer in 2023 and onwards 😃

[@OPE-kc6dp]

@@TimGabe thank you so much, you're awesome

[@leamendes6422]

Great tips, thank you 🙏

[@TimGabe]

happy you liked it, Léa! 😃

[@brianniwoyda]

Thanks Tim but I have a questions... Can I do this the other way around? Can I take a design from Framer to Figma?

[@madamecelindra]

Thanks for your videos! Is there a possibility to import your figma grids into framer or set them up there? I mean like the 8pt grid, not the framer grid /stack system^^

[@TimGabe]

if you go to menu > view > show guides you can play around with that 😃

[@jolenekk]

Hi Tim, I have been following your Figma videos and that got me interested in Framer. I was wondering what your thoughts are on designing directly in Framer vs designing in Figma first.

[@TimGabe]

hey Jolene! for me, using Figma for the design parts is still the most convenient since I'm not doing only web design. however, if you're doing just web design and don't need more advanced vector graphic tooling etc., then I think going straight to Framer is definitely an option 🤩

[@jolenekk]

@@TimGabe That makes sense, thanks Tim. I think for now I'm going to focus on setting up files in Figma that are ready to export to Framer and then move to working directly in Framer. Knowing both is definitely advantageous. Have a great live! 👋

[@carolinadelsur6411]

great tutorial! thank you so much. could you explain how does a text layer resize at a certain breakpoint, as you mention in 4:11?

[@drakZes]

Thank you for the video. For the 1st tip you say set up auto layouts before going to framer, but isn't it easier in framer to set up the stacks there than working with Figma AL?

[@DhirajKyawal]

What an amazing tutorial!

[@TimGabe]

that's so nice to hear! thank you, Dhiraj! 😃

[@DhirajKyawal]

@@TimGabe My pleasure! This video should be watched by every Figma designer, even if they are not planning to develop it further in Framer, as it’s filled with good design practices which will lead to smooth developer handoff

[@davecelot]

Really nice video! I'm not that familiar with Framer and this is my first time watching something related to it. However, I'll be there when you release the Framer series! 😌 Pd. I teach UX/UI Design and for everything related to Figma I recommend your channel to the students.

[@TimGabe]

thank you so much Diego! 🙏 I think you’ll fall in love with Framer real quick. releasing another video this coming week ☺️ that’s awesome to hear. really makes me genuinely happy to see that my content is appreciated like that. thanks again, my friend 🤩

[@des7638]

Awesome thank you

[@TimGabe]

thanks a lot!!

[@karimvenom6459]

How do you transfert compinents from figma to framer keeping the same type of interaction

[@elysiumcore]

Thank you for this - i skipped this step and ended up with a mess 😂 - going to clean up my design figma file and will get it right

[@TimGabe]

good luck my friend!

[@boxeris729]

Can you export Figma animations/prototypes as well?

[@diogos7233]

Do websites built in framer load fast? How does it compare to webflow in regards to load speed?

[@TimGabe]

hey Diogo! I’m not by a computer at the moment, but you could go to Framer.com and pick any of the Framer Awards websites and put them into a speed test site. 😃

[@REA-888]

Can you export from framer to figma?

[@TimGabe]

unfortunately not...

[@doupecan3834]

Why do you use Framer over webflow? Do you ever find yourself hitting the limitation ceiling of Framer?

[@TimGabe]

there are definitely drawbacks to framer and webflow is increeeedibly powerful, but you can still achieve most things you want in framer if you just use third-party integrations 😃 so in terms of limitations, i don't really think that is a huge problem, and if it is in some cases (for very big and complex projects), it'll be less and less of a problem as the tool grows