top of page

NMMA

National Museum of Modern Art

A UX Design Case Study

James Lex, UX Designer

Overview

Through the Google User Experience Design Program, over the course of 8 weeks I built an app for a fictious museum, based off real research and moderated usability studies. Below you'll find the journey from research to sketches to the final product that would be ready to pass off to the engineers and the client.  

Goal: Create an app and responsive website for the NMMA that prepares users before their visit, navigate their time there, and easily access information on exhibits, events, and works of art. 

​​​​​

My Role: 

  • Initial User Research

  • Sketch wireframes and low-fidelity prototypes

  • Design and conduct usability studies

  • Create and present final mock-ups​​​

​

Duration: June-August, 2024

Step 1: Understanding the User

Targeted Audience: Museum patrons

​​

Starting Questions: 

  • How do we make the museum experience more accessible? 

  • How do we make the museum experience customizable to what each visitor wants?

  • How can we create a journey with a beginning, middle, and end? 

​

​

Synopsis: My initial research was overhwelming at first, but I finally landed on 2 valuable resources that were reliable: American Alliance of Museum and The Smithsonian Institute. 

 

Below you'l find some highlights that would inform me on creating personas. 

​

​

Museum Visitor Report 2023

Wilkening, Susie. “Museum Visitation-Frequency vs. Incidence Gaps: A 2023 Annual Survey of Museum-Goers Data Story.” American Alliance of Museums, 24 Oct. 2023, www.aam-us.org/2023/11/17/museum-visitation-frequency-vs-incidence-gaps-a-2023-annual-survey-of-museum-goers-data-story/. 

4 Ways of Experienceing Museum

Pekarik, Andrew J., and B. Mogel. 2010. Ideas, Objects, or People? A Smithsonian Exhibition Team views visitors anew. Curator: The Museum Journal 53(4): 465-482. Leger, Jean-Francois. 2014. Shaping a richer visitors’ experience: The IPO interpretive approach in a Canadian museum. Curator: The Museum Journal 57(1): 29-44.

Ideas
Abstract Thinking

People
Emotional Connection

Objects
Visual Language

Physical
Somatic Sensation
 

Meet the Personas

Victor

Age: 42

Father of twins

Freelance IP Consultant 

Rebecca

Age: 20

College student, 

studying art history

​

Victor wants to educate and entertain his twins, Bobby and Mae, this coming weekend. He's frustrated about finding the best activities that engage them but that he also enjoys as well. 

​

"I want to sho wmy kids all this city has to offer," says.

 

How can we prepare and engage Victor? If a huge population of museum goers are parents, we need to think about how children need support and ways to engage as well. 

Rebecca is an art history major in the city and wants to visit the museum to be inspired by her next project. She's also hard-of-hearing and feels a lot of anxiety of visitng museums that are overwhelming or not accommadting to her disability. 

​

"I like to find a single work of art and stare at it for as long as I can. Then I like to tell someone all that felt."

​

How can we ease Rebecca's anxiety by preparing her? More so, how can we assist in her search for inspiration? 

​

​

Tools to Empathize

Tool 1: User Journey Map

Tool 2: Storyboarding

Pain Points

01.

Reserving Time

​How can we make reserving a time slot and entering the building as easy as possible?

02.

Navigating Building

How can we make navigating the building intuitive and seemless?​

03.

Accessing Knowledge

How can we make the knowledge engaging and balanced?

04.

Customizing Visit

How can we make a patrons visit flexible to what the patron needs/wants?

Step 2: Design

Initial Sketches/Paper Wireframes

  • The bottoms tabs can be used as a narrative with a beginning, middle, and end

  • In this case, the patron can use the app to assist them before, during, and after the museum experience

  • ​After brainstorming several ideas, I decided on a homepage, a booking page, a self-guided tour gallery, and a scanning feature 

Digital wireframes Layout

Homepage

 

Before the visit, patrons can check out current exhibits, accessibility features and accommodations, and more.  

Booking Page

 

After a patron decides on their visit, they can move on to the 2nd tab, where they can book a time and save a QR code for easy check-in.

Tour Page

 

The third time is by the most ambitious, where patrons can choose from a variety of tours, including ones for children/teens. 

Scan Feature

 

The final feature is not only a place to scan art to find info, but save the pieces to the app so they can reflect on what they saw. It's the "end" of the user's journey. 

Usability Study Findings

I interviewed 5 people for the initial usability, ages 26-65. They used the low-fidelity prototype to navigate 5 prompts. 3/5 tasks were completed easily and 2/5 was consistent bumpy, pointing to a clear direction of what needed to be modified. After the final prototype, I performed another usability study. Below, you'll find highlights from both. 

Finding 1: Users Need a Confirmation Page

Low-Fidelity Prototype

Information Architecutre contined to be refined after both usability studies.

​

  • A confirmation page was added

  • A feature to input accommodations to the reservation

  • ​A drop-down menu for the time replaced the punch-in time request so that only available times will appear

  • A clear label that informs where the QR code for access will be saved 

High-Fidelity Prototype

Finding 2: Users Need a More Intuitive Way to find their personal museum collection

What should be on the first page of the scanning feature?

​

  • In the first iteration, the userflow went straight to the camera to perform the task. In the usability study, 2/5 users didn't understand how to use it

  • In the second iteration, the scan page allowed an option to open camera or checked out the saved "personal museum collection"

  • In the final iteration, it opens straight to the collection with a action button calling the user to scan to add to their collection

Iteration 1

Iteration 2

Iteration 3

Finding 3: Users need clarity on the self-guided Tour Page

Simplicity over creativity

 

  • The initial idea was to mimic an art gallery, but 2/5 of the users in the study commented on the size and shapes of the self-guided tour page with some hesitancy

  • After some more sketching, I thought a more simple design would be more approachable

  • Moving forward, I'll focus on how accessibility features allow patrons to navigate each tour

Iteration 1

Iteration 2

Iteration 3

Step 3: Final Prototype 

Explore the latest prototype here: 

Navigation​

​

  • Explore the homepage

  • Book a reservation

  • Click through the tour. In this prototype, all tour selections lead to the same tour prototype

  • Scan an art piece and add it to your personal museum collection

Quotes from final usability study:

​

"It's exactly what I want in a museum app."

​

"Intuitive and easy to navigate."

​

"I really like the use of pictures and photos. That's what draws me in."

​

"Simple. In a good way."

​

Step 4: Moving Forward 

Testing Accessible Navigation

  • Test Text-to-Speech on multiple devices

  • Insure language preferences are available and accurate

  • Enlarging text is intuitive (zoom-in and zoom-out)

  • Cross checking Web Content Accessibility Guidelines (WCAG) 

  • Adjusting color, animation, and speech is available 

Unmoderated Testing

  • Beta-testing on a diverse group of 100-150 users to use while navigating museum 

  • Offering a meal voucher at the museum café in exchange for feedback (10-20 minutes long)

  • Collecting data on multiple KPIs such as user-error rate, task completion, and overall satisfaction 

Collaboration with Museum Experts

  • The text in the prototype was created through Ipsum Lorem or Gemini's AI generative text. Moving forward, collaboration with the museum would be essential to deciding on customizing self-guided tours

  • Did we meet the needs of the museum as well as the musem patrons?

bottom of page