The problem

Museums, art galleries, and other cultural institutions were closed for months during the COVID pandemic. There was a need for art lovers to explore their favourite exhibitions from the safety and comfort of their homes.

The main goal was to create a smooth virtual tour experience following real-world conventions from art galleries.

The solution

Bring art and culture online so it's accessible to anyone, anywhere. The content and structure of the app were designed according to the IPOP theory of experience preference. This theory describes the different ways visitors are attracted to exhibits. IPOP stands for Ideas (conceptual, abstract thinking), People (emotional connections), Object(s) (visual language and aesthetics), and Physical (somatic sensations).

Exhibitions that appeal to all four visitor typologies have higher levels of user satisfaction. I designed Pocket Gallery to meet visitors‘ expectations for engagement and interactivity, focusing on presenting the artworks and the artists.

During the onboarding, users set their art preferences to receive customized tour recommendations. They can also connect with the artists and find out more about their creative process.

My role

I designed the app from conception to final prototypes. I consulted and shared insights with another colleague from the course once a week.

I consulted research focused on visitors experience using AR on mobile devices in museums to create two personas representing the mobile app’s ideal users.

I sketched paper and digital wireframes and did usability studies. I made design changes accounting for accessibility, and created low- and high-fidelity prototypes in Figma.

Understanding the user

I conducted interviews and created personas that match two user groups. The first group represents younger people who enjoy an interactive mobile experience. The second group has older people, who only can enjoy art experiences if they are accessible to them.

My research also revealed that all users prefer videos to autoplay with the sound turned off. The video length that appeals to most users is between 2 and 4 minutes. Some of the users need captions and/or transcripts.

---

---

---

Starting the design

I started by sketching big-picture storyboards focusing on the context of the user experiencing the app. While in the close-up storyboard each panel focused on the product itself.

---

Having the storyboards ready, I moved on to sketching different iterations of the home screen. My initial goal was to ensure users can easily select a virtual experience suitable for them. I marked the most useful elements of each sketch for later use in the digital wireframes.

I transformed the initial digital wireframes into a low-fidelity prototype and tested it with users. The unmoderated usability studies were done remotely with participants from five European countries. I interviewed participants between the ages of 18 and 65, who visited a museum or art gallery in the past 12 months.

View the low-fidelity prototype→

Key insights from the usability study

• Users need an intuitive way to select virtual tours from the home screen.
• Users want to set up the art preferences first thing during the onboarding
• Users prefer portrait mode for videos.
• Users don‘t easily recognize the closed captions icon.
• Users want to resume a video they started watching.

High-fidelity prototypes

The Pocket Gallery mobile app high-fidelity prototype was my first experience working in Figma. And as exciting as it was, it also was quite overwhelming at first.

I iterated on my designs and integrated insights from the usability study to create the final prototype.

Users found early designs for the home screen crowded and confusing. So, I added vertical scrolling for the home screen and horizontal scrolling for Video tours and Self-paced 3D tours.

The second usability study also revealed a need for more context. New designs include a tour Description, Transcript, and info about Artists.

As “82.5% of smartphone users hold their phones in portrait orientation when on a video site”, I decided to adjust the content for portrait mode.

New designs also show the total number of artworks included in the tour to give users a better idea of the tour content and length.

View the high-fidelity prototype→

Accessibility considerations

• Sound off: By default, autoplay starts out muted. This way users can choose to turn the sound on or continue watching the content with closed captions.
• Transcripts and captions: Closed captions are available for the hearing-impaired or for those who just don't want sound. Additionally, users can access timestamped transcripts.

Takeaways

Pocket Gallery was a project of many firsts: first sketches and wireframes, and first time designing in a tool like Figma.

It was interesting to conduct usability study interviews and observe the users interacting with my designs. Funnily enough, it was only at the fifth interview when someone noticed there was no Home icon in my design.

I've learned a great deal with each wireframe, mockup, and design iteration I made. I would really like to see galleries and museums across the world use this app.

Next steps

• Go beyond the one-gallery approach. Transform Pocket Gallery into an exhibition platform for galleries across the globe.
• Optimize video and image quality to provide a faster, smoother, and more engaging experience.