Why I switched to Framer from Webflow
HTML-код
- Опубликовано: 6 июн 2024
- In this video I dive deep into all the reasons we left Webflow for Framer.
This is an unbiased opinion as I actually love Webflow, but for our use-case Framer was the better choice in the end. It may not be the same for you. So watch this video to find out what will best suite your needs.
Webflow vs Framer: All the pros and cons with zero bias!
00:00 Intro
01:14 Webflow VS Framer as web builders
04:03 Why Framer is amazing for designers
05:37 Is Framer really no-code?
06:58 Design-Led VS Dev-Led
10:26 Pros/Cons of Webflow & Framer
11:29 Conclusion
#webflow #framer #webdesign #startup #nocode #figma #uiuxdesign #webdevelopment #developers #webbuilder #webdesigner
------------------------------------------------------------------------------------------------
Check out @Framer's FREE Canvas Based Website Builder
Sign up here → bit.ly/413WCab
(Affiliate link)
Free Templates: www.framer.com/templates/cate...
Link to Webflow VS Framer Figjam Diagram: www.figma.com/file/w8gHd8SYoG...
------------------------------------------------------------------------------------------------
Check out all the awesome tools in this video:
- www.screen.studio - What I used to record my screen for this video
- www.Figma.com - The UI/UX design everyone loves
- www.webflow.com - The no-code web builder everyone kno
------------------------------------------------------------------------------------------------
Check out these videos next:
Framer Template - Creator Kit - Compete Walkthrough
• Framer Template - Crea...
Framer - 2hr Responsive Web Challeng
• Framer - 2hr Responsiv...
------------------------------------------------------------------------------------------------
Follow me here for more content:
📱 TIKTOK ‧ / buildwithomar
📷 INSTAGRAM ‧ / buildwithomar
🐦 TWITTER ‧ / buildwithomar
🌐 LINKEDIN ‧ / buildwithomar
------------------------------------------------------------------------------------------------
Startups I am currently building:
👉 www.Glorify.com - A VC-backed SaaS design tool startup
👉 www.Together.Design - A productized UI/UX service platform
👉 www.Blitzit.app - a personal productivity tool that keeps you in flow state
![Dimension 20: Never Stop Blowing Up Trailer [Dropout Exclusive Series]](http://i.ytimg.com/vi/xYeXpbHnGEM/mqdefault.jpg)
One of the best comparison videos I have seen so far. I feel that webflow is more overwhelming and time consuming even for a simple website whereas in framer it's more easy and simple even if it lacks some advanced widgets.
Definitely easier for a design-led approach. Great for non designers too with their drag-drop components
How do I embed react components in a Webflow site? As I understand it I can only do a lot of customization as a certified template developer
Damn, you're making a strong case for Framer :))
@@alexhartan For designers to create simple front facing sites, yes. But I am not ignoring the fact Webflow is the best for dev-led sites.
@@BuildwithOmar Hey Omar, thanks for this video. As a designer, I've tried to learn webflow but the learning curve is quite steep. However, I was able to design and build a website on Framer in the the space of one afternoon as the skills are transferable from Figma.
wonderful breakdown! Thanks for editing us in 💜
Omg, this comment is a great moment for me! Thanks team Ran Segal! 🧡
Can you imagine it’s not a team it’s me? 🤯@@BuildwithOmar
Damn, moment just 10x’d 🔥🔥🔥
This is such a great compariosn video, thank you for giving your time into this!
Awesome comparison video Omar, very clearly articulated on ideal use cases and benefits to different development approaches.
As a dev and designer/artist, I'm gonna stick with webflow, coz i want more flexibility and nerd out more with code. Code is beautiful.
Makes sense, with a dev-led approach your way better off with webflow as mentioned in my video.
Agree I’m dev led too
Yes, it’s really important that webflow allows to export the code, which is not possible with Framer, as far as I know.
you can override any component with Typescript and import any React/typescript component with Framer. There's even a super basic code editor included
@Hann you can apply overrides on specific canvas element and components, or import an entire React component by pasting code, and even make it configurable through Framer's UI using their library
Fantastic comparison video!! Greta job explaining how they suit different needs!
Great overview mate. Really helped me decided!
Thanks Omar, such a great comparison video. I was a webflow maxi but this tipped the scales for me, decided to learn creating on Framer and I love it already.
Super interesting! We have a growth marketing agency here in Estonia and we were just about to migrate from Wordpress to Webflow but now the Framer actually looks more interesting option. Thanks for a great video!
This is so WELL PUT TOGETHER
Thank you Omar !! I'm on my journey to aquire Full stack skills and you make more exciting
Thank you. I needed such info - well explained, no BS.
I've been learning Webflow so far, but now I am testing to learn using Framer, and it feels more accurate when I design from one platform to another, like in this case. It feels so nice and flawless so I think that I will stick to it. Thanks for this video Omar!
This was the most helpful comparison of these two platforms for me. Many thanks! ✨
Holy moly! Out of nowhere you showed up in my feed! Glad to see you still active. Never considered framer.. Will check it out... Really happy to see you still pushing forward. ❤
Hi buddy, thanks man. Long time no speak! 🙌🏾 🧡
I don't know how to thank you! Keep making these videos, they are very informative and helpful.
Well, finally someone puts together a decent comparison rather than leaving it in the air. Thanks
Great quality video Omar. Thank you.
Awesome and to-the-point explanation, Good work Omar. I am a Webflow lover but this gives me another thought to review Framer as well. :)
Best breakdown of these tools Ive come across.
🙌🏾🧡
Thanks for this great video, Omar. Fantastic insight and really useful 👊🏽
Happy to help buddy! Appreciate it! 🙏🏽
Great comparison video, thank you for the insights. I've been a web developer for 10+ years and I've finally been curious to try some professional "no-code" tools. Thanks!
Thanks buddy! If it moves you faster why not right?!
As a Developer who is looking forward to freelancing making landing pages this video helped me A LOT. Gonna give a look on both platforms but aware I’m probably gonna stick with Webflow. Thanks!
Happy to help! 🙏🏽🙌🏾
Hey man can I get your Instagram
Hey ! I got a prob, after adding Interaction to a Button and when i checked while previewing it , The button got disappeared, I pressed on the place where the button was placed before then it came into that place while previewing , and every single time while previewing it I have to do that , IS THERE A SOLUTION?
Very well explained. Thank you!
Great presentation! Well done!
This was great! Thanks for sharing.
Very detailed explanation. Awesome! As a junior Front-End Developer, i think i'll start with Framer, coz of its beginner friendly UI/UX. Haven't used Webflow much but 90% of reviews mention that it has a steeper learning curve. So I'll stick to Framer/Figma for now, but learn Webflow on the side.
This was super informative and a very good comparison. Followed based on this video because I am a designer.
Thanks buddy!
This is really helpful! Thank you so much 🎉
happy to help!
This was really helpful. I was having a hard time deciding which of them to learn. I think I'll go with Framer since I'm a UI UX designer. It seems it would be easier.
Exactly, perfect for a designer led approach. Although if your building sites for clients, be mindful of their goals… they may need more scalability and ownership found within the dev led approach!
Thank you for making this video.
I was looking for a better alternative to WordPress and Webflow just seemed too complicated for me, I was planning on switching later in the year until I watched this.
I'm busy learning Framer now, it's different to WordPress but I'll get the hang of this. Thanks again Omar!
Happy to help! Hopefully will be releasing some beginner tutorials soon!
Thanks Omar for clarifying the differences between these two no-code web-building rivals. I am a digital designer based on Figma and was in confusion for many days either for Figma to Webflow or Figma to Framer, so now I can decide better my way. 👍
Glad I was able to help your decision process, what are you going with in the end?
@@BuildwithOmar Well, I had already covered a few Webflow basics so now I'll look into the Framer's basics as well.
@@UmairUlhaque webflow figma plugin is game changer
What are you using now? Webflow or Framer
Thank you Omar, that was super helpful!
Happy to help 🙌🏾
Great video and very insightful, thank you for taking the time to put it together. SEO is still very important for many customers and I noticed that this was not mentioned for either platform. Do you have any experience of the SEO abilities on both platforms?
I am a senior developer and I don't use any no-code tools, but as someone who wants to make sure I am not missing any opportunities for quick freelance jobs, I am starting to check both of these out! I can immediately see a few CMS drawbacks in comparison to any custom build on something like Wordpress though. It's going to be a case of finding out what each platform is suited for. From what I can tell so far from Framer, it is a landing page creator, but I am hoping to be proven wrong and will see it can do a lot more than that
wordpress is dogshit lol
Great content man, thanks !
Very nicely explained!
That's just what I needed to know!!
Good comparison, well done... 👍
Wow, this is such an amazing video!! Thanks so much for this.
Do you have any updates to your thoughts since it has been a few months?
I’ve been waiting 10+ years for something like this. My clients are all moving to static sites again so this is timely. I buy all your courses, thank you… Go Red Sox!
This was one of the best overviews I’ve seen on this topic so far. I'm a designer who's looking to rebuild my personal website, and I'm looking for a good low-code solution. Framer has a lot of advantages to webflow...especially acting more like a classic UI layout tool. I'd love to know what your impressions are after building with it for 6 months? Have you seen increased overhead or any gotchas?
You sound very amazing! I don't know the moment I clicked the subscribe button. Thanks
This was so helpful 😃
You make it hard for me lol :p I have been contemplating about where to build my portfolio. I started on Webflow and yes its time consuming and these framer-like platforms are tempting!
Very helpful info. A major deciding factor for me is the ability to self-host. Framer does not allow that, but with Webflow you can export the whole site and host it where you want, apparently.
Hi Omar, one of my reasons to build websites is because of producing content and landing pages for starting companies as quickly as possible. You are right, when I was looking for a solution during the pandemic to transition from Wordpress, Webflow was the obvious choice, but something happens after years of using Webflow, you will still feel the need for Figma because I think some people are very creative and free-thinking, that's why Figma is needed separately. Now with Framer, I hope the gap from idea, design, creativity to production/publish gets smaller and smaller. I am now going to try Framer. Please make more Framer videos and become the pioneer. PS even big RUclipsrs who promote Webflow has a Framer tutorial. LOL. Thank you.
How is going for you this day Bugs, About framer ? Just started to learn it this week. Totally new yo website.
@@ARNBNDL I have watched and trained with tutorials. It is not for the faint of heart.
Hi Bugs, I haven’t learned wordpress before, could you tell me why you leave wordpress, could you compare it to webflow. Thanks
@@LinhNguyen-nh8oq They are basically all the same, with the learning curve. You can practically achieve anything the difference is just it is a different way. Wordpress has a lot of plugins, but they are not cheap as well. When Webflow came along, I still missed the creative part so there was a need for Figma. But Framer is like being a kid with a marker and a whiteboard, and you design to your heart's content. Framer is the future of web design, I tells you.
Excellent information laid out very well.
Thanks Kevin! 🙏
Great overview!
Thank 🙌🏾🙌🏾
Webflow isn't really a no-code platform. It's definitely low-code, but what it REALLY is is VISUAL coding. You're literally dragging and dropping HTML elements onto a FIXED canvas and applying styles via classes/IDs and dropdown menus. Webflow is more familiar for frontend developers than designers.
Framer, on the other hand, extrapolates most of the code on an OPEN canvas. It just feels like a design tool by comparison.
Couldn't agree more 💯
Agree!
Webflow is definitely a lot better in this aspect where you could just export the code and use it like any other frontend developer. It's a tool that allows you to upgrade your skill later, whereas Framer is basically a dead end. You have to learn to actually code in HTML, CSS & JavaScript eventually anyways, so for this reason I'd recommend using Webflow for upward mobility.
@@JohnSmith-bs9ym not everybody wants to end up as a developer though
with severe limitations. Simple things seem impossible in framer. It's not there yet. I wanna love it but it's just not great coming from webflow
Great, unbiased video unlike most of the others.
Thanks my friend ❤
Very well explained !
Thanks 🙏🏽
Wow. What an awesome comparison. As someone who's 4 months into webflow , youve just sold framer to me.
Haha not trying to sell, but if your Design-led you cannot ignore Framer for sure!
Nice vid Omar, The blitzit landing page is looking so good! Looking forward to seeing the glorify site built with framer, are you just doing a carbon copy or will you be changing some stuff? I know the Webflow build is still fairly new so it would be interesting to see what your plan is.
Thanks dude! We will be changing stuff. It is, but I think we missed the mark in some aspects.
@@BuildwithOmar Good thing with framer you can build so fast on the fly! Can't wait to see man. When do we get a sneak peek?
@@EthanHaveron Stay tuned ;) Hit me up on Discord, maybe i'll give you a little teaser haha
@@BuildwithOmarAwesome! will do... I will message you later today.
Huge thanks for this deep dive! I'm a design post-grad who's used to (due to assignments) design in Figma / Sketch and then have to manually code it from scratch. Therefore, my creativity has been limited, as I only designed websites that I was surely able to implement with HTML/CSS myself. That's why now I'm really looking into stepping up my game by learning either Framer or Webflow. My biggest criteria is to have the possibility to export it as code so that I'm still able to tweak minor stuff afterwards. Can Framer export the work as HTML/CSS? Webflow definitely can.
What is your update a year later on this?
Thanks for the hardwork you are putting in with your team.
I don't know what your other startup does but you should start an online university because you present and teach exceptionally well 🙂
Can you make a comparison on Framer and Unbounce, regarding landing pages and conversions?
Been using Webflow since 2018 and we run over 50 sites on the platform. I think that Framer is still not there, but with the speed new features are cranking out in Framer, things can change fast.
as a print designer who like minimist, typography-centric designs, i think framer might be best for me.
i just looked at framer i immediately understood how to use the platform. because its so similar to figma im still learning webflow i might lean towards framer. ill learn both since webflow isn't as limited as framer
This video helped me choose Webflow over Framer. Thank you 🙂
Glad it helped!
From Wordpress to Webflow to Framer very intresting - thank you
For either Webflow and Framer, can you take the results of your design/code and then host it on any platform or are you required to host on their site?
Would be interested to know if changing to Framer has any effect on your SEO traffic going forward. Maybe a follow-up video in a few months.
💯 this is going to be important! Note the current site drives around 50k traffic. Should of mentioned it that! So huge risk for sure!
Also curious on this
Any updates on this SEO piece?
@@scottbanks8243 still building the site, about to launch next week actually!
Great video and I want to love framer. The infinite canvas is amazing but everything else just feels like a limited cheap version of Webflow. I wouldn't use this on any serious client site. I don't think it's even close. I'm curious on how you made the jump? How do you deal with all the huge limitations of framer? Simple things like galleries, and videos on the cms end. How do you do animations? I guess that's custom coded? I can't even figure out how to make a button in this thing. I can make a component but you can't just drag and drop the component in and then change the text. I guess you need to make a new component for each button which is DUMB. I just feel like this isn't for serious use but maybe I'm missing something.
Subscribing! Which of the two allows exporting html css and Javascript for further editing?
As a designer who also codes a little, framer is amazing for building my own website and also for user testing and MVP development.
How did you create the diagram on 7:19
Great video!
Framer seems like the perfect choice for me but for the opposite that you mentioned. I usually design in Figma then code it up in Vue or React. I am much better in React than Jquery so Framer seems like the obvious choice.
That’s very interesting, wished we had a chat before I made this video! So your workflow would be design on framer then export to react code? Or design on framer and add custom components via react?
@@BuildwithOmar I’m not sure yet. My thoughts right now would be design in Figma and get a the base sign offs. Then use Frame for component work and use regular react for page building, authentication, api calls etc. if you have used React and Framer Motion you can get great results but that little bit of getting things to look exactly the way I want is where Framer would fit in.
just love it man , great job in sharing this "intel" contragts and thanks
Happy to help! Stay tuned for more content coming up!
Subscribed! Thanks
Hey ! I got a prob in webflow, after adding Interaction to a Button and when i checked while previewing it , The button got disappeared, I pressed on the place where the button was placed before then it came into that place while previewing , and every single time while previewing it I have to do that , IS THERE A SOLUTION?
What about animations? does it have the fully custom freedom of animations that webflow has?
Loved the breakdown! I use both tools - I had Framer replace Squarespace that I was using for clients whose budget couldn't afford Webflow.
I speed build in Webflow using CMD + E / CMD + Enter because that Drag and Dropping was so tiresome 😅.
Investing in a component library for Webflow also makes building websites quicker.
I'm going to pitch to my company to use Framer instead of using WordPress. For my freelance business though, I use Framer for average/small businesses and Webflow for large businesses.
As you said framer has better pixel accuracy - do you know the wizardry technique on webflow for extremely accurate designs? And if so is the accuracy from framer comparable to that?
Currently building my portfolio and was planning on getting my webflow skills to the next level for that (as I have a bit of experience definitely) but seeing this whole framer thing now considering about switching to that
Hey! I'm a Webflow dev! When he said pixel accuracy, I don't think he means literally that Webflow's tools are less accurate. He means that it's very likely there will be minor differences between the Figma designs and the Webflow site because they use different properties, have to be done in different places, and are often done with different teams handing things off.
The biggest thing is how comfy you are with code, I'd say!
Thank you so much for this. I will be using Framer primarily as I work with a design led company>
The video really helped.
Happy to help
What if I’m starting to build my first own website when I start my own recruiting agency? Framer or webflow or something else? Thx
Do you know if Zapier integration is coming to Framer anytime soon?
1)is it mandatory to create in figma and then switch to Framer or can I start directly in Framer?
2)have you ever thought of making a course to explain framer? you are very good at teaching! :)
Thanks buddy 🙏🏽,
As mentioned a very common workflow is going directly to framer. Thinking about it but Framer already does this very well.
Thoughts on Penpot open source instead of Figma?
Hey ! I have 30mins for completing the course nd now i got a prob, after adding Interaction to a Button and when i checked while previewing it , The button got disappeared, I pressed on the place where the button was placed before then it came into that place while previewing , and every single time while previewing it I have to do that , IS THERE A SOLUTION? 0:04 0:04
Which tool are you using to show the comparison in the video at 8 min?
Just made the switch myself - are you doing any programatic SEO with Framer?
I'm coming from the building/architecture world, using grasshopper (a visual coding scripter to be used with Rhinoceros) and have been looking for a similar style of website building (for myself). I'm going to try framer, as wordpress for me is too frustrating as it doesn't seem to be user friendly at all.
For those thinking where should they start? The answer is pretty simple; if you're from a developer background, you'll find Webflow familiar! If you're from a design background, go for Framer🎉
You summed it up better than I can.
@@BuildwithOmar 🙌♥️ Just learning from you
Great video❤ What about SEO in Framer?
The CMS have everything pretty much need for SEO, but maybe will go deeper into that in a separate video! Our site migration is going to be a big risk since it currently generates 50K traffic so stay tuned!
what's the name of that typeface that you're currently using in the thumbnails??
I’m a WordPress expert but for certain projects I’d like to have some site designs that don’t rely on themes and plug-ins and occasional conflicts and routine updates w all. The webflow learning was a turn off so wondering if Framer easier to figure all out?
Well if you need more advanced feature I think webflow would be a better option right now. Also with framer you should ideally have a lot of design experience, although you can get away with templates or their pre made components with little design knowledge.
I would say webflow is much better and even easier (once you learn it) than Wordpress in any case. Learning curve is about 1 week max and totally worth it.
Im new to web design, and I want to become a freelancer. As it seems many people are switching from webflow into framer, would u recommend me to start in a framer over webflow? I know basics of both just cant figure out which one has more potential. Framer is growing quickly but can it outgrow webflow?
If your a designer, I would recommend Framer, as it's growing fast, and it's a design-led workflow. But if your a developer then start with Webflow, it will be better suited for you.
hey what monitor are you using?
I wonder if either Webflow or Framer will support a "headless CMS" capability in the future? We have content that needs to be shared across (at least) 3-4 web properties, and there doesn't seem to be a reasonable no-code/low-code solution for this ... or is there?
Also, can you just start doing more Framer tutorials, tips and tricks and explain how its better than Webflow? Webflow was a pain in a butt for me even though I am a good designer i couldnt produce anything good.
Did some basic ones already on my channel. But More tutorials coming soon!
Good inputs
Thanks Omar, Very helpful - I am a marketing consultant for the B2B sector and I am certainly not a designer or developer and the issue is more about basic functionality and messaging, which I think should mean that Framer works best for me. I do have some e commerce integration but from what I can see most shopping cart software should be straightforward with Framer. Or am I being naive?
If your a non designer and non coder, I would recommend something like Wix Studio (their latest platform) or Shopify. Since these have ecommerce natively built. With Framer shopping cart needs to either be heavily coded, unless someone is dishing out a component out there which I haven’t seen. Or you have to use external links take users to have a shopping experience outside of the main website. But in this case the add to cart system will be external and not in your main page.
My ecommerce framer website tutorial features a basic system that links individual products to an external payment link. So there’s no cart system in this. It’s a basic purchase flow.
Please make a video on how to move from WordPress to webflow
How does their CMS scale and impact pricing? Webflow’s enterprise plan kicks in after 10,000 CMS items or 300,000 visits.
quick question, I may be getting this wrong but wasn't one of the benefits of webflow that it behaves like a fully coded website that's not built on top of a buggy framework like wix or wordpress
Is framer more like webflow in this sense or more like wix or wordpress?
What is the tool you are showing your findings on in the web browser? I.e. the one you have the comparison table on. Can't make out the pink favicon!
Figjam by Figma, it is a whiteboard tool for planning and brainstorming.
does Framer have CMS/templating capabilities and can this data integrate with external data from an API?
Could I ask how you implemented the search in framer? I was trying to do typesense but I am not a dev. Would love a tutorial. Search is the only thing missing for me.
Let me see if I can make a tutorial soon!
@@BuildwithOmar super appreciative.