Logo - Mooveno

A new website and communication strategy for the automotive company

Project type

New website

Industry

Automotive

Technologies

logo Drupal Drupal
Logo Tailwind CSS Tailwind CSS
Logo Vue.js Vue.js

Scope of work

Pre-implementation analysis, graphic design, web development, support and maintenance, content strategy, and copywriting

  • Changing the direction of communication and key messages of the Mooveno brand on the website
  • Strategic offer segmentation according to the number of cars
  • Modern layout with animations
  • Interactive price list allowing users to calculate services
  • Technology selected with scalability and content editing convenience in mind

About the Client

Mooveno is an innovative Polish company reshaping the automotive industry. It brings together six key areas of everyday fleet management – from washing and charging, to parking, refuelling, highway tolls, and vehicle condition monitoring. This integrated approach streamlines administration and helps businesses manage their fleets more sustainably.

Tomasz Czerniejewski

Chief Executive Officer / Mooveno

Our collaboration was seamless from start to finish. The team was proactive, offering valuable solutions, responding quickly to our needs, and consistently delivering on time. We are very pleased with both the cooperation and the project's outcome.

The Challenge

Mooveno decided to broaden its operations to address the needs of new market segments – not only large enterprises but also small and medium-sized businesses. The previous website was designed mainly with corporations in mind, and as a result, it no longer reflected the expectations of these new customer groups.

The second major challenge was communication – both the content and structure were overly complex. As a result, users struggled to understand what Mooveno offered and how its services worked.

Instead of driving growth, the website turned into a barrier: new visitors couldn’t grasp the value proposition, while existing clients lacked clear information about the benefits of collaboration.

Drupal - ikona
Logo Tailwind CSS
Logo Vue.js

The Goal

Mooveno had clearly defined expectations. Our goal was to create a website that would meet the needs of every customer. To achieve this, we had to focus on three strategic areas: communication, graphic design, and development.

  • Firstly – simplify the language, showcase the services more effectively, and clearly highlight who can benefit from Mooveno’s offer.
  • Secondly – the website’s design. The new site required a clean content structure, a lightweight design with technological accents, and animations featuring subtle motion effects to enhance the user experience. An interactive price list was also planned to let users quickly calculate service costs based on fleet size and selected options.
  • Thirdly – the technology. Mooveno required a flexible, easy-to-edit CMS. Since the company intends to expand its offering, the website had to be scalable and ready for future growth without the need for constant developer involvement.
Mooveno - project's goal
Background element

The new Mooveno website required a holistic approach: a change from communication to technology. We strived to create an intuitive website that drives sales.

How did we deliver it – step by step?

  1. We began with a pre-implementation analysis – identifying the most important areas for improvement, understanding the client’s needs, and defining clear expectations. Based on this, we outlined the project scope.
  2. We immediately began building the content strategy – analyzed the company’s communication style, user paths, and main offer segments.
  3. We then organized content strategy workshops, where we proposed the tone of voice and key brand messages. Together with the Mooveno team, we developed solutions in these areas. This stage concluded with a document capturing the most important strategic assumptions – a foundation for further work on the website’s structure and content.
  4. In parallel with the copywriting, we designed the subpages. Guided by the content plan and completed briefs, the content and UX teams worked closely together, regularly aligning to strike the right balance between messaging and visual design. The developers were also engaged in the process, collaborating on implementation solutions. As a result, we created ready-to-use mockups with embedded content, which were then presented to the client for approval. This significantly streamlined communication and eliminated unnecessary iterations.
  5. The final step was the website implementation – the centerpiece of the entire project. After weeks of intensive work, the new site was ready to launch. The developers faithfully recreated the structure from the mockups, added content, and ensured the smooth functionality of every element.

Read more for more technical details.

What CMS Did We Choose?

With numerous sections, extensive content blocks, multiple subpage variants, and dynamic elements, the Mooveno website required a system capable of handling such complexity. That’s why we chose Drupal 11. From the client’s perspective, the key advantage of this CMS is flexibility: administrators can easily manage content, move blocks, edit, and expand the site as needed. In addition, Drupal is highly efficient, handling extensive menus and multi-level navigation with ease.

Modular structure of the Mooveno website

Modular Website Structure

We designed the Mooveno website with Drupal Paragraphs, which can be configured, rearranged, and combined into flexible layouts. Each paragraph was styled and tested to ensure it functioned correctly in various configurations. This approach enables editors not only to add new blocks to existing subpages but also to build complete landing pages. All necessary elements are stored in the CMS library, with a preview option available. As a result, publication time is significantly reduced, and further website development becomes easier.

From a technical perspective, the visual layer was built with Tailwind CSS, ensuring a consistent website interface. The framework also streamlined implementation, allowing smooth adjustments without downtime – even when new requirements or modifications were introduced.

The Single Directory Components approach streamlined the project structure. Each component (e.g., a single block with graphics and text, or a section with a form) had its own dedicated space: code, styles, and tests. This ensured that changes to one component didn’t impact the others.

Dynamic price list

Dynamic Price List Based on Vue.js

We used Vue.js on the front end to dynamically render the pricing module – smoothly and without page reloads. Thanks to this, users can calculate package costs in real time by simply selecting the number of vehicles and the desired service range. Administrators can easily edit the module, adding new services and discounts. This gives Mooveno full flexibility to manage its pricing policy on an ongoing basis.

Offer segmentation

Offer Segmentation

We designed the website based on the segmentation defined by the client:

  • 1-5 cars (individual clients or small companies),
  • 6-50 cars (mid-sized companies),
  • 50+ cars (enterprises).

This approach was essential, as service availability and discount levels vary depending on fleet size. The segmentation guides users from the very beginning – by selecting one of the three groups, they immediately see only the services relevant to their fleet segment.

Animations

Animations and Stack Effect

Together with Mooveno, we sought the best way to give the website a modern, tech-inspired look. To achieve this, we incorporated animations and microinteractions, such as stack effects (block movement and overlapping on scroll), subtle transitions, shifts, and the insertion of additional elements. Our goal was not only to enrich the visual layer but also to make sure the animations enhanced users’ understanding of the offer.

Floating footer

Floating Footer with CTA

We added a footer on the homepage that encourages users to choose their segment. As visitors scroll toward the bottom, a CTA bar dynamically expands, drawing attention to the next step – selecting a path tailored to their fleet size.

Safe and repetitive implementations

Safe and Repetitive Implementations

We optimized the project architecture to enable fast and error-free changes. To achieve this, we used CI/CD pipelines and Docker. Once configured, the automated update process enables subsequent changes to be deployed with a single click.

Lightweight, dynamic, and infused with technology – that’s the new Mooveno website

This project was a complete transformation – not just in design and UX/UI, but also in communication. By addressing all three areas, we created a website that meets the needs of companies of every size, from single-car businesses to large fleets. Here are the results of our work:

Mooveno - effects of the project
  1. Simplified communication. Users immediately understand what Mooveno does and what benefits they can gain by choosing the services.

  2. Stable CMS in the latest version: Drupal 11.

  3. Three offer segments: companies with 1-5, 6-20, or 50+ cars.

  4. An interactive price list that allows for calculating the cost of services depending on the number of cars and selected options.

  5. Many different content blocks with the ability to add and build additional subpages.

  6. Microanimations and floating elements that enhance the user experience.

  7. Automated implementations that minimize downtime.

Statistics

50

block types

8

custom-made paragraphs

+ 60000

written characters

20

graphic designs

Do you need a website that grows with the company?