Why do we make websites on WebFlow?

In Embacy we are making websites and landing pages, but we don't have any developers on our team. Designers build the websites themselves on WebFlow. Here's why.

What is WebFlow?

WebFlow is a SaaS application that allows you to build websites, landing pages, blogs, and online shops. Unlike other services, Webflow is very customizable. Somehow, it's 18 times less popular than Tilda and 100 times than Wordpress.

The workflow is simple: choose a layout template/start from scratch, drag and drop block here and there, upload some graphics, adaptive and here it is.

Some features

  • WebFlow University and respondent support. Every issue we ever had we were able to solve through University or with the help of support right away
  • Native CMS and content management. It's awesome for big websites. It's also possible to integrate it with your backend.
  • Huge template library for a variety of industries. There are paid and free options. We haven't use them, but they may come in handy for non-designers

We’ve been using WebFlow for three years now. It has a decent library of templates that could be customized to your needs. Native CMS makes it easy to manage.

CMO for PRAVO TECH, Case.one, 2nd.law

We needed a tool to fit our agency's tasks

We work by sprints, where one week is one sprint. That means we need to be able to design and make website layout within that one week.

Here are some rules that help us to keep up with the pace:

  • The website should be made by the designer. Otherwise, some ideas could be "lost in translation" between design the webflow layout stages
  • Speed does matter. Fast production is our wild card.
  • We craft custom solutions. That is why other platforms are not an option due to limitations in customization.
  • We do not make edits once the project is over. So we teach clients how to use CMS so they are able to work with their website.

Eventually, that is why we have chosen Webflow as the main tool.

WebFlow pros

Flexibility

WebFlow’s templates do not limit designers. Around 95% of interesting design ideas can be executed on WebFlow. For example, a horizontal scroll. Other platforms are not as flexible.

After Effects integration

You can make a complex animation in After Effects and then run it through a plugin to insert it as a .json file. First, you render it through the plugin, then import it to the WebFlow project. Usually, it takes around 20-30 minutes.

Classes

In WebFlow each element can be assigned with a class. For example. we need a header: color - blue, font Proxima Nova 48 px. We create this header once and then assign a class. Each time we need a header with the same style, we just create a new one and assign to the class, style applies automatically. In other website builders you need to apply styles manually.

Mobile-friendly

Most of the traffic comes from mobile. It's the reason why the mobile version is a significant part of any project in Embacy. Sometimes we redraw illustrations and rearrange some elements just for the mobile layout.

In Tilda mobile version contains all the elements from the desktop and you can't remove or hide them. It's resticted to moving elements within the canvas. These kind of inconveniences impact loading speed dramatically. WebFlow solves it with a “hide” button, so each element could be hidden. As a result, mobile versions loo better and work fasters.

Integration with 3rd parties

WebFlow supports a number of services like Shopify, Ecwid and many others. There you can add e-commerce features, CRM, launch e-mail campaigns and much more.

WebFlow workspace

WebFlow cons

Not so easy for newcommers

It gets longer to get into webflow since is more complex than its peers.

Cost

We pay $70 a month so that two members of our team can work in webflow simultaneously. The basic plan is 18$ and there is also a plan for 12$ but it is very limited. WebFlow alternatives are way cheaper.

WebFlow advantages

Code without coding

In WebFlow, the designer shows the app how the blocks are located on the canvas, and the app writes code for it. This code can be exported and be used on another hosting.

Cheaper

Although the plans are pricy, it is way cheaper than a payroll of an in-house front-end developer.

Designer is responsible

Designer and the layout designer is the same person which means:

  • one person is responsible;
  • the result turns out as it was intended;
  • there is no waste of time for discussions and sometimes fights between the designer and the developer.

We get upset when we make design without building it after. Right now, we have two battles with our clients' front-end developers.

WebFlow drawbacks

Technical constraints Webflow

If you know how to code, they are non-existent to you. If not, you will be limited to what Webflow can offer by default. Serch bars, sliders, complex animation will require extra knowledge.

Simplified JavaScript

If you are not hosting on Webflow, but have exported the code to your hosting, it will be difficult to make adjustments to it, because it will be simplified.

One screen for desktop and one screen for mobile

For desktop and mobile you need to use only one resolution and the rest will be based on it.
You can live with WebFlow, but there are better tools.

What’s not so good

  • No edit preview. Just put in production and see how it works
  • No edit log. At least for the current version. Now the changes look like" something has changed on the main page"
  • There is no way to roll back these changes when they are hanging in the draft
  • There is no way to roll back these changes when they are hanging in the draft (staged for publishing)
  • The ability to change pages that are automatically generated based on content is pure evil. It changes content incorrectly, it looks wired. Webflow alerts that it is going to publish them. And finally, it doesn't save them (fortunately)

To sum up

We use WebFlow to build custom solutions fast.

We would recommend WebFlow, if:

  • it is important to create unconventional results quickly;
  • you have very skilled designers and you're weak on the front-end part;
  • you want to try something different to Tilda or Readymag

We would not recommend it, if:

  • you have great front-end developers;
  • no one even know what the design is and a Tilda landing still makes conversions

Don't be a stranger

Subscribe and never miss a story

Got it! Now check your email
Oops! Something went wrong while submitting the form.

Also read

Design articles

Digital Design Digest for November

Case Stories

Think32: Distinct And Particular

Design articles

Identity In Motion: Why Your Digital Product Needs An Animated Logo And How To Make One

Design articles

How Art Influenced Graphic Design and How Graphic Design Influenced Web Design

embacy

Want to recieve our awesome stories?

Got it! Now check your email
Oops! Something went wrong while submitting the form.

© Embacy. 2020