Mubea U-Mobility: Multisite for urban micro-mobility solutions
Multilingual multisite for presenting the company Mubea U-Mobility and for targeted marketing of the products Cargo and XBoard.
When the last mile becomes a cool experience, you can talk about an innovative product. And we managed to launch the XBoard website with almost the same ease. True to the motto #drivethewave. But let's start at the beginning:
The journey with Mubea began in 2022. For Mubea U-Mobility, the micromobility subsidiary of lightweight construction specialist and global automotive supplier Mubea, we developed several websites with Drupal 9 based on our own distribution “Brandcoded.” From the outset, it was clear that separate websites would be needed for the various products in order to specifically address the very different customer segments.
At the end of 2023, all sites were migrated to Drupal 10 and, with the Gin theme, now also have an attractive and user-friendly interface in the backend.
Project Goals and Results
Although the core idea behind all products is based on innovative, sustainable, and above all customer-oriented mobility solutions in the field of urban micro-mobility and logistics, the requirements vary greatly. The Cargo website is B2B-oriented and integrates an interface to Salesforce. The XBoard website, on the other hand, is aimed at end customers, is experience-oriented, and uses a Shopware component as its shop solution. Our goal was to develop all website modules and features in such a way that the three current sites could benefit from the functionalities and editors would find a uniform interface so they wouldn't have to constantly reorient themselves.
In the front end, we rely on a uniform basic layout that differs in style and intensity of the interface elements depending on the site. The consistent appearance creates a consistent integration into the brand architecture of Mubea U-Mobility and contributes to all of the company's product solutions being perceived as part of a common brand. Nevertheless, each product brand has its own scope for addressing specific target groups and designing content. To ensure a high degree of flexibility in maintaining the websites, the editorial team has access to a comprehensive set of content modules (paragraphs).
Challenges
Despite the sometimes graphically intensive content, our focus was always on quality control with regard to fast loading times and the continuous improvement of the user experience, especially on mobile devices. This is a task that requires constant monitoring, analysis, and optimization. To achieve this, responsive image styles, optimized image compression and loading speed, and lean code were implemented, among other things.
The particular challenge with the XBoard website was to integrate the video content in a way that was both high-performance and accessible and user-friendly. This meant creating a fluid and interactive user experience supported by the use of modern technologies and media. A special highlight, which unfortunately is not yet live, is an interactive module that combines click and mouse scroll interactions with video elements.
The focus of the Cargo website was on the flexibility of the backend when it came to recording product characteristics and possible combinations, which are then brought to life via a configurator using the modular principle of the product. The aim was to design the backend architecture in such a way that different combinations could be managed exclusively via maintenance. This includes various dependencies of the specifications across all product categories.
The configurator was implemented as a React application (headless) and receives data from Drupal via a REST interface. At the end of the configuration process, the website transfers the information and user data to Salesforce. The Salesforce connection is also relevant in the area of lead generation and was seamlessly integrated into the frontend design of the website to avoid any breaks in the user journey.
Small but powerful: We would also like to highlight the integration of the double opt-in functionality into the Brevo module, which was previously missing and has now been added by us.
Conclusion
Our motivation is to implement projects that do not require compromises – neither in terms of flexibility in content creation and editing, nor in marketing, e.g. through performance campaigns. And certainly not in terms of the technical quality and accessibility of the pages.
The product pages of Mubea U-Mobility have been specifically optimized for performance and marketing in line with our client's objectives. In addition, all pages achieve a WUX (Website User Experience) score of over 95%. This score evaluates the website according to the criteria of SEO, quality, web performance, sustainability, accessibility, and compliance.
In recent months, we have intensively optimized the pages in terms of accessibility and are striving for almost 100% accessibility in accordance with EN 301 549 and WCAG 2.2. Our goal is not only to obtain the seal of conformity through a BITV test by the BIK, but also to move Drupal further up the list of recommended systems on the BIK website – a place that Drupal deserves for projects in Germany.
