Badge Webflow Award Winner 2023

Never start your site in Webflow!

Published on 
18/3/2022
-
Amended on 
24/3/2023
Reading time: 5 min
Figma logo with an arrow to the Webflow logo
Written by
Florian Bodelot with a T-shirt Digidop

Florian Bodelot

Co-founder

This mistake can waste a lot of time and prevent you from getting the result you want! Before you start developing your site, use a design tool like Figma or Adobe XD to create a web design prototype of your site. We explain the advantage of always starting the design process with a web design tool, like Figma!

Key points to remember

This mistake can waste a lot of time and prevent you from getting the result you are hoping for! Before you start developing your site, use a design tool like Figma or Adobe XD to create a web design prototype of your site. We explain the advantage of always starting the design process with a web design tool, like Figma!

Figma's advantage in the design phase (experimentation phase)

The first step is a time of experimentation, you'll need to test different placement options and configurations for your different elements. It's incredibly easy to do this with Figma, for example, as it allows you to simply drag and drop elements with each other without any code creation, thinking about SEO, responsiveness and that sort of development issue.

Webflow is a development tool

Webflow is a phenomenal tool for developing websites. However, creating websites requires a bit more structure, as you have to build the HTML and CSS structure (the code, behind the no-code). Therefore, it takes much more time if you are looking to develop with various configurations.

If you want to test two different designs for a section, for example for an A/B test, it will only take you a few seconds in figma. In Webflow, it will take you up to a few dozen minutes!

Webflow is therefore not ideal for testing website concepts. It is ideal for developing a final version of your website. Moreover, in the experimental phase, each person gives his opinion... and the feedback process is simpler at ....

Any opinions on the design? Feedback process

To create a successful website design, all parties involved need to communicate and share their ideas. One of the most beneficial ways to do this is through the use of Figma, as it is a central place where all this different feedback can be gathered, instead of everyone having to send their own comments and suggestions to multiple places on the web.

Feedback on Figma

To leave a comment or note on a Figma file, just click on the button and type your message anywhere on the page! It's as easy as pie and doesn't require any form of integration.

Feedback on Webflow

Leaving feedback on a Webflow project is a different story... The software does not allow it natively (because it is not designed for that ? 😅 ). The process is therefore more complex : you will have to :

  • Use external solutions: like markup.io, which allow you to leave comments on a web interface
  • Recording videos on Loom
  • Take screenshots and report by section

In short, the solutions are less functional and less simple than simply posting your comment on the Figma wireframe.

To conclude: Figma → Webflow

Using a web tool to design a mock-up of your website before developing it has many advantages:

  • Faster
  • More flexible
  • Allows for different tests (A/B test)
  • Easy feedbackprocess

Webflow is excellent for creating a responsive site, but not for creating a prototype. Our agency will advise you in any case to start your design process (design system) on a prototyping tool like Figma, before developing a full version on a CMS like Wordpress, Wix or Webflow.

Want to know more? Discover the advice of our webflow agency to create a wireframe for an e-commerce website on Figma.

Flomodia by Digidop
Coudac project by Digidop
project Heka by DigidopFlaw by project DigidopMorfo project by Digidop