Seas At Risk interactive map

Project @ Fiasco Design

A WordPress-based interactive map focussed on the solutions to plastic pollution in our oceans.

View website

Services

  • Interactive Map
  • JavaScript
  • WordPress
Seas At Risk Interactive Map

Whilst working at Fiasco Design, I was responsible for the build of this WordPress-based interactive map focussed on plastic pollution in our oceans.

Interactive map approach

Taking the illustrated and animated assets and turning them into an interactive map for mobile and desktop.

The system allowed for content to be uploaded and added over time thanks to the WordPress CMS. A filter system allows visitors to show only the solutions related to them, or a country of choice.

Map pins indicate the 150+ solutions to plastic pollution, with popup windows to give more information and link to each solution’s website.

Language translation

The map is translated into multiple languages, empowering the widest global reach. We utilised the powerful yet simple WPML plugin for WordPress. This meant the client could update this content themselves without additional developer input.

Guided intro

The map also features a guided intro for users on their first visit. Built with JavaScript, the guided tour takes users around the map, opening and closing content and shows how to use the map via clear instructions.