Wildlife Wonder

Gamification / Awareness App

Project

Overview

My Role

Research

User Persona

User Flow

UI/UX Design

Wireframe

Test Facilitator

Project

Group Effort

Thomas Olsen

Martine Rydland

Mahshid Mohammadi

Project

Duration

4

Weeks

30+

Screens

Project

Tools Used

Figma

Google Forms

Miro

Google Slide

Zoom

Project

Timeline

Project

Problem Statement

Individuals living in Norway aged 24 to 39 feel uninformed and powerless when it comes to wildlife conservation, lacking the necessary knowledge, awareness, and accessible tools to contribute effectively. Addressing and solving this issue would result in positive impacts, including fostering eco-friendly habits through education and raising awareness, as well as instilling a sense of pride and good consciousness.

User Perspective

As a young man with a long-standing passion for wildlife and their preservation, I often face difficulties in this pursuit due to the limited availability of information on the subject and the lack of general interest. This can leave me feeling isolated and frustrated.

User Research Perspective

Norwegian residents often know about the  challenges wildlife encounter, but they are limited in their ability to personally contribute due to a lack of knowledge on the subject, resulting in feelings of frustration.

POV:

  • People in Norway needs information and clear guidelines because they want to be a part of taking care of wildlife, but don’t know how.
  • People in Norway needs the contents to be fun because they find lectures boring and ineffective.

Project

Solution

Goal

To make a user-friendly app that makes environmental information accessible to everyday users, encouraging positive change through interactive engagement and personal reflection rather than focusing solely on scarcity.

Empathise

Research Goals

The objective of the research was to discover ways to encourage and empower ordinary individuals to educate themselves about wildlife and take actionable measures to support their well-being.

We conducted a session with 5W&H questions to get us started and try to narrow down research goals. 

Who

Who will use the guidelines and what are they like?

When

When will the guidelines be used?

Why

Why is this product important?

What

What motivates people to take care of wildlife?

Where

Where will the guidelines be used?

How

How will it help users?

Empathise

Key Insights

Empathise

Interviews

Interviews

Participants and key insights

At the end of the day, that’s definitely the people’s responsibility, the government cannot put a gun to people’s heads to reduce their waste, right?

Define

Target Group

Broad Target Group

User research recommended catering to a diverse Norwegian audience for a significant impact. We recognized the challenge of serving varied interests. The primary persona values gaming, winning, and discounts, while the secondary persona prioritizes concrete actions like wildlife conservation through at-home activities or donations. To tackle this, we created distinct primary and secondary personas, and we designed the app with their needs in mind.

Primary Target Group

Our main focus group is individuals aged between 24 and 39. Matias, our primary persona, is driven by the desire to learn in a fun and engaging way, and has a strong interest in contributing to wildlife conservation efforts. However, he lacks the necessary knowledge to take action on his own. By understanding the needs and motivations of our primary persona, we can tailor our app to provide the necessary tools and information to empower users like Matias to make a positive impact on the environment.

Secondary

We aimed to create a solution for a broad audience, so we introduced a secondary persona, Kari, who is passionate about wildlife conservation. By considering the needs and motivations of both primary and secondary personas, we strive to develop an app with wide-reaching appeal for maximum impact in wildlife conservation.

Define

Primary Persona

Define

Secondary Persona

Define

User Scenario Contextual

Matias is on his way to work when he comes across a newspaper article discussing the latest numbers of an endangered animal in Norway. The news makes him a bit concerned, and he wonders what this means.

As he is walking to work, his thought process is interrupted when he reads the news, but shortly after, he becomes distracted and forgets what he had just read. Instead, he starts thinking about something else and continues on his way to work.

During his lunch break, some of his colleagues bring up the same article that he had read earlier in the day. They discuss the animal in question, but soon the conversation shifts to another colleague, who recommends an app that helps identify flowers suitable for bee and insect pollination in gardens.

After trying the app out, he discovers several mini-games and ends up playing them on his way home. Through these games, he learns a lot about how to support bee and insect populations. Later that evening, he reads more about what he can do to help and tries to implement some of the suggestions in his own home. He feels a sense of satisfaction that his small actions could potentially bring about a significant impact on the bigger picture of wildlife conservation.

