7 ms·

I'm gonna start copy/pasting this every time I see a new website builder pop up. Look, at a high level no-code seems to make sense. But there's a serious issue

I'm gonna start copy/pasting this every time I see a new website builder pop up. Look, at a high level no-code seems to make sense. But there's a serious issue with the value proposition when you start thinking critically about it. The supposed benefit is that, as the "no-code" moniker suggests, people without coding skills can build websites. Sounds great! Except that just, like, look at the screenshot in the hero section webstudio's landing page. There's a visual sidebar with a flexbox configuration panel. The word "flex" is displayed as a dropdown, so I'd imagine that the menu list contains other options like "grid", "block", etc. This means your target audience is people who (a) understand the difference between CSS display properties, and (b) think that this interface is easier and faster than writing the code directly. I genuinely do not understand who this audience is - if you understand code, code is dramatically faster than any UI and everyone who codes knows it. I've worked with a non-technical CEO, and I once showed him Webflow to see if he could grasp it. It went as well as you'd imagine. That's not me making fun of him, it's me pointing out the reality that this shit is complex, and tossing a UI on top of it doesn't change that complexity. Another point is that even if it helps speed up web development, it can only do so for very small websites with light interaction. If you're looking to do anything even remotely custom or sophisticated, these kinds of tools break down very fast. So there's a paradox here - the stuff you can speed up really doesn't take very long anyways, and the stuff you actually need to speed up, these tools don't help with.

oleg009 3y ago
There is a serious knowledge gap between what you just wrote and the actual reality out there. I don't want to convince you of anything, just share the knowledge of what's actually happening. Why tools like Webflow have $4bln valuation and why there are millions of webflow developers. 1. You are looking at it in black/white. Coder vs nocoder. That's not how it is in reality. There is a seriously big amount of people who understand enough of coding to use webflow comfortably but not enough to write code by hand and/or wanting to do so. 2. Designers are used to visual tools. They find their way when tool allows to experiment without first studying how to code and then gradually learn css/html basics if they need to. 3. Building layouts, styling, html structure etc is actually faster with webflow once you understand how it works and learn all the shortcuts. If you actually care to learn about it, go talk to some pro webflow devs. Some of them will tell you they actualy know how to code, but its less efficient for a lot of use cases. 4. Handoff. A huge problem with building websites is wasted time between a designer and a developer. There is just too many things to consider and a static design in figma is never complete. Webstudio and Webflow aims at solving or at least reducing the handoff by either building directly in Webstudio/Webflow or by keeping figma design low-fidelity just for initial communication with the customer and then moving on to building. 5. This industry has come a long way and these days several tools are also integrating with git-based developer workflows. The goal is to let designers and visual developers to build visual components and design systems in the builder ui and provide those components to developers for further integration. 6. There is a clearly steep learning curve with Webflow. Lots of things are not easy to get. Its not a tool to build a website in 5 minutes, its a tool to learn html/css visually and become pro visual developer. Once you are there, the typical landing sites and marketing pages, even large one are built significantly faster and more presize from design perspective than with coding. I am saying this as an engineer who started building for the web in 2004. This is not meant to start an argument. Just pointing out a lot of stuff that is understandably not clear to many.
- danielvaughn 3y ago
  Totally reasonable response, and thanks for taking the criticism well - I hope it didn't come off as too harsh. I mostly agree with everything you wrote, just one thing I'd say: Designers may be used to visual tools, but IMO it's a hangup. It's like someone telling you that they find it easier to click File > Copy > File > Paste because they're not used to typing "ctrl c > ctrl v". I get the psychology of it, but it's objectively wrong - a keyboard shortcut will always be more efficient and everyone who learns them is better off for it. Code is like that but on steroids. If there's an efficiency gap then it's an issue with dev tooling (which IMO is 100% true in lots of cases), not inherently with code.
  - oleg009 3y ago
    Here again you show lack of nuance. Pro webflow developers use keyboard a lot. In fact with Webstudio we took the keyboard accessibility very seriously, still A LOT to improve. Visual development is a mixture of mouse and keyboard. Some things are faster with the mouse, some with the keyboard. The reason some people prefer mouse is not just that they are used to, even though it is true. Its because they know how to be efficient with it very well. "code is like that but on steroids" - again it can be true in certain use cases, but there is a massive amount of use cases where this is not actually true. Most of them are around layouts, styling and configuring components. Visual development is basically declarative programming - its configuring things. We are actually thinking deeply about the gap between typing and visually manipulating stuff at Webstudio and the plan is to allow a lot of the same UX patterns that you have with text-based coding: copy/pasting things like styles, box shadows, gradients, instances of components etc. Ability to paste gradients is already there, box shadows comes soon. Writing component code inline will most likely come at some point as well. Linked CSS editor - similar to chrome dev tools for css is also planned. As you can see there are ways to close the gap and when needed write code. The most frustrating thing with code is the build tools, compilers etc. These days nobody writes just simple html and css, things are complex. So the benefits of writing code are often completely destroyed by the amount of complexity to deploy the site.
    - 3y ago
