UI/UX, Prototyping, Passion project

Harnessing the power of citizen science

Manu is a mobile app that identifies bird songs in the field. Users can upload, tag and share bird sightings, the data collected is used to help aid bird conservation in New Zealand.

Overview

New Zealand's avian inhabitants are truly unique, serving as emblematic figures of our national identity. With approximately 68 species of endemic birds, each boasting distinct songs and calls, recognizing these feathered residents solely by their vocalizations proves challenging for most.

Manu seeks to solve this by bringing people closer to the natural environment through technology and raise awareness of the importance of conservation by providing a fun and dynamic learning experience for all ages.

Manu also enables the crowd-sourcing of data which will aid the bird conservation effort in New Zealand. Each time the app is used to identify a bird, a geotag function will log where each species are located. This data will be publicly available through a website enabling individuals, communities, school groups, conservation groups, scientists and government agencies to monitor individual bird species.

Project objectives
  • Enable New Zealanders to easily identify NZ bird song/calls.
  • Foster greater connection with the natural environment through education and engagement.
  • Provide a useful learning tool in both English and Te Reo (kura kaupapa Māori based schools.)
  • Allow citizens to collect meaningful data to help understand more about our native bird species. This may help inform decisions about the management of indigenous fauna.

User stories

To establish a clear understanding of the app's objectives, I developed a series of user stories tailored to the target audience. Subsequently, I compiled a feature list that would serve as the foundational framework for wireframes and user flows in later stages of development. Given Manu's broad scope in addressing diverse challenges, it demanded numerous features; however, at this stage, I prioritized incorporating only those essential for the creation of a Minimum Viable Product (MVP).

Feature list for MVP

Mapping out a user flow

Using the user stories and feature list, I created a flow that mapped out the MVP; this allowed me to quickly visualise and evaluate how the overall application would function.

User flow for MVP

Wireframing

Using the user flows and the MVP feature list as a foundation, I began by sketching wireframes with pen and paper, as it proved the fastest method to translate initial concepts from my mind. Once I was happy that I was heading in the right direction, I proceeded to enhance and develop more detailed, higher-fidelity wireframes using Figma.

(Start listening to bird calls)

Bird call Identification

Bird not found, try again

View birds on map

Bird profile

Bird profile information

My Bird Collection

settings

Testing wireframes

Wireframe testing represented a pivotal phase as I aimed to ensure the functionality and coherence of all elements before transitioning to UI development. Employing Figma's prototyping capabilities, I fashioned a low-fidelity prototype that underwent testing and informed refinements to the wireframes. With these enhancements in place, I proceeded to the interface design stage.

Wifeframe Flow

Testing wireframes using Figma

Visual design exploration

Utilising Figma's artboard feature, I rapidly iterated and experimented with different design solutions and produced hi-fidelity mockups based on the wireframes.

Wifeframe Flow

Exploring visual design solutions using Figma

High-fidelity prototype

With Manu's diverse user base in mind, I aimed for a minimalistic app design that could cater to a wide range of demographics. The interface design prioritizes simplicity, ensuring an uncluttered appearance.

Given the app's emphasis on photography, I was keen on avoiding distractions from the vibrant imagery. Consequently, I opted for a neutral color scheme, with sapphire blue as the primary color. This choice harmonized with the vivid photography, allowing it to shine without overwhelming users with excessive brightness or vibrancy.

Wifeframe Flow

This project is still ongoing. My next step is to create an interactive prototype and test it with real users.