Define

4 W's

Define

How Might We

Ideate

Ideation Workshop

Prior to the workshop, we planned to conduct at least 3 different ideation techniques, in which each of us would alternate between serving as a facilitator and participant. The workshop was designed in two parts:

Ideation methods we used:

  1. Problem Statement
    (including HMW questions to initiate the next step)
  2. Ideation Techniques

  • Mood Boards
  • Brainstorming
  • 100$ Workshop

In addition, we prepared other techniques such as Mind Mapping and Storyboard in case the need arose to switch to other methods for inspiration. In the end, we utilized four techniques.

Screenshot from Ideation workshop. 
From top left: Mahshid, Martine & Thomas

Ideate

Mood Boards

Ideate

Our Top Solutions

We moved on to the last part of the workshop, we refined our top solutions where we got to play the $100. These were the ideas included for the last session of the workshop: 

Awareness app with mini-games

The app feature mini-games tailored to awareness of different animals and what you can do to help them.

QR Codes in Nature -> Website

QR codes will be placed on plaques in nature/other places to be scanned and opens a website for more information.

App with Map, Tracking and Image Recognition

The app would be used out in the nature

Animation Series

Animation series based on an animal hotel/bug hotel.

Nature GO

A type of “Pokemon Go” app where you can catch wild animals and learn about them.

Virtual Wildlife Tour

Where you can virtually visit the different animals and experience them.

Ideate

MoSCoW Technique

Ideate

Our Top Solution

Our concept is to create an awareness app with mini-games enabling learning through gamification. The goal is to raise awareness and educate people about the importance of taking care of wildlife, as well as give them tools and guidelines for personal engagement.

“Our concept is to create an awareness app with mini-games enabling learning through gamification. The goal is to raise awareness and educate people about the importance of taking care of wildlife, as well as give them tools and guidelines for personal engagement.”

Name - Wildlife Wonders

Animals featured in the app:

  • Bees
  • Hedgehog
  • Butterfly
  • Arctic Fox
  • Bat
  • Lynx
  • Beetle
  • Pygmy Goose
  • Musk Ox
  • Wild Reindeer

+ many more

Ideate

SWOT Analysis

Ideate

Games in the App

A brief overview of some of the games that can be included in the apps for the different animals

Flight of the bumblebee

Animal: Bees
Game type: Flyer
Description: The user is the bee on a mission to pollinate flower and can only pollinate specific flowers that you can plant in your own garden. Awareness: Need more plants for pollination for bees.

Butterfly Bubbles

Animal: Butterfly
Game type: Bubble Shooter
Description: Classic bubble shooter which increases in difficulty as the bubbles disappear and are replaced with houses.
Awareness: Butterflies are losing their habitats.

Musk Surfer

Animal: Musk Ox
Game type: Endless Runner
Description: Similar to subway surfers, where you control the Musk as he is collecting food while navigating between trains and tries to not get run over by one
Awareness: Musk Ox habitats and their history in Norway.

Hedgehog Highway

Animal: Hedgehog
Game type: Driver
Description: The user competes with different hedgehogs in a map through different gardens. Some parts are off rail as some gardens are closed off with fences.
Awareness: Create Hedgehog highways in your garden.

Beetle Hotel

Animal: Beetle
Game type: Puzzle
Description: Classic puzzle/maze game where you have to solve puzzles and navigate through a maze in a bug hotel to find you beetle friends.
Awareness: Butterflies are losing their habitats.

Ideate

Technical Requirement

Ideate

Our Top Solution

Ideate

IA Diagram

Ideate

Task Flows

Ideate

User Flow

Prototype

Sketches

We all separately created sketches on how we saw the different features in the app and the layout. We presented them to each other and picked up the best designs.

"Design is not a single object or dimension. Design is messy and complex."

Prototype

Wireframes

Prototype

Wireflows

Sign up as a first time user

Scan an animal and view results

Find coupon and purchase product

Play a game

Usability Test

