The Product
This case study will be about a way to help conserve the endangered
animals. There are many organizations working for the rights of animals bringing awareness towards endangered species. Most of the organizations are related to one particular species. My idea is to give a common platform to help conserve all the endangered animals. The design helps the people to get the information related to endangered species and get support.
animals. There are many organizations working for the rights of animals bringing awareness towards endangered species. Most of the organizations are related to one particular species. My idea is to give a common platform to help conserve all the endangered animals. The design helps the people to get the information related to endangered species and get support.
The Problem
Many people doesn’t know how many species are in a risk of extinction. Even though there are many news circulating time to time in television or social media but the real data about these information is not available.
The Goal
By creating a common platform related to the information regarding all types of endangered animals and raise awareness as well as funds to reduce the extinction a mobile app and a responsive website is designed.
The Role
My role in this project is a 'Generalist' work. Starting with conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
The Process
Understanding the User
User Research
I conducted interviews and created empathy maps to understand the users and their needs. A primary user group identified through research was between the age 20-50. This user group confirmed initial assumptions about the workflow, but research also revealed that the availability of information related to different endangered species and their habitats and also different ways of helping these animals to be provided.
Competitor Analysis
I conduct a competitor analysis considering various organizations related to the problem I am working with, who are direct competitors to bridge the gap according to user needs while designing. A competitors matrix is created to make the design decisions more user friendly and effective.
Empathy Map
I created an empathy map considering the user personas to articulate the behaviour of the user for visualization of the design process. It is created to characterize target users in order to make effective design.
Pain Points
Personas
Based on the interviews we set up three personas. We referred to them throughout the entire product development process.
User Journey
I mapped out the users’ steps to see how I could simplify their journey to help them reach their most important goals with the product and organize them using affinity diagram.
Starting the Design
Wireframes
Taking the time to draft iterations of each screen of the app on paper ensured that the elements that made it to digital wireframes would be well-suited to address user pain points. For the home screen, I prioritized about info related to various species.
Low-fidelity Prototype
Using the digital wireframes, a low-fidelity prototype is created. The primary user flow is to go and find various info related to different species and news related to endangered species.
Refining the Design
Usability Study
I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.
UI Design
Once I tested out all usability mistakes, I started designing the final screens in Adobe XD. I revised the design so users can have clean interface of easy navigation through different flows.
Mockups
Early designs allowed for some customization, but after the usability studies, I revised the design so users can have the clear visualization of different pages and its content.
High-fidelity Prototype
The final high-fidelity prototype presented cleaner user flows for getting information related to endangered species and also gives info related to support which can help the animals avoid extinction.
Usability Study
for Responsive Website
I conducted one round of usability studies with respect to the responsive website design considering the app contents and previous usability study as the base point. Findings from the study helped to refine the designs from the mobile app.
UI Design
Once I tested out all usability mistakes for the responsive website, I started designing the final screens in Adobe XD. I revised the design so users can have clean interface of easy navigation through different flows.
Mockups
The app designs are customized according to the usability study findings. The designs are revised to give a fresh and clean look in bigger screens.
High-fidelity Prototype
The final high-fidelity prototype of the responsive website shows cleaner look to be viewed in larger screens and gives detailed info.
Accessibility
Takeaways
Next Steps
