top of page

Reef Rescue

Reef Rescue is a mobile app that lets users adopt and track coral growth to support coral restoration. It simplifies the adoption process, provides updates on coral development, and educates users about marine conservation. By making coral planting accessible, the app encourages participation in reef rehabilitation and raises awareness of ocean preservation.

Role: UX/UI Designer

Team: 1 member

Timeframe: 3 weeks

Tools: Figma

Problem

Coral reefs are rapidly degrading due to climate change and human activities. Many people want to help but don’t know how.

Solution

A mobile app that allows users to easily plant corals with a few taps. Users receive updates on their coral’s growth and learn about marine life. 

Impact

More people contribute to coral restoration, helping reefs recover faster. Increased awareness and education lead to long-term environmental benefits.

Research

  • Conducting 5+ in-depth interviews with eco-friendly individuals, conservationists, volunteers.

  • Exploring social circles and reaching out to eco-friendly organizations.

  • Gathering insights on user needs, pain points, and behaviors.

​“I want to help restore coral reefs, but I have no idea where to start or if my donation even makes a difference.”

“It would be amazing to see updates on the coral I helped plant, rather than just sending money and hoping for the best.”

“I’d love to learn more about how coral reefs impact the ocean and what else I can do to help.”

Survey Data

Gathered survey data to assess people's knowledge and awareness of coral reefs, ocean life, and related environmental issues.

Competitive Analysis
Coral Gardeners​
​

  • Strengths: Strong conservation focus, community engagement, global partnerships.

  • Weaknesses: Limited funding, scaling challenges.

  • Opportunities: Growing awareness, tech-driven monitoring, partnerships.

  • Threats: Climate change, funding competition, regulations.

Coral Guardian
​

  • Strengths: Clear adoption process, strong community involvement.

  • Weaknesses: Poor mobile experience, low event visibility.

  • Opportunities: Corporate collaborations, interactive engagement.

  • Threats: Competition, low visibility in volunteering.

Coral Restoration Foundation
​

  • Strengths: Restoration expertise, research-backed methods, strong partnerships.

  • Weaknesses: Regional limitations, funding challenges.

  • Opportunities: Rising climate awareness, tech advancements.

  • Threats: Climate risks, resource competition, regulations.

Affinity Diagram

After completing the interviews, I conducted an affinity mapping to:

  • Synthesize insight 

  • Identify common themes across responses. 

  • The results of this analysis directly informed feature priorities, user experience enhancements, and engagement strategies.

User Persona & User Insight

Emma wants to help conserve ocean life and protect coral reefs and needs simpler ways to contribute to coral reef restoration and make donations.

User Journey Map

Emma's user journey map for Reef Rescue highlights her experience from learning about coral conservation to actively participating in reef restoration efforts through the app.

Ideation
Point of View Statement

Users seeking to learn about coral reefs need a transparent, accessible platform with clear impact reporting, easy donation options, educational resources, and assurance that their contributions meaningfully support reef life from afar.

How Might We?

How might we create a simple and engaging platform for individuals to learn about coral reef ecosystems in order to support and participate in conserving the oceans through donation and planting a coral?

Prioritization Matrix
MUST HAVE

Donation & Planting Feature


A streamlined donation process for users to support coral restoration projects and partner organizations.

SHOULD HAVE

User Profiles and Community Feed


Enable users to create profiles, share their conservation activities, and view updates from others.

COULD HAVE

Interactive Maps


Maps displaying coral reefs under threat, active restoration sites, and local marine conservation groups.

WONT HAVE

E-commerce Store


Selling eco-friendly products related to coral conservation.

User Task Flow

This image illustrates the user task flow, outlining the step-by-step process for completing key actions within the Reef Rescue app.

Sketches

These are early-stage sketches showcasing the design of different screens for the Reef Rescue app, outlining key user interactions and layout concepts.

Low-Fidelity Wireframes

These are low-fidelity mockups where I explored the layout and key design elements, which could eventually evolve into the final version.

Wireflow Wireframes

This wireframe illustrates a streamlined task flow for coral planting.

Usabilty Testing
Find the app’s mission and goal.
Ellipse 5.png
Select location and browse coral selection.
Add a coral to the cart and checkout.

Mid-Fidelity User Testing

 

“The checkout was smooth, just like an online purchase. At the end, I got a message saying I’d receive confirmation once my coral is planted.”

Ellipse 2.png
Ellipse 4.png

Mid-Fidelity User Testing

 

“The confirmation message is helpful, but I wasn’t sure when or how I’d receive updates. Will I get an email, or do I need to check the app?”

High-Fidelity User Testing

​

“I tapped 'Adopt' and expected it to go straight to checkout, but instead, I could browse more corals, which is nice.”

Guerilla Testing
Positive Feedback

  • Visually appealing design, especially the home page animation.

  • Welcoming, playful UI elements like the “Get Started” button.

  • Smooth and easy coral adoption process.

Area to Improve

  • Layout and Consistency

  • Navigation

  • Offer filtering or sorting options for coral selection

Suggestions

  • Add a tracking feature to follow adopted corals plus consider separate dashboard fo rmy corals

  • Offer filtering or sorting options for coral selection.

After conducting guerrilla testing with few participants, our team gathered valuable feedback on both visual design and usability. Within the limited timeframe, we were able to implement key improvements to enhance the user experience.

Style Guide

Inspired by the ocean's depths, Reef Rescue features:

  • Vibrant blues: Reflecting the ocean’s freshness.

  • Bold typography: Ensuring readability.

  • Contrasting UI elements: Enhancing clarity and accessibility.

  • Minimalist icons: Keeping the design clean and simple.

Reef Rescue Prototype
Explore our interactive prototype and experience how easy it is to plant and track your own coral. Your feedback helps us improve—dive in now!
Final Thoughts
Challenges

  • Figma Learning: Navigating advanced tools

  • Journey Mapping: Creating flow from scratch

  • Accessibility: Designing for all users

  • Consistency: Keeping a unified look

  • UX vs UI: Balancing function and style

  • Testing Limits: Few diverse testers available

Key Learnings

  • Prototyping: Better testing and user flows

  • User Needs: Focused on real pain points

  • Iterative Design: Improved through feedback

  • Accessibility: Inclusive design focus

  • Time Management: Balanced scope and deadlines

  • UI/UX Skills: Applied best practices throughout

Next Steps

  • Explore Tracking Features – Investigate ways to let users track their adopted corals over time and test engagement.​

  • Refine Usability – Gather more user feedback to improve navigation and accessibility.

  • Enhance Educational Content – Expand resources on marine conservation to encourage learning.

  • Optimize UI & Visuals – Improve branding, typography, and consistency for a polished look.

  • Test with More Users – Conduct broader usability testing to ensure inclusivity and ease of use.

THANK YOU FOR YOUR TIME
bottom of page