Why a designer should typeset himself, and how to do it quickly

Web design is no longer pictures in Photoshop. An understanding of HTML and CSS is found in every job as well as knowledge of English.

Layouts are not needed

Since the founding of the Studio, we have been thinking about how to optimize design processes and do without a layout designer. The first two months we were building sites on Visual Composer for WordPress. Using a crude plug-in with a drag-and-drop interface was similar to the expression: “The mice cried, pricked, but continued to gnaw the cactus.”

Still, this option was better than looking for a layout designer – clients could not wait, and there was no money for an extra salary. After several projects, we realized that this could not continue, and we began to look for a new tool. And we found Webflow.

The new visual editor has become the main design tool in the Studio. He helped us to get rid of the “designer-coder” bottleneck forever and to speed up development at times. The quality of projects has improved significantly because the designer has complete control over the layout.

The first iPhone and new standards

2007 saw the rise of mobile traffic, content and standardization with the introduction of the iPhone. New frameworks were created with ready-made templates for sites. Frameworks have had a big impact on the development of web technologies: more than 15% of all sites are built using one of the most popular Bootstrap libraries.

The main drawback of frameworks is that designers cannot get into the code and change everything themselves as they want. You have to pull the layout designer, then the developer – and so on in a circle. As a result, a lot of time was lost.

It s scary to realize that the studios still keep layout designers on their staff. We came to the conclusion that we changed the layout designer to a visual designer. The money saved was spent on a course on HTML and CSS for a designer and his salary was raised to control the layout.

With the advent of visual designers, the very concept of layout is used less and less. Now no one opens Dreamweaver or Muse and does not typeset the layout sent in Photoshop. The code faded into the background. A designer can put together a simple website in a couple of hours.

By comparison, a newbie to Webflow will outperform a layout designer in terms of speed. Instead of writing a few lines of code, saving and updating the browser, just drag and drop the desired block, all changes are visible in realtime.

The creators of Webflow believe that the work of a designer should be tied primarily to visual tasks.

/

One of the main advantages is that all projects are initially adaptive. If the layout designer adapts first for tablets, then for the horizontal and vertical orientation of the phone, then the project in Webflow is automatically created adaptive. It is enough to adjust the dimensions and parameters to make everything look good.

The creators of Webflow have taken the popular Bootstrap framework as a basis. The result is a powerful enough tool to become the backbone of a large product, and versatile enough to solve smaller problems.

5 more reasons for Webflow

Easy to create interactions. If we again compare it with a layout designer, then such an animation would take him much more time, when in Webflow it can be done in a couple of hours.

Symbols. You can turn components that you want to reuse in your project into symbols. Then changing any instance will change others. Changed the header on the main page – it will change on other pages. It s like symbols in Sketch.

Templates. You can create a single template for a product or typical projects. Font styles, icons, colors and other elements of the guideline will always be available.

Versioning and backups. After each change, the project is autosave, and after every 20th autosave, a backup is created. If for some reason you need to see how your design looked three days ago, open it and see.

Feedback. Webflow has a great community. On the forum, you can discuss tricks and problems with other designers or service creators. A useful thing is a wishlist where users write what they are missing in Webflow. Topics are raised by popular vote, and the creators change the status of the desired feature to “planned” or “in development”.

Webflow works only in a browser and only with the Internet. From personal experience I can say that there were times when there was no Internet, but you had to work.

When creating pages with a large number of components and interactions, the service still does not stand up and starts eating RAM like crazy. In my memory, this happened only in a couple of projects, but the residue remained.

Standard elements like container and columns are not customizable. You can type everything yourself from empty blocks, but this is a layout on crutches, and the developer will not like this.

There are drawbacks, but they do not outweigh the main advantages: speed, user-friendly interface and almost limitless possibilities in the right hands.

1. The designer must control the layout.
2. Visual editors are great.
3. Fire the layout designer.
4. Buy a visual editor.
5. Create a library of templated elements.
6. Give the developer the finished layout, not the pictures.

Source: DesignKabak