ABOUT

About the client
CASP is a not-for-profit charitable trust conducting field-based geological research to provide insights into key elements of sedimentary basin evolution. The origins of CASP date back to 1948 and the Cambridge Spitsbergen Expeditions. The results of their research are published in internationally renowned peer-reviewed scientific journals. They have an internationally significant collection of more than 35,000 samples, often from hard-to-access areas.

Project goals
The CASP website was over a decade old. Typically for a site of this age the design was dated, it wasn’t mobile-friendly and it was hard for users to find what they were looking for.

Goals for the redesign:
- Highlight the vast rock and fossil sample collection via an interactive map
- Provide an easy to use CMS for content editors and admins
- Improve the user experience so the site is accessible and informative for potential clients

The interactive map
CASP wanted the interactive map to wow users and attract potential new clients. It is important to show where CASP work across the globe and share the findings from their geological research. The map would enable CASP to show their collection of rock and fossil samples – this meant we would need to show more than 35,000 data points! It was our biggest and most ambitious map to date.

The map is powered by Laravel and Leaflet. Laravel and Leaflet work together to create a powerful PHP backend application to process and organise data and an interactive frontend application to display the map.

We imported the samples with their related metadata from CASP’s GIS database into our new application. The interactive map has its own CMS and users can display, manipulate and filter content intuitively.

Because there is so much data, we had to think about how to present it to users in the most accessible way.

There are three main ways for users to navigate the map:
- Clustered samples: It would not be advisable to show 35,000 entry points – from both a user experience and a website performance perspective. So, we clustered samples together – grouping samples in a general area where CASP work. Once in a general area, the user can then drill down to find specific samples.
- Zoom and pan: The user can zoom in and pan out to explore geographical locations.
Spatial search
- A spatial search: allows users to draw a rectangle on the map over the area they are interested in. Data within this specific area then appears.

Once the user has reached the end point of their navigation journey, they will see details about the samples in a pop-up box, including country, sample type, material, lithology, and project details.

Some of the data presented in the pop-up is hyperlinked to the main CASP website, where the user can find context for the research. This supports CASP to continue engagement with users.

An easy to use CMS
Only one person was editing content on the old CASP website, but the client wanted more people involved in the editorial process. The CMS needed to be easy to use so that admins can make copy changes, upload new content, and keep the site refreshed. The old site was built in Drupal, but we built a new site in WordPress.

The CMS is used as an archive for three main types of content – reports, publications, and meetings. We took time to carefully create bespoke models in WordPress that were tailored specifically to CASP’s administration requirements.

We created an import tool for each of the three types of content to enable admin users to easily add reports, publications, and meetings. Each content type was given custom fields based on abstracts, authors, and other content to enable admins to import content via CSV files. The content organisation was meticulously planned and well structured. Admins now have a system to import, store, showcase, and access content at the touch of a button.

By taking advantage of core CMS features, we could then also let visitors search for, export, or share their results as either CSV files or links.

Improving the user experience
We kept the design simple. We embedded mini maps throughout the website to highlight regions or project areas and encourage users to visit the interactive map. The mini maps provide an easy way for users to move between the website and the interactive map.

We showed new relationships between data so that it is clear what projects and reports contributed to what data visible on the map.

We future-proofed the website for development, which may include introducing a portal area for subscribers.

"We are very pleased with the new website and interactive map Studio 24 have developed for us. It was clear from the outset that Studio 24 are leaders in designing bespoke maps for the internet and we are excited for users to explore our vast sample and report catalogue. Working with a local company was a bonus and despite the restrictions posed during the COVID pandemic we had regular contact with Studio 24’s knowledgeable team in developing our modernised, stylish and dynamic website." Simon Passey, Geoscience Data Coordinator, CASP

The outcome
The CASP website is modern, interactive, and engaging. With an exceptional user experience, users can easily find samples as well as reports, publications, and meetings. With a bespoke designed CMS, admins have everything they need to update content and effectively promote CASP’s geological research.