Audio Tour App

Project Background

Created a prototype of an Audio Tour App for the users who are visiting an Art Museum. A user should be able to book the Museum tickets and listen to the audios on the app peacefully, at their own pace.

Initial Research

Researched existing Art Museum Apps on how their apps were designed before initiating the design process. Inspecting several Art Museum and Galleries apps and identifying gaps and improvements that could be made to my design.

After competitive analysis, I developed three main goals which could be pursued:

  1. Locate me option on the Map

  2. Easy navigation

  3. Description and details of Art under the image

Gaps which could be solved:

  1. Language Options

  2. Brief description and details of the Artist

  3. Simple way to look at Events details

Competitive Analysis

Persona and User Journey Map

To give a realistic picture of user’s behaviors, frustration, and desires, a series of user interviews were conducted with people who had interest in visiting Art Museums and Galleries. Mehak Mehta became the primary persona for the duration of the project as she best represented the user for the Audio Tour App.

Journey Mapping of Mehak Mehta

Mehak Mehta: One of the Personas created to understand user needs

Problem statement of Mehak Mehta

User Flow and Paper Wireframes

With the target users well-defined, I outlined a user flow of the overall process for the Audio Tour app and sketched out the home page.

Paper Wireframes

User Flow

Gray Scale Digital
Low Fidelity (Lo-Fi) Prototype

The basic user flow helped me to quickly outline how the prototype would function. I created different screens of the app in Figma with the help of the flow created prior.

Wire Frames

User Interview

I developed a script of interview questions to ask potential users and conducted a series of moderated user interviews. Questions were asked at every step, and participants were instructed with the general purpose of the website before conducting the interview. Participant consent was taken before recording the interview.

Usability Study Note and Affinity Diagram

I used affinity mapping to sort the information gathered from various subjects into categories such as finding the user's current location, understanding the purpose of the audio icon on the screen, and booking events. The affinity diagram was created on the Miro app.

Affinity Diagram which helped understand the interviews conducted

Pattern Identification and Insight
Identification

Discovered patterns and themes from groupings made in the affinity diagram, which originally came from the note-taking spreadsheet.

Pattern Identification of the research conducted from potential users.

Insight Identification of the research conducted from potential users.

High Fidelity Prototype (Hi-Fi)

After conducting user testing and identifying several areas for improvement, I began working on a high fidelity prototype of the app. Starting with the homepage, I applied what I had learned from my research and testing to the design. I added a "like" button to allow users to save art for later, and made it easier to move from one art description to another using a map that shows the user's location.

Booking Tickets

Here is a demonstration of a user going through the booking for an event through the app.Adding a booking user experience (UX) for a museum app can greatly enhance the user experience, allowing visitors to plan their trip ahead of time and make the most of their visit.

Color Scheme and Typography

I tried different color schemes using the app "Coolers," but ultimately decided to use a simple black, white, and light shade of orange theme with bright orange accents. This added a pop of color to buttons and navigation, while keeping the site clean and legible. The colors are accessible to all users. I also experimented with many different fonts before ultimately settling on a single font for consistency and legibility. The Robot font was chosen for its readability.

Initial Color Scheme

Final Color Scheme

Typography