Traduce este sitio con el traductor de google
The product:
Curiocean is an Ireland based organization focused on ocean and marine life conservation efforts. Curiocean needed a tool to help people donate to support their organization, manage and subscribe to workshops and events. The primary users include students, schools and adults who are looking to contribute to ocean conservation and educate about this matter to help future generations.
Project duration:
May 2023 to June 2023
Project overview
The problem:
Every year, the oceans increase their contamination which threatens marine life. Curiocean noticed a lack of education on marine life and limited knowledge on ocean conservation besides seeing a lot of garbage on beaches, which is crucial for ocean contamination.
The goal:
Design an app that will improve education on the topic of ocean conservation and help people contribute with this movement by supporting with a donation or assisting to events or workshops.
My role:
UX designer leading the app and responsive website design from conception to delivery.
Responsibilities:
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs, determining information architecture and responsive design.
Understanding
the user
●User research
●Personas
●Problem statements
●Competitive audit
●Ideation
User research summary:
The current problem with ocean conservation and marine life it’s the lack of education about conserving the oceans and such limited reach to the resources to support these efforts, such as workshops and events about the topic.
With this information on hand, I conducted interviews and found out that most users feel bad about ocean pollution. The feedback received through research showed that users are willing to contribute with these efforts if they have an easy way to do it and find relevant information about it online, on events or workshops and they can be up to date.
Persona 1: Emily
Problem statement:
Emily is a marketing manager who need to join an organization that conserves the ocean and marine life because she wants to collaborate on conserve the ocean but doesn’t know how
Persona 2: Michelle Mcbee
Problem statement:
David is a real estate developer who needs a way to conserve the ocean and marine life. The pollution in the ocean is increasing and endangered marine life.
User Journey
Pain points:
I notice one of the pain points of this user is finding organizations near them or online launching events, workshops and research with the donation they get and how they do it.
Competitive audit
An audit of a few competitor’s products provided direction on gaps and opportunities, such as focusing on manage, assist and request workshops and events besides donations for support
Ideation
I did an ideation exercise with crazy eights to come up with ideas on how to address gasps I identified on the competitive audit and I focused on offering an easy way to subscribe and schedule workshops and events, get updates on research and support the movement. All with a very clear and user friendly approach
Ideation
These crazy eights produced a clear visualization of what the homescreen could be and other main screens needed.
Starting
the design
●Digital wireframes
●Low-fidelity prototype
●Usability studies
Digital wireframes
After ideating and drafting some paper wireframes, I created initial designs for the app. This focuses on creating an easy and fast way to donate through a donation bar on the homescreen by selecting your desired amount to donate. Quick access to the latest workshop and the latest events and research, including the merch store.
Low-fidelity prototype
To prepare for usability testing, I created a low-fidelity prototype that connected the user flow of making a donation from the homescreen, creating an account and subscribing to a workshop
View Prototype here: https://xd.adobe.com/view/2c0f0768-bbeb-4186-a500-44ea50e47a16-795c/?fullscreen
Usability study: parameters
1
Users had trouble finding the card where the donation amount was displayed.
2
Users didn’t use or understand the donation bar on the homescreen.
3
Users wanted who see and manage the workshops they subscribed to.
Refining
the design
●Mockups
●High-fidelity prototype
●Accessibility
Muck ups
Based on the insights from the usability studies, I applied design changes such as changing the bar for a pill with an ”+” and “-” to introduce a desired amount.
Muck ups
The 3rd change was to add the feature to manage their workshops on the workshops page.
Muck ups
After the second study: It shows that the user had to go to the profile screen to see how many reward points were available. I added the reward points to the home screen, next to the address.
Homescreen
Starting donation
Accessibility screen
Manage workshops screen
High fidelity prototype
The high fidelity prototypes follow the same user Flow as the low-Fidelity prototype, including design changes made after the usability study.
Accessibility considerations
1
I added an icon next to the search bar that launches options for accessibility features such as switch language, text size, volume and more.
2
Initial focus on the donation card, just below the workshop section which is the biggest image shown on the homescreen. Give a proper spacing to the events and research buttons.
3
Clear labels for interactive elements that can read by screen readers.
Responsive Design
●Information architecture
●Responsive design
Sitemap
The app designs completed and I started work on designing the responsive website. I used the sitemap to guide the organizational structure of each screen’s design to ensure a cohesive and consistent experience. Pointing out the top needed information based on use case. Donations, ocean conservation, events, research, about the organization and shop.
Responsive designs
The designs for screen size variation included mobile, tablet, and desktop. I optimized for a quick call to action to make a donation, quick access to the workshops and events.
Mockups & prototypes
Mobile prototype
Tabled prototype
Desktop prototype
Going forward
●Takeaways
●Next steps
Takeaways
Impact:
Users are now on an easier path to contribute to conserving the oceans and marine life. Now, make a donation, schedule a workshop, or collaborate to this effort and education can be easily accessed and easily used.
What I learned:
Even a big problem like this one, by following the design process and being aligned with the users gives me a clearer path to follow on the necessities of the user in order to provide a solution that is both usable and useful toward the goal we try to achieve.
Next steps
1
Add a subscription feature to make donations easier.
2
Add more workshops and events online that are for a world wide reach by country.
3
Conduct a research on how successful the app is with the users.