Monterey Bay Aquarium

App Design, UX Research
View Prototype
Project Overview
Background
Monterey Bay Aquarium located in Monterey, CA, sees education and conservancy as priorities, from providing educational resources to promoting conservancy. The Aquarium is currently closed due to COVID.
Challenge
Monterey Bay Aquarium doesn’t have a mobile app to provide the public remote experience and education on marine life. We wanted to create moments of delight and inspired involvement with animal conservancy, not just for remote settings, but also in-person experience once the aquarium re-open.

We wanted to target youths, educators and animal lovers.
Project Plan
My Role
• User Research: Conducted interviews, analyzed findings, persona & journey map
• Sketches: brainstormed solutions & ideated lo-fi wire frame
• 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  
• Tools: Sketch, Figma, Miro, Zoom
• 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
My Role
User Research: Conducted interviews, analyzed findings, persona & journey map

Sketches: brainstormed solutions & ideated lo-fi wire frame

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  

Tools: Sketch, Figma, Miro, Zoom
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.
Competitive &
Comparative Analysis
We checked out in-app features on other aquariums, zoo and museums.
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.

Our "student" persona, Sam, wants to check out Monterey Aquarium's website. What might she encounter?

Journey Map
User Flow
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


We discovered some problems our users have. It's time to dive into the solutions with our ideas!
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,.

- 3 main tab bars accompanied by secondary tab bar ( I got this idea from San Diego Zoo's app)
Mid- Fi 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.

Iterations are reflected in our Hi-Fi prototype.

Hi-Fi Prototype
View Prototype