Scope

Goal

The goal was to test if the concept and design is matching the user’s expectations and mental model, as well as uncovering any usability issues. We also hoped to expose any frustration or pain points in the user flow. 

Hypothesis

Is the user able to onboard easily to the app?

Is the user able to play a game and is it an enjoyable part of the app?

Is the user able to upload a photo and scan and finds it useful?

Is the user able to find and utilise guidelines?

Is the user able to find their rewards, purchase an order and feels that this contributes to them helping wildlife?

Tasks

Signing up as a new user to the app

Play a game and check the leaderboard

Scan and view results

Find guidelines

Find coupon and purchase product

Usability Test

Features We Tested

Usability Test

Prototype

We prepared our prototyping using Figma and connected all relevant frames together. 



We wanted to focus on specific areas such as game, guidelines and scan, while at the same time see how everything was connecting giving the user a full experience on navigating around the app. We created an illusion of playing a game using auto smart animation. 




Usability Test

Participants

Usability Test

Results

Usability Test

Task Completion Rates

Usability Test

Proposed Changes

  • Restructure Welcome page with highlighting Login and Sign Up buttons
  • Add proper back navigation UI elements on all pages
  • Highlight possibility for skipping onboarding
  • Add a share button on sharing results
  • Adding a search bar for the language options as there are many languages to choose from
  • On Sign Up/Log In, make underlines on links
  • Restructure the elements on the Hamburger Menu
  • Make pictures selected for uploading in scan highlighted
  • Connect rewards/redeem coupons with a pop-up in the game
  • On Sign Up/Log In, make underlines on links
  • Add drop down for choosing coupons during checkout
  • Add “My Rewards” to Hamburger Menu
  • Add Redeem reward button on the option after clicking animal on the game map
  • Links needs to be extended from just the arrow to the whole box

Usability Test

Design Iterations

Changes and additional frames 

We set out to refine and improve our product through multiple rounds of feedback, evaluation, and modification so that it meets the desired goals and objectives of our users. We also implemented the adjustments to our prototype.

 

Usability Test

Key Findings

Concept

The participants enjoyed the concept and believed this would be beneficial for them.

Reward System

The reward system was well received, but may not be highlighted enough. This needs to be further connected with the gaming part. ​

Consistency

Our prototype had some inconsistency when it came to navigational UI elements such as back buttons. We need to improve the navigational experience and ensure consistency.

Shopping Experience

3 out of 5 participants were not able to complete the coupon purchase task without any help. We need to improve the overall shopping experience.

Additional Features

Participants suggested additional features, such as exploring the idea of users being able to share tips and suggestions for each other to keep up the motivation.

Highlight Scan Feature

The participants loved the scan feature, but only scored 88% on satisfaction on the task. We need to improve the scan experience and consider highlighting it as one of the main features.​

Usability Test

Summary & Conclusion

We need review the shopping experience within the app

This may include creating new sketched and usability test them.

We need to rethink the navigational structure

This may include new sketches and usability testing specifically on navigation items.

We need to create a new main page

This will include new sketches and may be impacted on the testing for navigational structure. E.g if we take away the lower navigation bar, would the main page together with the hamburger menu work as the sole navigation?

We need to further develop the reward system

This may include new sketches for connection to the game and shop, as well as develop the concept together with businesses to explore possibilities.

Usability Test

Constraints

Technical

Zoom only gives 45 minutes of meeting time. This may have shortened some of the usability testings and recommended to upgrade or find another solution for next round of testing.

Remote

As a remote team, we had limited choices of usability method we were able to conduct.

Recruitment

The project had a broad target group, but due to time constraints and lack of incentives, we were not able to recruit outside our own social network.

Testing outside target group

We conducted usability testing with one participant outside our target group. We used this to our advantage as they would still be looked as a secondary audience, giving us insights to cater for a broader audience.

Highlighted

Group Effort

Mahshid Mohammadi

Thomas Olsen

Martine Rydland

View Other Case Studies

Oslo Events

Ultimate hub for Events

SEEK

A career platform for job seekers

Conservation International

Design System