SPECEASE
An educational app that identifies and tracks endangered animals in users' areas and connects them with resources to contribute to conservation efforts.
Dan Hubsher
Lead UX Designer
Sep. 2024-Jan. 2025
User Research
Concept Ideation
Wireframes & Mockups
Prototyping
Usability Testing
People care about endangered species but it feels like such a big, far away problem.
The goal; make conservation a local issue by allowing users to learn about endangered species in their area and connecting them with others interested in wildlife preservation.
RESEARCH
User Interviews
One-on-one interviews were conducted focusing on how people engage with the idea of conservation and what effect technology could have on the issue. These sessions revealed two major pain points:
Wildlife extinction is such a vast problem that the average person feels helpless to do anything.
1.
2.
The term "endangered species" is often associated with "exotic" animals like tigers and pandas that most people don't have any interactions with.
CONCEPTS
Wireframe Sketches
A series of rough sketches were drawn up for the various page layouts. Eventually the best features were consolidated into a single design.
Digital Wireframes
Using Figma the layout was then further refined and developed. Placeholders were used for images and text as the focus was on preparing the design for prototyping.
Usability Test 1
The digital wireframes were linked together to create a low-fidelity prototype for the first round of usability testing.
Insights
1.
After
News Page Layout
Before
Some users confused the News Page with the Community Page, before quickly realizing their mistake. The two layouts looked very similar.
This problem was solved by redesigning the News Page with a "card" layout similar to Apple's News app.
Alternate Path to Species Profile
2.
Some participants took an alternate user path to get to the Species Profile, either using the Sightings Map or skipping the Full List and immediately clicking on Birds.
This wasn't necessarily a problem as long as all the elements were properly linked up. Multiple user paths to complete a single task can help increase overall usability. The Full List and Sightings Map options could be used for casual browsing.
Trouble Finding the Sightings Map
3.
Some participants had trouble finding the Sightings Map, either struggling a little before completing the task or skipping it entirely.
This was determined to be a "lo-fi problem." The wireframes had no images or symbols to assist navigation. On top of that the instructions specifically used the word "map" while the layout didn't. This was a mistake on my end that was remedied moving forward.
DESIGN SYSTEM
With the layout solidified it was now time to fully flesh out the app with color, text, images and icons. This mean building a design system to provide easy access to all the used elements and ensure consistency and continuity throughout the app.
Color Scheme
Note: The initial color scheme had to be changed to the final one presented here to better meet WCAG standards. Some early mockups will reflect this.
Icons
In order to make navigation as easy as possible icons were chosen for their simplicity and clarity.
Most navigation icons were from Apple's SF Symbols 6, a feature of Apple Design Resources.
Icons for the Species List were from Iconshock's Free Animal Material Icons set and adapted to fit the color scheme of the app.
The threat icons and status designation icons were custom designed by yours truly.
Images
Of course no app is complete without images. One of the main draws of a wildlife app is high quality photographs of the animals users are trying to protect.
Fonts
Fonts and typefaces were chosen to ensure legibility and reinforce information hierarchy.
Afacad was chosen for larger text such as section headers and buttons.
For body text and captions Barlow was used. And SF Pro was used for standard iPhone text information.
MOCKUPS
Initial Mockups
Utilizing the elements created for the design system, mockups were built on the foundation provided by the wireframes.
Usability Test 2
For the second round of usability testing the mockups were linked together to create a high-fidelity prototype.
Insights
1.
After
Intro Page Options
Before
Some users expressed that they would prefer a GPS-linked Use My Location function in the Intro Page instead of the Choose Your State drop-down menu.
This issue was resolved by adding the Use My Location function while also keeping the drop-down menu.
Use of Sightings Map
2.
On a related matter, some users suggested the Sightings Map should have a broader use. Instead of only using it to find one species, allow the user to view all reported sightings around them incorporating the GPS.
Automatically showing every sighting all at once might be a bit too much for every user, so a See All toggle was added to give them the option. Additionally, a GPS beacon was added to the map to represent the user's location relative to reported sightings.
C2A
3.
It became apparent that a more definitive Call-to-Action was needed in order to give the user flow more drive and purpose.
So an Adoption Feature was added, marked by an attention-grabbing button in the Species Profile.
FINAL PROTOTYPE
High Fidelity Prototype
The changes from the insights were implemented. Screen designs and user flows were modified accordingly. As mentioned earlier, the color scheme was changed to better comply with WCAG Standards for readability. Finally, some basic animations were added to give the user a more dynamic experience.
Note: The only state available is Oregon and the only species available is the Northern Spotted Owl.
Next Steps
Growing Database
SpecEase collects media and data uploaded by its users. So as time passes the app will naturally have more information to offer. This will allow users to narrow their search down to find animals not just in their state but their zip code as well.
Direct Messaging
While the Community page offers users the chance to connect in the form of message boards, this interactivity could be enhanced with a direct message system for one-on-one chats.
Plants!
There are even more endangered species of plant than animal and plenty of avid green-thumbs out there. Adding plants and fungi to SpecEase could give users even more opportunities to learn about conservation.
