Improving discoverability and navigation on
The MET's desktop website
using eye-tracking and behavioral analytics data
Client
The Metropolitan Museum of Art (The MET)
Duration
12 weeks
Team
Sagarika Konanuru, Katie Im,
Van Nguyen, Sayali Nikumbh
Tools
Tobii - Pro Eye-tracking Usability Testing, Google Analytics, HotJar, Google Optimize
The Opportunity
The Metropolitan Museum of Art (The MET)'s website currently contains a large archive of art expert-generated content within the 'Perspectives Section' - containing various learning sources like articles, videos, and podcasts.
The organization's UX team approached us to help uncover opportunities to improve the 'Perspectives' section of the website by understanding users' usability pain-points and evaluating their current experience.
​
To understand the current experience our team formulated a plan of creating a hypotheses as usability experts and then test the hypotheses through qualitative and quantitative research methods including eye-tracking and spotting trends in behavioral analytics.
Process
01
Prepare
-
Preliminary Analysis
-
Hypotheses
-
Participant Recruitment
02
Test
-
Scripting and Tasks
-
Moderated User Testing
-
Eye tracking
-
03
Analyze
-
Mapping Test Results
-
Behavioral Analytics
-
Hotjar
-
Google Analytics
-
04
Report
-
Key Findings
-
Recommendations
-
A/B Test Plan
-
Google Optimize​
-
Prepare
Research Questions
-
How do users currently navigate the MET's Perspectives section through desktop? What is their general impression of the website and how do they find the overall experience?
​
-
How intuitive and indicative is the Perspective's section for a first time user? Can users identify the content section accurately?
​
-
How easy is the current search-ability and sub-navigation through the content in the Perspective's section? Are the current sort options sufficient for user needs?
Prepare
Methodology
Eye Tracking Usability Study
8 participants
Tobii Pro, Zoom, Google Forms
Behavioral Analytics
March 1, 2022 - March 1, 2023
Hotjar, Google Analytics
Multi variant Testing
6 weeks period
Google Optimize
Prepare
Hypotheses and Tasks
From our initial evaluation of the page as usability experts, we narrowed down on 3 main usability issues to test for, and created our tasks accordingly for our eye tracking study:
Low discoverability
Low Discoverability
Users may find it difficult to find the Perspective's section from the MET's Home Page.
Task 1
"Browse The Met’s website and find the “Perspectives” section."
Cognitive overload
Low Discoverability
Too many content types together may make it difficult for users to find specific content.
Task 2
" Find the MetPublications book entry ‘Art and Love in Renaissance Italy’ within the ‘Perspectives’ area of the site. "
Task 3
" Find a podcast clip from the Met and where to subscribe to them on Spotify."
Unclear features
Low Discoverability
Users may find it difficult to identify the type of content, hindering their navigation.
Task 4
"Find an article in the ‘Art & History’ category having the close look feature that allows you to view artwork in detail"
Test
Eye tracking
We set up our eye tracking tests, and divided the 45-min sessions into 5 sections:
Recruited users from nearby community with little art expertise
according to the usability issues identified as e
participants replay their tasks and think aloud their decisions
participants replay their tasks and think aloud their decisions
participants score the website for its usability and learnability
Analyze
Test Results
Problem List
Most of our participants found their experience with the MET's desktop website to be positive - with many of them complimenting its aesthetics. However, the participant study did reveal many opportunities for improvement on the mobile website in order to enhance overall usability.
​
After moderating eight usability tests accompanied with thorough note-taking of each session and then reviewing the recorded session videos, our team discovered 7 recurring issues across the four tasks.
Problem list
We then decided on 4 key issues that we felt were the low-hanging fruit - the ones that when resolved would make the most positive impact on the user experience with the least amount of effort.
System Usability Scale
After completing the tasks, we asked our participants to score the Perspectives section on its usability using the System Usability Scale to understand the performance of the website in terms of a quantifiable usability scales
48.75
The Perspectives section of the Met’s website’s SUS Score
Report
Findings and Recommendations
Finding
6/8 users struggled to find the Perspectives section from the MET's Home Page indicating a lack of clear identifiers in the navigation bar leading to low discovery.
Evidence
When asked to find the 'Perspectives section' from the MET's Home Page in Task 1, all our users looked for the keyword 'Perspectives' in the main navigation bar first and then utilized the search bar when they failed to identify the submenu item.
Heatmaps show strong activity in the navigation menu of the Home Page during the first task.
In comparison to other MET's pages, the Perspectives section has less than <1% of the total site traffic, and nearly 67% new users - indicating poor discoverability and retention.
Recommendation
Renaming the submenu item using the vocabulary ‘Perspectives’ could indicate to users that it is a learning source from experts and help them understand the context and content within it.
Before
After
Finding
6/8 users requested additional context once they landed on “Perspectives” Page indicating they are unable to form a mental model of what the Perspectives Section contains, and how to utilize it.
Evidence
When asked to summarize the Perspectives Section and what it contains, though several users answered correctly, their replies indicated they were low on confidence and unsure.
" Probably as art critiques? I would expect famous persons' critique of art and their viewpoints. I had no clue what it would contain. I thought it would be Met's own opinions or people like me's opinion, or SME's opinions or newsletters."
" I didn't know what Perspectives is from the words right from the start - maybe because I'm not a frequent museum visitor. Even after visiting the page, I'm not sure what it is - is it just articles?"
The scrollmaps from HotJar indicate that most user attention is before the 'fold' and slowly trickles down with no clear focus points on the page. Additionally, the analytics from Google Analytics indicate that most of the users arrive to the Perspectives Main page from other pages within the section, but quickly leave, with a drop off rate of 93% - indicating that users may not be able to understand and comprehend the content on the page.
Recommendation
Adding a description introducing the section and what it contains would increase the chances of users connecting with and exploring the content on the page
Before
After
Finding
8/8 users were confident completing the task of finding a specific media type due to an intuitive icon but reconfirmed using the tooltip, indicating that they lean to segmenting content through media types but are unsure during navigation due to lack of clear distinction between them.
Evidence
Several users indicated that they were unsure of how to find specific content once on the Perspectives section, and mentioned they were overwhelmed with the amount of content on the page, indicating that users are looking for a way to sort through the multiple media types on the section.
" There was a lot of info coming at me on the page. I understand there is a lot of info the display but because it's a lot of artwork and texts it's over stimulating."
" Overall, it was a bit confusing. I think I was hoping for more navigation once within the Perspectives page."
When asked to find a 'Close Look article' on the Perspectives section, users mentioned that the icon assisted the users in completing the task.
​
However we noticed that they used the tooltip to reconfirm their choice of navigation, indicating the importance of consistent usage of icons and tooltips for navigation.
Videos and Articles were the most accessed content types with their sections, indicating media type as an important element to users' navigation.
​
Additionally, when asked to find specific content, users were drawn to the subheading area to complete tasks indicating they were looking for additional navigation options.
Recommendation
Renaming the sub-headers and segregating the content types on the main Perspectives page by relabeling them to media types will give users a clearer idea of the types of content on the page and how to sort through them.
Before
After
Additionally, consistent usage of media icons and tooltips would help users confirm the media type and improve navigation.
Before
After
Next Steps
Multi Variate Testing
To validate our recommendations from the eye tracking and analytics study, we would further suggest a multi variate test to optimize our design decisions, and pinpoint which elements are most effective.
Duration: 6 weeks (Launch date TBD)
To understand the best way to introduce the Perspectives Section to first time users​, we would test two versions of the Perspectives main page with and without a section description - Recommendation 2.
​
To understand the best way to to improve the search-ability of the content within the Perspectives section, we would test two versions of the Perspectives main page with sub navigation options of media types - Recommendation 3.
Variations:
Original
Descriptive Blurb
Media types as sub navigation items
Perspectives Descriptive Blurb & Media types sub navigation
Metrics:
To track and measure the outcome of the multi-variate test, we suggested the following function that would indicate as a positive impact on the user experience of the Perspectives section of the MET's desktop website :
Primary Measurement:
Decrease in the % bounce rate from Perspectives Page
Secondary Measurement:
Increase in the Clickthroughs and Session time once users land on Perspectives Page
Main Takeaways
The clients really appreciated the work we had done into testing the desktop website for usability issues, and looked forward to implementing the recommendations we suggested as soon as possible.
​
By implementing these small changes, I truly believe that the website's navigation and usability would improve greatly.
​
It was incredibly rewarding to test the website for usability issues and narrow down on what would be easy to implement, as a company with the least effort - to create the maximum benefit.
