The Vev Workflow: From Idea to Live Site

October 25, 2021

Words by Tine Karlsen

Unite designers, developers, and marketers into one streamlined workflow to co-create web experiences with creative & technical freedom for all.

If you have ever worked on a web design project, you know that many obstacles are standing between your vision and reality. Teams are stuck in silos and forced to follow a workflow dictated by their tools instead of being empowered to co-create the way they want. And the CMS platforms we use are too often beholden to their templates instead of allowing true creative freedom. The challenges are also different for the different team members.


The Marketers Dilemma

We all want to stand out and engage our audiences with outstanding experiences on the web. But how often do we find ourselves adapting our ideas and projects to whatever tools we are using? Fitting your idea into a template in a CMS forces you to compromise on your vision and ultimately affects how well you perform as a marketer. To get your unique ideas out in the world, you might find yourself fighting for both design and developer resources, and the time-to-market on hard-coded concepts is too long to defend the investment it takes to test new marketing tactics.


The Designer Gap

As a designer, you might have experienced that you have produced beautiful content that loses its shine because it is squeezed into a template in your CMS. You might also have tried using no-code website builders but you end up limiting your design to the functionality available on the given platform. To create something truly unique and on-brand, teams often have to choose to hard-code, a process that brings on challenges of its own.


You create your pixel-perfect vision in a design or prototyping tool and proudly hand it over to a developer to make your masterpiece a coded reality. When you see the result, some transitions were not compatible with coding standards, the mobile layout was a bit off, and subtle ideas got lost in the process. Because you depend on your developer to make tweaks, you end up in timely iterations going back and forth to make changes directly in the code.







Development Time-Suck

With your coding superpowers, you are a highly sought-after resource. Developers often feel spread thin, spending valuable time on low-impact tasks such as building short-lived landing pages, changing pixel sizes, and fighting to adapt designs to fit into coding standards. All the while, impactful strategic developments and innovations that could improve company performance and workflows are put on hold.

Vev's Design Editor: A visual, drag-n-drop interface for making responive layouts.

An Alternative No-Code, Low-Code Reality

There is another way to bring your most ambitious ideas to life on the web as actual ready to publish code, faster and smoother than ever.   


With Vev, you can bring previously siloed teams into one tool for seamless collaboration and establish a streamlined workflow for creating and launching anything front-end, appealing to all sides of the web design process.


Since everyone on the team can collaborate in real-time, Vev essentially eliminates the need for prototypes and endless handoffs. Building and QA happen at once. What might've taken weeks to build with custom development can now happen in hours.


Vev combines the control and speed of no-code with the flexibility and creativity of code, which means users can produce websites with complete creative freedom for design and content, with the flexibility to edit and create code components when needed.


Ultimately, Vev enables every role to spend time on what they are passionate about and good at!




Bridging the Design Gap

Build sites and web content in Vev similar to how you work in your favorite design or prototyping tool, while the code is automatically generated in the background.


"I was struck by how incredibly intuitive and expansive the tool was and how quickly I was able to create what I envisioned with very few hindrances."

Mikkel Smith
Art Director @ D2

"Fantastic tool. I can work from anywhere and the tool enables me to make designs and completely finished sites without much help from developers. I feel I have more control over details and am able to get a better finish.”

Designer @ Schibsted

If you ever meet limitations or need custom functionality, invite your developer to work on that specific element. Anything your developer creates, you can edit visually and reuse across projects. This provides autonomy and speed to your workflow without limiting creativity.


You can also create templates and reusable design components to share with your team — scale design, feeling confident that your brand comes across correctly every time.

Scaling Content Marketing

With Vev, you and your team can generate a set of templates, designs, and components (such as forms) that makes it easy for marketers or other team members to whip up new landing pages, banner ads, and more based on existing layouts.


"Easy and fun! The instant reuse of design enables the process of making solutions right during our meetings so that all stakeholders can get a visual and agree right then and there - super efficient!”

-Business Developer, Schibsted


Vevs content editor allows you to only focus on content without the risk of breaking designs or layouts. Stay on top of hidden features, engagement, and conversion rates by connecting third-party platforms and services to handle anything from tracking, pixels, compliance, and more.


"Vev is like lubrication for my workflow!”

-Marketer, Schibsted


As a marketer, you gain the ability to Move faster, test more ideas and engage your audience in new creative ways.  


"We have cut several joints from idea to complete product. Increased efficiency and we work together in new ways. In ways like we haven’t been able to before!”

-Marketer, Schibsted






Schibsted
Workflow

Learn how an international publisher decreased their time-to-market from 3 weeks to 30 minutes.

Save Development Time and Focus on What's Important

Vevs approach to coding means that companies can expand the platform's functionality and add new features to specifically suit their needs. Vev empowers collaboration between engineers and designers by enabling them to do their best work in a single tool. Designers focus on design, and developers create high-quality React components using tooling similar to the platforms they already use.

"Vev enables users to focus on their primary objective. A developer can focus on actually developing, making integrations better and flawless, while a designer can focus on design.”

-Developer, Schibsted

The components built in Vev can be connected to visual editors that allow designers to edit the CSS and input without entering the code, removing the need for timely iterations and design tweaks. Moreover, any new feature engineers build into the platform empowers less technical team members to work independently on future web projects.

"Tech developers are now focusing on quality assurance instead of coding a design. This has led to fewer misunderstandings, and we spend less time on interactions that are time consuming.”

-Developer, Schibsted

Build websites and web content with styleable design components, and interactive React components that can be one-click-published directly to any CMS (such as WordPress), backend, or hosting provider. This opens up for using Vev without the cost of switching CMS.

Azure, Rectangle, Triangle
Material property, Atmosphere, Dishware, Grey, Sky

Every month, get the inspiration you crave

Get our monthly newsletter straight to your inbox.
You can always unsubscribe at any time.
Privacy Policy

Read More

Colorfulness, Cloud, Rainbow, Sky, Purple, Violet

NPM and You: A practical guide to using NPM in Vev.

by Joakim Elki

Light, Azure, Blue, Gesture, Glove, Font

Tech header with Lottie animation

by Parker Tinsley

Communication Device, Material property, Shoe, Vertebrate, Product, Gadget, Mammal, Font, Rectangle

A design that inspires optimism and change, accessible

by Parker Tinsley