iansinnott 3y ago
I've been critical of Webflow in the past for the same reasons, but having seen teams use it effectively I think there's more nuance here. Namely, if you want to build a website then CSS layout is just the tip of the iceberg. If you write your own website you have to consider: - HTML - CSS selectors - Deployment - Team collaboration (probably) Using a visual website builder allows people to learn only a bit of CSS and have the rest taken care of.
- marcus_holmes 3y ago
  > Using a visual website builder allows people to learn only a bit of CSS and have the rest taken care of. Does it handle responsiveness automatically? Accessibility? Download speed/size? Interactivity? Time to first render? There's more here than you listed. It's a complex subject, and making one part of it easier by slapping a UI on it doesn't reduce the complexity.
  - oleg009 3y ago
    Webflow actually helps with all those things. Webstudio doesn't have much yet accessibility features on canvas, because this comes next, but the performance - man it feels like a lifetime spent on optimizing it with the help of lots of different tools. we hit 100% on lighthouse score consistently, the webstudio.is landing is built with webstudio. https://pagespeed.web.dev/analysis?url=https%3A%2F%2Fwebstudio.is%2F https://pagespeed.web.dev/analysis?url=https%3A%2F%2Fwebstud...
canadianfella 3y ago
[dead]
onion2k 3y ago
There are a lot of people who understand what code does in isolation but struggle to understand the complexity of what happens when you build up layers of abstraction. Knowing what flex does is one thing, but know how the cascade works or what specificity rules are is another level. Technical visual tools help. Its worth noting that the same is true for plenty of coders too. There's a good reason why people say things like recursion and pointers are hard.
lelanthran 3y ago
You must not have used the large amount of low-code tools in the past. I remember a time when almost all business apps were written in a drag-n-drop environment. There's a reason that they dominated so definitively, for so long. In fact, a big reason they're not around anymore is because the vendors forcefully killed them off. The web as a replacement for app development is a really poor substitute, but anyone who started coding after 2004 won't know this, as it's all they've ever seen. In short, parent comment is so off-base it might as well come from an alternate reality in which VB, MS-Access, Delphi and C++ builder did not exist.
- danielvaughn 3y ago
  I used UIKit (iOS) for a couple of years back in 2015/2016. It was an interesting experience, I did enjoy laying out the architecture of my app visually, then dipping into code for the behavior and business logic.
  - lelanthran 3y ago
    > I used UIKit (iOS) for a couple of years back in 2015/2016. It was an interesting experience, I did enjoy laying out the architecture of my app visually, then dipping into code for the behavior and business logic. I think you can expand your view on what is technically possible by simply downloading Lazarus and creating a simply application with it. Follow a tutorial. Then compare that experience with mangling react or similar to get what you want using purely an IDE to build everything.
    - danielvaughn 3y ago
      I’ll check it out, thanks. I remember doing a survey of lots of GUI tools a couple of years back (GTK, QT, etc). I don’t think I ever came across Lazarus but if it’s still available for download I’m interested to see what it can do.
