#Gamification #Usability Test #Tree Testing #Engaging #Interaction

Pandemic Challenge: Engaging & Playful Virtual Exhibition

Monterey Bay Aquarium

#Gamification #Usability Test #Tree Testing #Engaging #Interactive

Pandemic Challenge: Engaging & Playful Virtual Exhibition

Monterey Bay Aquarium

Project Overview
Background
Monterey Bay Aquarium located in Monterey, CA, sees education and conservancy as priorities. We conducted a UX case study. We believed this is an opportunity to solve the negative impact of Covid. The goal was to bring the exhibition experience to the users.
Challenge
Monterey Bay Aquarium doesn’t have a mobile app to provide the public remote experience and education on marine life. Due to pandemic, the site is closed temporarily. People don't have access to connect with the marine life. The aquarium doesn't have opportunity to educate the public or keep them engaged.

We wanted to target youths, educators and animal lovers.
Solution
Our team decided to design a mobile app for Monterey Bay Aquarium. Because we wanted to create moments of delight and inspired involvement with animal conservancy, not just for remote setting, but also in-person experience once the aquarium re-open.
We discussed the essential features to implement in the app that would help with our goals.

We concluded the existing information of marine life and conservancy from the aquarium's website for educational purpose.
Since youth was one of our target audience. We introduced gaming component in the app.
To delight in-person visit once the aquarium re-open, we decided to implement an interactive map of Monterey Bay Aquarium.
Project Plan
• Research
Understand user's needs, goal, frustrations, & behaviors
Explore current and competitor's product
• Define
Identify problems and suggest opportunities
Analyze features prioritization
• Design
Ideate sketches and low-fidelity wireframes
Create mid-fidelity prototypes and test usability
• Deliver
Create high-fidelity prototype
Reflect process and discuss future steps
My Role
• User Research: Conducted interviews, analyzed findings, persona & journey map
• Sketches: brainstormed solutions & ideated lo-fi wireframe
• Prototyping: designed & created mid-fi prototype
• Usability Test: tested overall user flow, identified findings & problems for iteration
Scope
• Team: 4 UX designer across 3 time zones worked in a remote setting
• Duration: 2 weeks  
• Team: 4 UX designer across 3 time zones worked in a remote setting
• Design Practice: User Interview, C&C Analysis, Feature Analysis, Affinity Mapping, Persona Development, Problem Statement, User-Flow, Journey map, Mood-board, Sketching, Wireframes, Prototyping, Usability Testing & Iteration
Research & Synthesis
Exploration and Comparison
First, we took a look of the current website. The website is full of resources. We needed to figure out what contents to carry over and what new features to incorporate to the App. We also checked out in-app features on other aquariums, zoo and museums.
We decided that Live Video, Educational Resources, Maps, and Games are our "must have" features.
User Research
Objective
We wanted to learn what people experienced, what was learned and what they enjoyed during their visits to aquariums, in order to apply those insights to a virtual experience.
Methods
I conducted users interviews via Zoom meeting and recored and jogged down the findings.
Findings
We found out that our users like interactive experience, use educational resources Monterey Bay Aquarium provides and are aware of conservancy.
"I enjoyed cool interactive display."
"It's beneficial to see animals in person while learning about them."
"Things start going wrong in the ocean, you'll have a big problem."
" This cool interaction helps with engagement."
User quotes from the interview.
Persona
We created 3 personas based on our targeted users, student, educator and animal lovers.
But we decided to focus on the "Student" persona because her goals, needs and frustration overlapped with the other two personas.
Journey Map
User Flow
Problem Statement
Sam is a high school student who wants to engage with the aquarium. She needs an entertaining way to learn about marine life because she is easily distracted and learns best through interactive experiences.
How we might:
- Help students stay interested in learning about marine life
- Provide various ways of learning
- Make learning more interactive

Ideation & Iteration
Paper Sketches & Ideation
We walked through each sketches, and came out with the app template.
My Sketches
Team's Sketches
Our Decisions :
Navigation bar with logo
Drop Down Menu as the "junk drawer", where it contains "setting", "log-in"...etc,.
Drop Down Menu as the "junk drawer", where it contains "setting", "log-in"...etc,.
3 main tab bars accompanied by secondary tab bar ( I got this idea from San Diego Zoo's app)

Mid Fidelity Wireframes
I designed the screens for "Fun" section includes "Live Cams" and "Games".
Information Architecture
I created the charts as a reference for contents structure while building our prototype.
Tree Test
I wanted to validate that our users are able to navigate through the app.

Overall they were able to locate the content in the correct path.
However, I observed there was a common error our users encountered. In response, I iterated the design.
Some users failed to reach the "calendar" page. Green path represents the correct path.
Usability Test & Iteration
We created a mid-fi prototype through Sketch prior moving to the hi-fi stage.
I conducted the usability test, mostly in-person.
High Fidelity Prototype
Back to Top ^
Project Plan