Mapping out a better digital experience for passionate envrionmentalists 🏝

Mapping out a better digital experience for passionate envrionmentalists 🏝

Mapping out a better digital experience for passionate envrionmentalists 🏝

The Great Canadian Shoreline Cleanup (GCSC) used to have a problem: why are coastal Canadians the only ones doing shoreline cleanups when every province and territory can take part? We learned that people thought "shoreline" cleanups could only happen if they lived near an ocean. In fact, a shoreline is defined as wherever water meets land, so that includes rivers, lakes, ponds, and even sewers. Our mission was to get more Canadians leading and joining community cleanups around the country.

💼 Client: Great Canadian Shoreline Cleanup
💪🏻 Challenge: Get more people leading and joining shoreline cleanups
💡 Solution: Enhancing GCSC's digital design system and content strategy
📊 Results: Annual increase in shoreline cleanups happening around Canada

Localized homepage of the GCSC website

When landing on the site, users will see all cleanups happening at the shoreline(s) closest to them, as well as images of local wildlife that are affected by shoreline litter. If no cleanups exist, then prompts will appear to encourage them to start one in their community.

The GCSC collects data from every cleanup they've had (e.g. types of trash, a cleanup's worth of litter in kilograms), so we highlighted this information throughout the site. We designed the map terrain to be high-contrast, and paired it with a set of custom map pins to help users distinguish shorelines and types of cleanups much easier.

Map of Winnipeg with all the cleanups available
Sneak peek of the GCSC styleguide

In developing the design system, we were meticulous with every single detail. We proposed using Tofino as the brand typeface because it reflected the clean and approachable nature of the brand, and it was created by a local Vancouver designer (named after a popular surfing destination). Our colours were lovingly named and calculated to contrast well with each other (especially in illustrations) and reinforces accessibility when used appropriately across the site. In designing the iconography for the trash tally app, each icon was user-tested to ensure people understood what each one meant.

Cleanup illustration used on the GCSC site
From paper to app, we made it easier for trash to be tallied at cleanups

Skills & Tools 🧰

  • Brand Strategy, UI, Design System, Illustration, Iconography, Prototyping, User Testing
  • Sketch, Adobe Illustrator, Mapbox

My Role ✨

Lead Designer

View Other Projects

Power Smart For Schools ✂️Design for Science-Based Education

Ocean Wise 🌊Design for Flexible Storytelling

TuGo 🗺Design for an Untapped Travel Market

Rocky Mountaineer 🚂Service Design for a Better Journey

© 2020 Gracelle Mesina

© 2020 Gracelle Mesina

© 2020 Gracelle Mesina

© 2020 Gracelle Mesina

© 2020 Gracelle Mesina