Onavo 3y ago
Use framer, that's the tool your boss is looking for. It has good mix of PowerPoint/figma's absolute positioning approach with relative layouts.
solardev 3y ago
As a frontend dev, I have to disagree. The web is primarily a visual medium, and it's quite odd and inefficient that we have to code UI in declarative markup rather than a visual IDE. Visual Studio had better layout tools for WinForms... two decades ago. Tweaking CSS and manually dragging the viewport around is not a great way to make responsive layouts. Flex and Grid are a nightmare of confusingly named properties (align self? justify content?) that would be much simpler to lay out with visual guides and snaps. Dreamweaver had its uses back in the day, but sadly couldn't keep up with the pace of framework development (in CSS and Javascript) and became less useful over time. These days I wish I could export Figma layouts to framework skeletons and go from there. Of course there's stuff that's easier to just write in code (business logic, chiefly), but complex layouts that are ultimately rendered visually? I see no reason they shouldn't be laid out visually to begin with, InDesign style. Just as designers might not understand the tooling of dev environments very well, maybe it's the case that some coders don't understand the power and benefits of visual design tooling? They certainly have their value, if you know how to integrate them into your workflow. I'll have to check out this Webflow thing...

oleg009 3y ago

There is a serious knowledge gap between what you just wrote and the actual reality out there. I don't want to convince you of anything, just share the knowledge of what's actually happening. Why tools like Webflow have $4bln valuation and why there are millions of webflow developers. 1. You are looking at it in black/white. Coder vs nocoder. That's not how it is in reality. There is a seriously big amount of people who understand enough of coding to use webflow comfortably but not enough to write code by hand and/or wanting to do so. 2. Designers are used to visual tools. They find their way when tool allows to experiment without first studying how to code and then gradually learn css/html basics if they need to. 3. Building layouts, styling, html structure etc is actually faster with webflow once you understand how it works and learn all the shortcuts. If you actually care to learn about it, go talk to some pro webflow devs. Some of them will tell you they actualy know how to code, but its less efficient for a lot of use cases. 4. Handoff. A huge problem with building websites is wasted time between a designer and a developer. There is just too many things to consider and a static design in figma is never complete. Webstudio and Webflow aims at solving or at least reducing the handoff by either building directly in Webstudio/Webflow or by keeping figma design low-fidelity just for initial communication with the customer and then moving on to building. 5. This industry has come a long way and these days several tools are also integrating with git-based developer workflows. The goal is to let designers and visual developers to build visual components and design systems in the builder ui and provide those components to developers for further integration. 6. There is a clearly steep learning curve with Webflow. Lots of things are not easy to get. Its not a tool to build a website in 5 minutes, its a tool to learn html/css visually and become pro visual developer. Once you are there, the typical landing sites and marketing pages, even large one are built significantly faster and more presize from design perspective than with coding. I am saying this as an engineer who started building for the web in 2004. This is not meant to start an argument. Just pointing out a lot of stuff that is understandably not clear to many.

danielvaughn 3y ago
Totally reasonable response, and thanks for taking the criticism well - I hope it didn't come off as too harsh. I mostly agree with everything you wrote, just one thing I'd say: Designers may be used to visual tools, but IMO it's a hangup. It's like someone telling you that they find it easier to click File > Copy > File > Paste because they're not used to typing "ctrl c > ctrl v". I get the psychology of it, but it's objectively wrong - a keyboard shortcut will always be more efficient and everyone who learns them is better off for it. Code is like that but on steroids. If there's an efficiency gap then it's an issue with dev tooling (which IMO is 100% true in lots of cases), not inherently with code.
- oleg009 3y ago
  Here again you show lack of nuance. Pro webflow developers use keyboard a lot. In fact with Webstudio we took the keyboard accessibility very seriously, still A LOT to improve. Visual development is a mixture of mouse and keyboard. Some things are faster with the mouse, some with the keyboard. The reason some people prefer mouse is not just that they are used to, even though it is true. Its because they know how to be efficient with it very well. "code is like that but on steroids" - again it can be true in certain use cases, but there is a massive amount of use cases where this is not actually true. Most of them are around layouts, styling and configuring components. Visual development is basically declarative programming - its configuring things. We are actually thinking deeply about the gap between typing and visually manipulating stuff at Webstudio and the plan is to allow a lot of the same UX patterns that you have with text-based coding: copy/pasting things like styles, box shadows, gradients, instances of components etc. Ability to paste gradients is already there, box shadows comes soon. Writing component code inline will most likely come at some point as well. Linked CSS editor - similar to chrome dev tools for css is also planned. As you can see there are ways to close the gap and when needed write code. The most frustrating thing with code is the build tools, compilers etc. These days nobody writes just simple html and css, things are complex. So the benefits of writing code are often completely destroyed by the amount of complexity to deploy the site.
  - 3y ago

