Headless e-commerce platform with UI/UX redesign

Drogisterij.net

Drogisterij.net has been one of the largest online drugstores in the Netherlands for more than 20 years and is a staple in the Twinkle100. With a range of more than 70,000 products from self-care to household items, it serves a growing group of customers.

New platform: Magento Open Source

Drogisterij.net had been using a self-developed e-commerce platform for over 15 years, entirely in-house. To achieve further growth, a future-proof e-commerce platform is essential. For Drogisterij.net, XSARUS was the right party to partner with, partly due to the knowledge and experience in headless commerce and Digital Marketing.

The main requirements for the new e-commerce platform: user-friendliness, speed, and optimal user experience. The goal is to generate more organic traffic and achieve a higher conversion rate. A turning point in Drogisterij.net's digital transformation: leveraging technology as a marketing tool.

More standardisation, less customisation

To make the Drogisterij.net webshop future-proof, a headless commerce setup was chosen. This is based on less custom code and more standard environments with strong user functionalities. The chosen headless Magento setup is a combination of Magento Open Source and Prismic as a content management system. The best of both worlds come together in the Nuxt.js frontend. The frontend is more flexible, and development speed has greatly increased. Drogisterij.net developed the integration between Magento and various APIs, XSARUS provided the e-commerce engine, design, and headless frontend.

The new e-commerce platform provides us with all the technical tools to effectively and at the lowest possible costs run our webshop successfully. This is essential to survive in the highly competitive market in which Drogisterij.net operates.

René Santifort, E-commerce Manager Drogisterij.net

Integrations with various systems

Thanks to the integration between Drogisterij.net's ERP and Magento, data is exchanged between the two systems. Additionally, various third-party systems are linked to the e-commerce platform, including Buckaroo, DHL (service points NL), Spotler Activate (formerly Squeezely), Flowmailer, Spotler, Kiyoh, Zendesk, and Google Tag Manager.

UI/UX redesign

In the existing situation, Drogisterij.net had two separate environments for desktop and mobile, lacking consistency and usability. This was converted to a single responsive design. By setting up a design system, a strong foundation for the visual appearance of Drogisterij.net is now in place. Unity has been brought in colour use, typography, and icons.

Based on data and XSARUS best practices, a better user experience has been established, which can be further developed in the coming years.

Elasticsearch search function

The addition of Elasticsearch has simplified searching for specific products, categories, or brands. Additionally, the function plays a more prominent role. Drogisterij.net experiences immediate results: data analysis has shown that visitors who use the search function have a significantly higher conversion rate than users who do not use the internal search function during a webshop visit. The filtering options have also been greatly improved.

Conversion optimisation

In addition to the improved UI/UX, one of the goals was to achieve a conversion optimisation boost. How do we ensure that the webshop's conversion power improves and the value per session increases? Data analysis has shown that mobile users have a large share in the conversion. This was the starting point to implement optimisations from a mobile-first perspective.

Spotler Activate implementation

XSARUS has implemented the Customer Data Platform Spotler Activate at Drogisterij.net. As a result, on various pages, product recommendations and bestsellers are shown based on visitor profiles and click behaviour. Visitors will experience a more personalised customer experience.

Result

Even more has been tackled in the field of Digital Marketing:

The addition of the XSARUS check-out in the order process has increased the flow rate on the webshop. Partly due to this checkout optimisation and the improved UI/UX design, the conversion rate has increased by 42%. And on mobile devices, it has even doubled.
All technical (SEO) matters are configured to the current Google guidelines.

Conversion rate

Outcome of the collaboration

Combining the headless commerce setup, Elasticsearch search function, improved UI/UX, and extensive conversion optimisations has allowed Drogisterij.net to make tremendous strides in professionalisation, stability, and efficiency. Visitors experience a fast, user-friendly webshop with optimal search and filtering capabilities and a personalised customer experience. Drogisterij.net is definitely 100% ready for the next steps in its digital transformation.

The biggest win for Drogisterij.net is the clear conversion improvement. The revamped UI/UX, speed of the webshop, personalised products for visitors, and good data insights have all contributed significantly. Because everything is measurable, we can continue to optimise.

René Santifort, E-commerce Manager Drogisterij.net