Webflow vs Framer: The FINAL Verdict
Вставка
- Опубліковано 28 лип 2024
- Get started with Framer NOW! www.framer.com?via=fullstackme
Special Promo 3 Months Free on Annual Plan: partner25proyearly
Get started with Webflow NOW! webflow.grsm.io/vju2g2zhpv53
I've been using Framer for the last few weeks and feel like I have a pretty good grasp of the tool in comparison to Webflow.
Brought to you by FlowSt8.dev - The unlimited Webflow Development Service
Buy my merch: flowst8.dev/store
-
Transcriptions and More: thefullstackagency.xyz/
Support me: buymeacoffee.com/fakesamgregory
Join the Discord: / discord
Services I Love
Domain Names: namecheap.pxf.io/c/3510278/38...
Hosting: www.hostg.xyz/aff_c?offer_id=...
Online Storage ($200 credit): m.do.co/c/9beb563908a1
Online Storage ($100 credit): www.vultr.com/?ref=9381598-8H
-
Twitter: @0x5am5
-
--------------------------
⏰ Timestamps
--------------------------
00:00 - Intro
01:22 - The Headline (Framer)
01:46 - The Headline (Webflow)
01:58 - Framer's integration with Figma
03:05 - Web development path
03:38 - Summary
04:11 - Outro
My Gear (affiliate)
Sony A7 III: amzn.to/427iMbS
Sigma 24-70mm 2.8: amzn.to/43a6UHf
VIJIM Video Light: amzn.to/3N0XdFp
Hollyland Mark M1: amzn.to/3MIZmUW
Macbook Pro M1 Pro: amzn.to/3oEVbS0
iPad Pro 2018: amzn.to/3AxJWNN
Magic Keyboard: amzn.to/421B26P
Travel Laptop Stand: amzn.to/3MDRx2Q
Logitech MX Vertical: amzn.to/3oCg1Bz
My Books
The Full Stack Agency: thefullstackagency.xyz/books/...
Lingo: Agile: thefullstackagency.gumroad.co...
Lingo: Startup: thefullstackagency.gumroad.co...
#nocode #Framer #Webflow
Are you team Webflow or Framer? As long as you’re happy, I’m happy!! 🔥
I'm not a coder, but I can code at a basic level. I'm not into web development, as I'm a web designer. I use photoshop and work with developers. Do you think I should switch to Webflow and Figma, this would mean cutting out the developer. However, I might struggle with debugging if something went wrong. Any advice would be helpful.
Photoshop for webdesign !? DUDE stop it. Use Figma for template (easy) and/or Webflow for template integration. You can create re-usable components - they are necessary to all modern websites.
@@aedway many designing use photoshop for webdesign, so what the f#ck are you talking about?
@@danielcollinson4456 old designers maybe.
Now, webdesigners have to use modern tools (with components management) if they want to find goods missions and find $$customers.
ALL big projects with a team use new tools. Imagine collabore in a PSD file lol, u can't. in Figma for example, some designers can work both in live
- Just for you dude, take the train
I love this video because you were unbiased. I'm new to web development to I'm sticking with Framer, it's easy coming from Figma to Framer. Plus I can see all my breakpoints at once.
I try to be as unbiased as possible in all my videos. I’m not beholden to any tool and love to learn new things and continue to grow. I also love that you’ve found a tool that works for you. I hope you build great things!!
Great explanation. It seems that everyone wants to hear a definitive answer, like Webflow is better than Framer, or vice versa, but in reality they are both great tools worth mastering and/or exploring.
Both awesome tools for awesome people
If weblfow rework on their hosting plans for a more acceptable prices, maybe they can survive, maybe.... I switched to framer a year ago, man i love webflow but framer is a life changer
Price is obviously an important factor but I don’t know if it’ll save them or if indeed they need to be saved. Webflow is a more advanced platform and may warrant a higher price for that capability. You’re lucky that a cheaper platform suits your needs for sure and it is mighty enticing to MAKE Framer work for one’s needs given its price. I welcome the competition Framer brings and hope we all benefit in some way from it!!
Framers pricing is superbad. Just check the localization pricing. Ouch!
This was a great overview. I’ve been a UX Designer for a long time doing the hybrid design/development role. I have been considering building with Webflow, Framer and Squarespace. I have been leaning towards Webflow but have seen some really great stuff come from Framer lately. Which service (Framer or Webflow) do you think has the least overhead after you build a site?
Thank you! Unfortunately what determines “a site” can vary wildly. If you don’t think you’ll make use of the added featureset that Webflow offers, then do consider a Framer. There are a wild number of simple sites that Framer is best suited to build. Webflow could be adding complexity that you just don’t need!
Hi a bit on my background. I am a webmaster (have training in Graphic Design) who knows a bit of coding (simple CSS, Javascript and ASP) and in the past I used to use Dreamweaver and MS Frontpage for building websites for the corporate companies that I was working for. Currently I am trying to go into freelance website development (web design & maybe a bit of coding). For a person of my background which one would better suite me?
I think you’ll be able to handle Webflow but Framer makes making websites a lot easier than it needs to be. I think give Framer a go first
Nice comparison, I personally I would recommend those wanting to create websites with custom animations or functionality to stick to Webflow. I tired out framer but it's currently super limited in some areas, Webflow definitely has the advantage as of now.
Very useful. Thanks!!
Thx for the comparison. Bet it calms a lot of uncertainty. Can I ask what mic u are using? I wanted to get something similar. Thx!!
Thanks. I hope it does too!
All links are in the description. Hollyland I think is the brand. Not as great as DJI or Rode but significantly cheaper! I’m seeing a lot of tech reviewers catch on with these.
@@webflowandcode thx so much!!
No problem
but the real important question is: can I export HTML/CSS code in Framer and host it somewhere else?
I’m not sure but I don’t think it’s an important question for this specific video. As I said, I don’t think Framer is the right choice for any heavy web development needs as it stands.
if you want to create a social media platform which one to chose for a beginner but having all the elements you want to work?
I would probably use neither of these platforms. Go for something like Flutterflow or Bubble which handles backend a lot better
@@webflowandcode you are valuable. I currently use Framer because it's fantastic to build a nice ui ux and is easy. Even though I am currently learning. I have to build my saas quickly. But I can't understand if I can customise the Sign Up page. I mean everything I build will be really usable next or doing nonsenses
Curious as a WordPress expert who prioritizes dynamic modern engaging site style and mobile view matching, and I’m not a coder, is Framer the way to go? Can u design sites on Apple level w it?
People have demonstrated very dynamic “Apple-like” sites with Framer so yes! I would say the benefits to Wordpress would be complex and specific integrations with other tools. Most other things can be achieved with Framer. This is of course very broadly speaking but generally Wordpress is antiquated with many modern website applications
Awesome perspective
Thank you
How about SEO on framer? Being react are we going to be disadvantaged from the get go??
Something I’ve yet to look into but if it’s raw react YES.
Good point
Hey! I am learning web design and I am not quite good with Figma nor Webflow. I have been the last few weeks using Webflow. The free version though. I am not sure if I should go ahead a pay for it. I am struggling hard to choose the one for me. Cuz In webflow I don't use Figma, I just do everything in WEbflow. But Framer has things like its cheaper and user friendly stuff. Please i need help
Paying for Webflow doesn’t get you much more. Particularly at your level. There’s no need to pay for it. Only when you want to publish your site. Similarly to Framer.
Saying that, it’s good practice to do your designs in Figma so I’d focus my energy there if you want to learn design. Then you can move onto dev.
So which will Adobe buy next? Framer or Webflow?
Neither. They will implement a builder in Figma. The usage of Figma is already insane, they would be severely downgrading with both Webflow and Framer. What tool will the Figma builder resemble more, between Webflow or Framer, I don't know.
@@TheMarouuuI see, Dreamweaver 2.0
@@gdj777 Hope so.
I have to agree, I think Figma’s next step is similar to Framer. Develop the designer into a website launch tool. That or the two company’s become mutually exclusive in some way.
@@webflowandcode what about xd ?
Haven't tried Framer yet. I will though. It seems there's potential in it.
It’ll be interesting to see where it is in a year
I'm not a coder, but I can code at a basic level. I'm not into web development, as I'm a web designer. I use photoshop and work with developers. Do you think I should switch to Webflow and Figma, this would mean cutting out the developer. However, I might struggle with debugging if something went wrong. Any advice would be helpful.
If you’re willing to learn then go for it!!
Hello! Thanks for your video. I am an intermediate Figma user and want to help my tech guy develop the MVP for our app more quickly. I would like to streamline the coding process for him so that we can test our MVP in the least possible time. If this is the case and according to your video, would you recommend for me to design using Pinegrow, even if that means I have to learn some basic concepts? How much of the Pinegrow design would we be able to export and simply "paste" in the code? BTW, we will be developing in React Native. Thanks so much in advance for your advice!
If it’s React Native you’re building for then Pinegrow would be a better solution however no code isn’t really suited for this type of project. No Code is good for marketing websites (check out my latest video). After you build in Pinegrow you’ll still need to take that code and convert it into React Components. There will be an element of pasting but a lot more coding around it to get it to work. I haven’t checked but maybe there’s a nocode tool for React Native export…
Just to be clear neither Framer or Webflow are suitable for what you want to build. Not impossible, but it’s not streamlined. Just get a React Native developer for the most streamlined approach.
Thank you so much for your response. Cheers!
Circling back I have just found out about Flutterflow. Check it out!
Awesome ! Thanks !
I have to disagree. You can really use Framer instead of Figma to design up your pages and with one click open and IDE to code up your React components. And because you can write your components right there you can instantly start seeing how your components interact with your design. I would suggest write a component to fetch from an api within your Framer project.
It’s cool to disagree! That’s what mostly happens in the comments anyway ;)
My argument to this though is that Framer’s React integration is quite frankly way over the heads of most people looking for a no code solution. It’s the wrong demographic so I can’t imagine it gets used. I wanted to explore their React components side of things and created an episode specifically to understand it more (another is on the way). From my understanding you cannot just turn a page into a React page or turn a component you built in no code into a React component. You have to create a React component from the get go. Was I wrong in this? Are you actively practicing what you’re preaching here and using a combination of Framer and React in production?
@@webflowandcode no you are correct you have to make the React components from scratch, there is no converting. What I like about Framer for me it is not a no code solution it’s a design solution that I can add code to. At my 9-5 we just code no solutions like Webflow or Framer. At personal site, sublime ux why framer I have some examples and a couple of gists.
I can’t get away from code either :). While you can code React Components, it can’t be a sign that it’s a more advanced tool. I don’t know of anyone actually using this effectively and might as well not be there. I’m keen to dig into whether these components are indeed React or whether they are SSR which they should be SSR to be honest.
@@webflowandcode sorry for the late response I’ve been sick. Ok I don’t understand being able to code using Jquery in Webflow means it’s an advanced tool but being able to code using React is not the sign of an advanced tool? I’m just starting with both of these but because I like React and React Motion, Framer just seems like a better fit for me. Also you say you don’t know of anyone using it effectively, what is your measurement for effectiveness?
What I mean is, React alone cant be a measure. I think Framer pride itself on a low bar entry web development tool and is attractive to those just starting out. By “effective” I mean “at all” and in a professional context with teams, I guess.
Nice❤
Framer is not brand new, it was founded in 2013, though their tool was mostly intended for wireframing, only recently they turned the software into a page builder.
Exactly! I don’t think this changes anything though?
@@webflowandcode no it doesn't... It's funny, recently I made a thorough search for page builders and not even once I saw a mention of Pinegrow, I never heard of them before. I think they don't invest much in marketing. Seems pretty good though
Yeah I agree they could do more! It’s definitely a tool for developers though. A very small percentage of Webflow users would feel comfortable transitioning.
one thing I don't feel that's intuitive on Framer for designers is that, when you need to do something advanced that the tool doesn't supports. you need to dig in React code! . with typescript. and this is not user-friendly at all. while in Webflow you are fine adding some functionality with embed code.
It’s a balancing act. You can’t have it all. With complexity you sacrifice ease of use and Webflow has a steeper learning curve but allows you to do more. Pinegrow even more so.
I always felt the React aspect of Framer is completely irrelevant given its target market.
I will kindly disagree. Framer allows you to build extremely complex things because it has a React code component built in. It combines the power of NoCode with modern web development concepts.
It’s still a mystery for me why people seems to overlook this feature 🤷🏻♂️
Thanks for bringing it up. I did think about this but I think the disparity between a no code tool and React is too large! As someone who can write React comfortably, a no code tool like Framer is just too basic. I’d rather just jump into React straight away as Framer doesn’t speed up the process. For me, Pinegrow speeds up the process as a developer which is why I like it. You’re right but I don’t know how much it’s React side will get used by Framers target audience.
Nee subscriber.. I just want to know about framers hosting.. can I have my own Host if I use framer. Or would I be a slave like in webflow. That I need to host with them?.
I’m led to believe you’re a slave. Webflow does have the ability to export though. I’ve not found this feature in Framer but doesn’t mean it’s not there. Maybe someone else knows the answer
Webflow and what? The name of the other tool Is...
Sorry. I don’t understand the question. What other tool?
Pinegrow
@@diego.almeida thanks!
Sorry, but as an actually webdesigner I can find a lot on your storepage and even your logo thats not clean or professional.
Your comments reek of negativity and jealousy bruh
your logo is pretty crappy and not clean tbh
You're entitled to your opinion, which i"ll politely refuse. I think you're trying to be helpful but just coming across as an ass. Your comments nothing to do with Webflow or Framer
It's hot garbage, when you add a heading it's like 4 divs deep before you actually get to it, the code it outputs is a disaster. For accessible, performant, scalable and consistent websites this is just not a professional tool to use.
Whilst I agree that too much code is not great, there are much bigger fish to fry. Too many divs isn’t going to have a significant impact on performance.