iansinnott 3y ago

I've been critical of Webflow in the past for the same reasons, but having seen teams use it effectively I think there's more nuance here. Namely, if you want to build a website then CSS layout is just the tip of the iceberg. If you write your own website you have to consider: - HTML - CSS selectors - Deployment - Team collaboration (probably) Using a visual website builder allows people to learn only a bit of CSS and have the rest taken care of.

marcus_holmes 3y ago
> Using a visual website builder allows people to learn only a bit of CSS and have the rest taken care of. Does it handle responsiveness automatically? Accessibility? Download speed/size? Interactivity? Time to first render? There's more here than you listed. It's a complex subject, and making one part of it easier by slapping a UI on it doesn't reduce the complexity.
- oleg009 3y ago
  Webflow actually helps with all those things. Webstudio doesn't have much yet accessibility features on canvas, because this comes next, but the performance - man it feels like a lifetime spent on optimizing it with the help of lots of different tools. we hit 100% on lighthouse score consistently, the webstudio.is landing is built with webstudio. https://pagespeed.web.dev/analysis?url=https%3A%2F%2Fwebstudio.is%2F https://pagespeed.web.dev/analysis?url=https%3A%2F%2Fwebstud...

canadianfella 3y ago

[dead]

onion2k 3y ago

There are a lot of people who understand what code does in isolation but struggle to understand the complexity of what happens when you build up layers of abstraction. Knowing what flex does is one thing, but know how the cascade works or what specificity rules are is another level. Technical visual tools help. Its worth noting that the same is true for plenty of coders too. There's a good reason why people say things like recursion and pointers are hard.

lelanthran 3y ago

You must not have used the large amount of low-code tools in the past. I remember a time when almost all business apps were written in a drag-n-drop environment. There's a reason that they dominated so definitively, for so long. In fact, a big reason they're not around anymore is because the vendors forcefully killed them off. The web as a replacement for app development is a really poor substitute, but anyone who started coding after 2004 won't know this, as it's all they've ever seen. In short, parent comment is so off-base it might as well come from an alternate reality in which VB, MS-Access, Delphi and C++ builder did not exist.

danielvaughn 3y ago
I used UIKit (iOS) for a couple of years back in 2015/2016. It was an interesting experience, I did enjoy laying out the architecture of my app visually, then dipping into code for the behavior and business logic.
- lelanthran 3y ago
  > I used UIKit (iOS) for a couple of years back in 2015/2016. It was an interesting experience, I did enjoy laying out the architecture of my app visually, then dipping into code for the behavior and business logic. I think you can expand your view on what is technically possible by simply downloading Lazarus and creating a simply application with it. Follow a tutorial. Then compare that experience with mangling react or similar to get what you want using purely an IDE to build everything.
  - danielvaughn 3y ago
    I’ll check it out, thanks. I remember doing a survey of lots of GUI tools a couple of years back (GTK, QT, etc). I don’t think I ever came across Lazarus but if it’s still available for download I’m interested to see what it can do.

Onavo 3y ago

Use framer, that's the tool your boss is looking for. It has good mix of PowerPoint/figma's absolute positioning approach with relative layouts.

solardev 3y ago

As a frontend dev, I have to disagree. The web is primarily a visual medium, and it's quite odd and inefficient that we have to code UI in declarative markup rather than a visual IDE. Visual Studio had better layout tools for WinForms... two decades ago. Tweaking CSS and manually dragging the viewport around is not a great way to make responsive layouts. Flex and Grid are a nightmare of confusingly named properties (align self? justify content?) that would be much simpler to lay out with visual guides and snaps. Dreamweaver had its uses back in the day, but sadly couldn't keep up with the pace of framework development (in CSS and Javascript) and became less useful over time. These days I wish I could export Figma layouts to framework skeletons and go from there. Of course there's stuff that's easier to just write in code (business logic, chiefly), but complex layouts that are ultimately rendered visually? I see no reason they shouldn't be laid out visually to begin with, InDesign style. Just as designers might not understand the tooling of dev environments very well, maybe it's the case that some coders don't understand the power and benefits of visual design tooling? They certainly have their value, if you know how to integrate them into your workflow. I'll have to check out this Webflow thing...