â–Ľ
Streaming live at 10am (PST)

Webflow vs Framer X


#1

Hey guys,

I was wondering if sombody could explain in details what are the main differences between Webflow and Framer. I am looking for an app to design interface elemets that could be exported in code to be reused on my website. As far as I understand both apps are capable of doing it, but what are the main differences. What would you suggest to use in my case?
Cheers!


#2

Framer and Webflow exporting are not even on the same planet.

If you’re looking to design individual interface elements (graphics, buttons, etc.) then I BELIEVE what you’re looking for is Framer/XD/Sketch. But if you’re talking about designing things like interactive menus, then you’re firmly in Webflow territory.

Webflow builds your HTML/CSS/JS files while you design your site/component visually. Once you’ve created it within Webflow, and it works the way you want, you’re done; there’s nothing left to do but export the code and drop it into your website.

Framer et al allow you to export individual element’s CSS properties, or graphics that you’ve created, but nothing like an interactive component or an actual web page.


#3

Thx for your answer. Let’s say I am working on a project, and I need to design some rather simple interface elements (HTML, CSS) to hand over to the developer to implement them on the actual website. In Webflow I can easily design and export what I need. But I keep hearing about Framer being used for designing interface elements. So, I was wondering if there are any real advanageous in using Framer over Webflow.


#4

The pair seem to compliment each other quite well. I have not looked at Framer in sometime but I notice they now offer React component export.

I suppose with Framer you could design React based components and import them directly into your Webflow project, which will be a very powerful combination.

I plan on looking into this more closely.


#5

Thanks for creating this thread and thanks for the solutions too. My issue got solvedin a minute just for this. Great help


#6

Hey Josef,

Thought I’d add to this also…

In your case since you’re not actually deploying the site or building it into the site, you just need a good method to hand over assets along with the HTML /CSS to your developer. There are a few ways to do this…

If I was doing this, I would design in a platform like Adobe Xd, and then re-build these in webflow for export. I’d potentially be doing it differently if my developers & I weren’t as comfortable with both these platforms.

Another way you could do it is -

Through a platform like Zepplin, to asset manage design exported from XD for your developer. OR you could use something like Framer X which I believe covers the design & the mark up code on the same platform.

I think overall, Framer X is good to reduce your hours, but exporting the code on webflow would probably be the most appreciated method from a developer and the most guaranteed method of success.

Hope this makes sense :slight_smile:


#7

Thx for your replay. So, let’s say I want to design a landing page for my website, and then send it ti the developer to make the signup form working properly. Whould you rather go with Framer X or Webflow?


#8

For that you’d be looking at Webflow.