Research

Another round or two with Webflow

With a host of improvements, the design tool is certainly good but what is it good for?

Updated July 23, 2019

I took my first peek at Webflow back in 2016 after a student brought it to my attention. The platform has made some significant strides since my last visit, layering in eCommerce and CMS tools to support scaling beyond its faux HTML beginnings.

Webflow is the latest in a long line of WYSIWYG editors for building web pages. I’ve even seriously used one of those editors before back in 2006 when iWeb was a thing. It was a tool that came with iLife and mostly responsible for me leaping into digital design — but for all the wrong reasons.

Simply put, I thought iWeb sucked. I couldn’t get the level of detail out of it that I could reach as a print designer. In retrospect, iWeb was ok for 2006, but I sucked as a digital designer. I didn’t understand the fundamentals of web design, nor did I respect the limitations that were the source of much of the creativity we experienced online in that era.

I’ve grown a lot in the decade that passed between my iWeb adventures and my first pass at Webflow. In between, I spent a lot of time with code. Front and backend adventures that provided perspective and just enough distance from my Adobe jockey days to look down my nose at Webflow.

“Spend your time learning to code — which is free — instead of sinking time into learning a program that will always cost you money and might not be around for long.”

Much of that sentiment remains for me. I don’t need a tool like Webflow. Working through the dizzying number of tools and panels makes me ache for a simple text editor where I can roll a site with ease and deploy it via the command line even faster.

But does that make Webflow bad for you?

When Webflow makes sense

There are many scenarios when I believe that Webflow could be a viable tool for designers.

Client handoff off

Because of the new CMS and eCommerce additions, Webflow now provides a platform package that could be attractive to use with small business clients who want to manage the site after their contract with you is over. The CMS component used to be the main reason you went with Wordpress. I’m not sure Webflow replaces Wordpress here, but now you have another option.

The UX or visual designer portfolio

Webflow provides greater control over your work than the typical Wix or Squarespace offerings, so if you’re not applying for jobs that will involve coding, I think it is fine to sink some time into Webflow to produce a shiny port.

Prototyping

Because you can quickly pull a working site together, Webflow becomes an option for building simple prototypes. Bonus, because you can export your codebase you also get that little chunk of code to help jump-start development — but the quality of any prototype code is up for debate.

The one-off, side projects

If Webflow has a role at large companies, it is in the realm building projects off to the side of their existing platforms at littl-to-no cost. These experiments open up great opportunities for designers to explore possible avenues of growth without impacting their development teams with resource needs. Huge win for everyone involved.

Learning HTML, CSS

There is still a learning curve involved in designing for the web that doesn’t go away because you have a WYSIWYG editor. If you’re just getting started in web design, you are going to faceplant many times using this product. It’s not that Webflow is failing you, it’s your inexperience with the medium that is vexing you. Luckily, Webflow won’t ‘fail to compile,’ it’ll just look janky, and you have to spend the time fixing it.

When Webflow doesn’t make sense

There are situations where the platform doesn’t make sense. These include...

High traffic/volume sites

I deal with a lot of media companies and personalities. For most of them, they’re going to hit the 100,000 unique monthly visits number pretty fast. Others will spike the 1,000,000 number. Few would even consider migrating their databases of stories, videos, etc.

Bringing in custom code

I’m hedging conservative, but if you know how to spin up a d3 project, you probably know how to deploy a site on your own. You don’t need Webflow. That said, you can use custom code in the platform, but it feels like you are on an island by yourself, and the documentation is sparse compared with finding help on StackOverflow.

Clients who love Wordpress

I mentioned migration before, but many people are only comfortable with what they know. Wordpress has a loyal following, but there are many ways you can keep people on their beloved Wordpress CMS and allow them to branch off into other sites via frameworks like Gatsby.js.

Insta-designers

Regardless of the setting, if someone hands you a hammer and you don’t know what a nail is — it won’t matter how awesome the hammer is. The same mentality applies to Webflow. There are a lot of people who believe that tools can turn anyone into a designer or developer, but these are just tools. They carry no expertise with them. In the hands of a skilled designer, you can do a few things with Webflow, but without the skills, you’re not going to get very far.

The CMS notes

Getting a CMS up and running really only requires a rudimentary understanding of the elements that your project will need.

One of the things I like about Webflow is that it realizes that you need to populate the database with something so you can begin your work. Once you create your initial collection of items, the system will prompt you to see if you'd like to populate it with dummy data. Five stories are more than sufficent to get started.

Also important is the ability to connect different collections. This is done by adding a reference or multi-reference field to a collection. You will obviously need two collections populated in your data base for this to work properly.

Once your collections are created, you can then jump right into creating your initial templates.

Start this process by adding a few staples to the page. A navbar, section, and container should be enough to get yourself moving forward.

This is where Webflow could begin to get difficult for people who are unfamiliar with web design. Webflow is not drawing program, despite the fact that it looks like something from Adobe. You can drag and drop elements in, but you need to know some HTML basics to get the most out of the platform.

New Pragmatic’s Intro to Product Design and UX Design courses are now open for enrollment — but don't wait! Space is limited.

Sign Up Now