top of page

Galleria

Galleria was envisioned as a white label companion app for galleries and museums. A way to find your way without a tour guide  or feeling like you missed any info.

Duration - March 2022 to December 2022

Role - Lead UX Designer

Tools - Figma, SurveyPlanet, Pen & Paper

Responsibilities : Competitive Analysis, User Research, Wireframing, Prototyping, Testing.

The Product

A white label companion app for galleries and museums that can act as a personal tour guide. 

The Problem

Competitive analysis showed that there seemed to lack a full companion app experience for many museums/galleries. And, the handful of dedicated ones could be frustrating to use.

The Goal

Create a companion app experience that allowed users to do everything - from buying tickets, viewing exhibits, to mapping out their next visit.

Understanding
the user

  • User research

  • Personas

  • Problem statements

  • User journey maps

User research : summary

I conducted remote interviews with several users, choosing a range of users with different levels of museum/exhibit going experiences, to glean as much info as possible about different expectations and experiences that they had. I was expecting some interviewees would want to be more in control of their museum/gallery going experience, but was surprised to find that all participants expressed they would vastly prefer that than conventionally guided tours. This helped tremendously in guiding Galleria.

User research : pain points

1

Ticket
Purchasing

A complaint some users had was that in some companion apps there wasn't a straightforward and easy way to purchase ticket while within the  app.

2

Audio

Users had mentioned they like the audio portions of exhibits, but they don’t always feel hygienic or work with the gear provided. A way to incorporate text to audio felt like a must, and users could use their own headphones.

3

Tour
Experience

All users expressed how they didn’t necessarily like being tethered to a tour group, that they’d like to take things at their own pace. Going forward I wanted to design a way for users to create their own route and tour.

4

Exhibit
Perusal

A big frustration that users expressed was not always being able to read or clearly see all of a piece or exhibit because of crowds or info placement. It was important to design a way for users to get and see all the info they want.

Persona : Michael Nguyen

_Michael Nguyen_ - Persona .png

Problem statement : Michael is a discerning artist who needs a way to experience a foreign art gallery fully and independently because he's looking to immerse himself in art, but can get overwhelmed by large tours. 

User journey map

My goal was to see where in a typical gallery/museum going experience the pain points happened and how I could alleviate them going forward. A lot of issues seemed to stem from some inherent accessibility issues that sometimes come up from a traditional tour experience and lack of accessible information.

Screenshot 2023-03-04 185618_edited.png

Starting
the design

  • Paper wireframes

  • Digital wireframes

  • Low-fidelity prototype

  • Usability studies

Paper wireframes

My initial goal was to try and find a way to display a museum or gallery exhibits in different ways. A thumbnail view to quickly scan and see what catches a person’s interest, or a more detailed and informative view  to dive deeper into  the exhibit.

Digital wireframes

My initial goal was to design a way to quickly view what a venue has to offer in a very easy to digest manner, with ways to drill deeper into content that catches a users attention.

Digitalwireframessnip.png

Digital wireframes

For the main content page of an item I wanted to include any info that a user would want to see. During preliminary research many users were very specific in the type of info they expect to see. It was important to show that info, but also not overwhelm a user with text at first.

digitalwireframessnip2.png

Low-fidelity prototype

Lo-fi prototype

 

The flow from logging in, to basic exhibit viewing, to a basic map, and finally ticket purchase flow.

Lo Fi Screen Prototype Connections.png

Usability study: findings

I conducted a remote usability study with several participants for both rounds, recording both their screen and voice. The first round showed that some visual cues could be better, for instance the inclusion of both hamburger menu and bottom nav for the same items confused some.

Round 1 findings

1

Users needed better cues for selecting a ticket date.

Round 2 findings

1

Verbiage on creating an “itinerary” was a little confusing.

2

Some verbiage confused users.

2

Navigating exhibits was easier.

3

Call to action to purchase tickets could be better.

3

Ticket purchasing was a quick and easy for all participants.

Refining
the design

  • Mockups

  • High-fidelity prototype

  • Accessibility

Mockups

Early designs had more thumbnails shown at once with an alternative navigation UI. After usability studies, the amount of exhibits shown at once was reduced to increase readability. I also redesigned the navigation bar to remove redundant elements.

Before usability study
Samsung Galaxy S20 5G - Exhibits Lo Fi.png
After usability study
Samsung Galaxy Note20 5G - Exhibits HI Fi.png

Mockups

My goal for the detailed view was to show information that users expected to see in a clear and organized manner. To know that, I asked users about their exhibit going experiences and what they want/expect to see when viewing an artwork.

Before usability study
Samsung Galaxy Note20 5G Exhibits List View Lo Fi.png
After usability study
Samsung Galaxy Note20 5G - Exhibits List View Hi Fi.png

Mockups

Samsung Galaxy Homepaeg Hi Fi.png
Samsung Galaxy Note20 - Map.png
Samsung Galaxy Note20 5G - Exhibits HI Fi.png
Samsung Galaxy Card Info Filled.png

High-fidelity prototype

Hi Fi Prototype Connections.png

Accessibility considerations

1

Language and
voice

With so much text, media, and aligning with many exhibit going experiences, it was important to include multiple language options in combination with text-to-voice. 

2

Contrast

It was also important  that contrast passed accessibility standards to avoid user fatigue. Consuming combination media with low contrast could dissuade most users, much more if that user already has vision issues.

Going forward

  • Takeaways

  • Next steps

Takeaways

Impact

“I would definitely use it if I was going to a museum. It was consistent and easy to use.”

“Yeah, totally intuitive. Kinda wish this existed.”

What I learned:

While designing Galleria it definitely reinforced how designing with accessibility in mind benefits the whole design, for everyone. It also served as a guiding light when deciding the best way forward with an idea or design. 

“I found the various functions of the app well integrated!”

Next steps

1

2

3

I’d like to flesh out the map experience a bit more. While functional and useful in its current state, it could use some more functionality.

I think designing a quick tutorial would benefit most users. While the current design scored highly on SUS surveys, there’s always room for improvement! 

Adding search functionality to the exhibits section would be a boon. There’s already exhibit tags, so it makes sense to expand on that and design a way to search for types of exhibits.

bottom of page