The mission of the Monterey Bay Aquarium is to inspire the conservation of the ocean. With over 200 exhibits and 80,000 plants and animals, the Aquarium is a window to the wonders of the sea. Since 1984, more than 2.5 million students have visited the Aquarium for educational purposes.
The purpose of this project was to design a welcome back user flow that could help customers feel safe returning to the Aquarium and improve their experience of purchasing tickets. The need of the project was also to enhance the usability of the navigation on the website.
David Bradshaw,
Mie Jin,
Nora Gordon,
Yuan Ma,
Raunak Jangid
User Journey,
User Interface Design
Figma,
Proven By Users,
Trello
January, 2021 to May, 2021
As the first step, we met with the clients to discuss the project. It was a virtual meeting, where we had ice breakers, discussions, and activities to know more about the client and understand their needs.
The project's need was to improve any potential issues of the UX or content of the mega navigation. Also, suggest recommendations on how to improve the UX and content in the global navigation.
We also learned that three days after Monterey Bay Aquarium launched its new website, they closed because of COVID-19. This insight gave us an excellent opportunity to work on the website that best suited the post-pandemic situation.
We used multiple research methods for this project and mainly aligned these research methods with the project's needs. Firstly we started with Competitive Analysis to check on how other websites are doing during the pandemic.
Later we moved to in-depth research that included first-click test, card sorting, and Usability testing. These tests were more task-focused, and the findings from these helped us shape the user flow and information architecture.
Jacob is a consultant residing in Salinas, CA. He makes $80K per year through his work. Jacob is married to his partner and has two children. He is a family man and loves to go on a long drive with his family.
First-click user testing was about understanding the participant's thinking and how they see information on the website. Heat maps supported this test to learn about where the user clicks first and which section of the website gets the most clicks.
Findings -
We did card sorting with our participants to understand the information architecture of the current website. Card Sorting was exclusively for the mega navigation as there were many opportunities to improve the structure. This card sorting exercise also guided us in grouping content for the mega navigation during the redesign.
Findings -
For the usability testing, we gave specific tasks to each participant to understand their thinking of the website. We also did usability testing with the redesigned website for validating the design and assuring the user flow.
Findings -
After finishing the research phase, the design phase started by creating a user journey. This user journey was base on the user persona for the Monterey Bay Aquarium. The user journey is about how a user would come to know about the aquarium, purchase the tickets, visit the aquarium and later return home. We divided the user journey into different phases, which helped us to build a story around each section for the design.
Now that we had all the necessary data and insights, it was essential to make the website as per the client's needs and follow ADA laws. It was also crucial to reflect all our findings, design goals, and design principles.
There has been some significant redesign on to the mega navigation. We have adjusted the mega navigation to take 50% less space than the initial design. The redesign of the mega navigation also keeps up with all the ADA laws and makes sure that it is accessible. There have been changes to the content grouping as well. With the redesign, the content makes more sense now and follows up with the user journey.
Click here to view the prototype of the mega navigation.
The newly designed exhibit section allows users to view the open exhibitions. We implemented this functionality in consideration of the pandemic. This way, users are aware of all the open exhibits, and they can also view any seasonal/special exhibits.
During the pandemic, there were a lot of new rules and changes applied to public places. Monterey Bay Aquarium had also implemented some new rules for visitors to have a safe visit. This feature will remind the users of all the safety precautions taken at the aquarium. This way, there is a strong trust built between the aquarium and its visitor.
We didn't want to end the user journey right after the completion of the ticket purchase. As users complete their purchase, they move to the next section 'Before you visit'. This section will provide all the necessary and needful information to the users before they visit the aquarium. It will also ensure that users are well prepared and are not taking up a lot of time at the aquarium.
For the welcome back screen, there have been a lot of improvements and changes in structure. We have designed a whole new user flow that would encourage and motivate the user to explore more on the website. After a user purchases tickets from the website, they can examine the section of 'before you visit'. It allows the customer to browse through recommended pages and information before they visit the aquarium. This section will let users download maps, look for directions, know the parking guidelines, view exhibits, and much more.
Click here to view the prototype of the welcome back flow.
This project was great learning in terms of process and collaborating within the team. Through this project, I understood the value of research in a project and how trade-offs are necessary. Practicing various research methods within this project were a great experience to learn new things. Even though the team consisted of many members, we completed this project without any hindrances.
The next step for this project would be to publish this newly designed website and get real-time data. It would help us understand how the real customers perceive the new design and what are their feedback. The team can also consider adapting this design for mobile devices and make the design responsive across various screens.
Developing a physical object and an interface that encourages people to share their true feelings with their loved ones.
Building a cohesive and in-depth data visualization that informs the viewers about all the information related to space missions from 1957 to 2020.