Endangered Waves App
PROJECT OVERVIEW ––––
The Save The Waves Coalition protects coastal ecosystems around the world in partnership with local communities, utilizing a unique combination of protected areas, economics, and direct action.
They partnered with MJD Interactive to create Endangered Waves, an app that empowered surfers to report issues on their local coastlines. I was fortunate to be on the design team while interning as a UX/UI Designer at MJD Interactive.
View MJD’s Case Study.
Handing off developer-ready assets
AWARD WINNING APP
The Big Ocean Button Challenge, sponsored by XPRIZE, was a $100,000 mobile app development competition. The Endangered Waves app surpassed more than 300 competitors for the best conservation app, resulting in it being one of the 7 winning recipients.
“This competition was designed to encourage app developers and data scientists to work toward a future where the world’s ocean data is available at our fingertips, visualized in a user-friendly and meaningful way.”
Clearly convey the essence of the Endangered Waves app through visual design.
A simple iconography set to illustrate the 6 different coastal threat categories, and a seamless onboarding tutorial of the app.
INTUITIVE ENOUGH TO KEEP ENJOYING NATURE
Endangered Waves is an app to empower surfers to take action when they see a coastal issue. There are over 30 million surfers worldwide who deeply care about the ocean.
Thinking about the users (surfers, conservationists, & coast-lovers worldwide), the app needed to be intuitive enough to quickly report an issue and allow them to get back to enjoying the outdoors.
SIMPLE ICONS TO REPRESENT COMPLEX ISSUES
Coastal threat categories: Oil spill, Sewage, Trashed, No Access, General, and Coastal Erosion
I designed the iconography set to represent the different coastal threat categories that users can file their issue under. The icons are simplified and designed to be recognizable at small sizes.
APP ONBOARDING SCREENS
Low-fidelity Wireframes of app
Interactive Low-fidelity Prototype
High-fidelity design of onboarding screens
ONBOARDING SCREENS TO EDUCATE
The final onboarding tutorial resulted in 3 screens that represented how the app works. White dashed lines are used to illustrate the fact that your reported issue gets sent off to the proper people. Similar iconography was used in the onboarding to make users feel familiar with the app upon first use.