Whale Conservation
Mobile and Desktop site focusing on donation & education of the aquatic ecosystem
.png)
The Business
The Whale Conservatory is a global community that not only focuses on conservation of the aquatic ecosystem, but additionally aims to educate on the whales role in climate change.
Project Goal
To educate users of the role whales play in the ecosystem and the part they play in combatting CO2 emissions in the atmosphere
My Role
UX Researcher, Low-Fidelity, High-Fidelity Prototyping.
Usability Testing
Target Audience
We focused on two different audiences for our two platforms: on mobile we know that users are most likely to be younger while we designed our desktop platform to be geared more towards education and older users.
Anton S. | Fashion Designer
Needs an app that informs her on the impact of pollution to whales as inspiration for her next event.
Mobile Persona
Giovanni | Retiree
Wants to learn more about the affects of commercial fishing to have conversations with his family
Desktop Persona
Pain Points
1
Too much text puts users off of learning
2
Users assume that just donating means that they've done their part
3
Users don't know where funding goes
Key Challenges and Constraints
Some key challenges that we wanted to tackle were to educate users about the effect an aquatic ecosystem has on the environment. We know that when users talk about global warming and CO2 emissions in the air, often times people will think of trees planting, but gloss over how the ocean can take in more CO2 emissions than rainforests
Research Study
Through our research we found that most users were put off by the massive wall of text on sites. Users would like to see where their donations go and the activities the organizations are funding through their donations.
8 out of 10 users stated that having images or diagrams helps users understand whale's contribution to countering climate change.
Initial Design Concepts
We noticed that the most competitor sites were very text heavy, so we chose to incorporate more images, and less text in our designs. We also chose to keep the most important element, the "donate" button, above the fold in the designs
Wireframing
After sketching several designs on paper, we settled on clear titles marking the differing types of food offered at the restaurant. We focused on making the user clear of each step of the user journey by having the user confirm each step.
Usability Study Insights
We conducted an unmoderated usability study to monitor how users proceed through the user journey of the app without prompts.
Through our research we found that most users were put off by the massive wall of text on sites. Users would like to see where their donations go and the activities the organizations are funding through their donations.
8 out of 10 users stated that having images or diagrams helps users understand whale's contribution to countering climate change
Generally, we found that most users do not spend a lot of time reading long blocks of text.
More users wanted to see where funding is used such as giving examples and data .
Users want to see the impact of their donation
More relevant data on whales role in climate change
Navigation is difficult to manage
Prototype
For our main user journey, our goal is to lead the user to donating some funds to the organizations, so we prioritized placing a donation button as the focal point on the front page of the site. We also included a donation link in the menu on top of every page of our site. Additionally we chose to place a donation link on all other links on our site, but not push donating as our main objective.
Mobile Prototype
Desktop Prototype
Responsive Websites
For our final designs for The Whale Conservatory site we stuck with a limited color palate and used containers to highlight important information for users.
Desktop Design
With larger space we chose to design the navigation into the top of the site for ease of access
See my High Fidelity Prototype here!
Mobile Design
We incorporated a hamburger menu to organize the site on mobile
Experience the High Fidelity Prototype here.
.png)
Takeaways
The main takeaways for the project was finding a way to immediately capture the attention of the users, since we know that users will easily be distracted or turned off by long text.
Next Steps
After tackling the most important aspect of the organization, donations, for our main user journey. Next steps include adding more educational elements to the site, such as shopping from local businesses instead of large box offices that utilize cargo ships.
We would also work with engineers to add a competitive element, such as cleaning up the beaches of debris for points as a reward system.
Other Projects
If you are interested in seeing more of my work, feel free to peruse the rest of my portfolio!