Waterlogic.

How we helped.

Waterlogic are one of the world's leading providers in water coolers and purification, with a total of 25 separate websites around the world. We've worked with them since 2014, when we inherited their MODX website setup, so we were thrilled to be able to work with them from the very start on this - including a brand new design and MODX development approach.

Due to having ongoing world wide campaigns, they needed the ability to quickly and easily create landing pages and content, so they could respond to market research as soon as possible. This led to us using a Content Blocks approach in MODX - effectively creating a library of sections that could be combined to create any page. Some of these were then saved in to set layouts, to aid with user journeys and conversion.

Going in to the project, we had a detailed scope for the pages and sections needed, which was created off the back of knowing which problem areas existed on the current site. This meant we could create a solution that was a huge improvement on what they had - not just from a visual and user experience perspective, but a development and administration one too.

The outcome.

Due to the scale of this project, we used a more agile approach - meaning our planning, design and development phases overlapped. The outcome? A library of around 300 blocks of content, saved in to 80 pre-made, ready to go layouts - all of which are set up to handle translated content for each country's website. The design is cutting edge, encompassing the challenging logo droplet shape in to multiple content blocks - creating a look and feel that sets Waterlogic far apart from any competition.

This site has won 3 awards!

View

View

View

Feeling inspired?

Let's create something together.

Get in touch.

Responsive website design for Waterlogic

E-commerce website design for Waterlogic

An approach that works.

Without fail, every website we create involves 4 phases; planning, design, development and quality control. This was no different for Waterlogic, despite using a more agile approach. Each key section of the site started off with scoping and wire-framing to ensure it worked as intended with regards to displaying content, whilst aiding the user journey and conversions. Only once this was achieved, would that section move in to design - where it would come to life a little more!

We used Adobe XD through the entire wire-framing and design process, which enabled us to fully prototype sections and interactions across multiple devices. This gave us a real accurate insight to the user interface, before passing things to the development team. As you can see below - we built quite the collection of XD art boards!

The development team then worked through sections in order, building up to completed full page templates. This meant the project progressed at a steady rate and we could release certain areas of the new site back to Waterlogic, for their content input. Due to the volume of sections and settings that were being released, part of the handover also included detailed documentation for each area. The docs area categorised the library of content, listing each block with a visual and all the required settings. As well as assisting with administration, this allowed Waterlogic to keep complete track of everything available to them.

MODX - everything you need and more.

It was decided early on to use Content Blocks to give Waterlogic the flexibility they needed. The sheer volume of fields, layouts and templates give great flexibility in themselves, but we wanted to go a step further with additional settings on each of these. These settings gave the ability on a per block basis, to tap in to various styles and structures at different breakpoints - meaning there really wasn't anything Waterlogic couldn't achieve on a page.

The new MODX setup is also multi-context, meaning each of the 25 separate websites is controlled through one MODX manager area - crucial for easy administration. Each context then has its own set of permissions and additional settings to further ensure secure customisation. The full content blocks library was made available across all contexts, so Waterlogic could individually administer each site, whilst still choosing content to replicate from one to another should they wish.

The new setup also included a dedicated area to manage global content translations for each site - giving them the ability to accurately update multiple areas of translated content at once - another huge win for the administration team.