Helping an organisation to deliver global climate and atmospheric information

Code Enigma have been part of the European Centre for Medium-Range Weather Forecasts (ECMWF)’s framework since 2014. Copernicus is  the European Union’s flagship programme for monitoring the Earth’s environment using satellite and in-situ observations. ECMWF implements two of the Copernicus services, the Copernicus Climate Change (C3S) and the Copernicus Atmosphere Monitoring (CAMS) Services on behalf of the European Union. We applied for some work from an EU wide tender because we categorically knew we could design, build and host the new websites. We were happy to oblige when they asked us to review their Drupal 6 sites, one in particular which needed some heavy-duty cleaning. Over time it had collected a lot of bolt ons and was no longer fit for purpose, and some information architecture (IA) changes were needed.

Using Drupal was a unanimous choice from both sides; there was no need to consider an alternative CMS. In this case, we updated the site from 6 to 8. From our development perspective, this also allowed us to create the two sites with ease.

A design consultancy called cxpartners had previously completed some UX testing. We had meetings with them at the beginning of this project and adopted their user research findings, using their IA recommendations and wireframes to guide our design. We collaborated with them throughout to ensure we built consolidated websites that were considerably more usable than their predecessors.

We worked on this from June 2017 until February 2018, dedicating the skills of our head of design Justine, and technical wizards, web developers Chris, Steve and Andy over the course of 6 two week sprints.

We first looked at the similarities between both sites, and built one website which covered all of these. When it came to making the custom parts which make up the Climate Change Service (C3S) and Atmosphere Monitoring Service (CAMS) we cloned the site and worked on the remaining tasks in order of their importance, following Agile principles and not focussing on one site instead of the other. 

Some of these custom parts included integration of their Climate Data Store (CDS) and the CAMS Catalogue, both produce great volumes of data. At the moment the CDS handles more than 12,000 total number of data requests which is over 7,359 TB of data! 

The front-end of the site was made with Pattern Lab, which meant that we designed parts of the site and not pages, freeing up initial design time and giving the developers more time to build a better website. When we got to a feature that needed designing, its requirements were considered by the project team and the designs made alongside the development. This also meant that when CAMS wants to use features that C3S has the markup is already made and the feature can almost drop into place. 

Conclusion

We’re pretty proud of our plan to build one site and then cloning it into two, it saved a lot of time and money in doing so. It wouldn’t have been possible to spot as many of the similarities if we didn’t have the user research from cxpartners, this information was invaluable to us - highlighting the value in user research. When we reached the end of the project and the same final change requests needed to be made to both websites individually it was clear that this approach was the right way. 

Throughout the process we were evaluating PatternLab, and even though we’ve used it before, with St. John’s and HLT we’re constantly trying to improve the way we work. 

After this project we’ve taken the best components and the best parts of our build and created a more pared down version of patternlab, that we affectionately call Baby PatternLab which removes some of the features of the starter kit we were using but keeps all the essentials that we definitely use. We don’t believe in that all because you can use it, that you should use it, even if it is new and cool and shiny! 

We also created JSONpopulate, a tool to allow designer to quickly add real content in PatternLab via a simple interface like how you can with the Craft plugin in Sketch. 

Code Enigma’s collaborative way of working really made me feel part of their project team, we became one team. They handled our custom code and other integrations with great care and ease. They were a pleasure to work with.

Eva Remete - Web Content Officer