artaro

Role

UI/UX Designer

Deliverables

Competitive audit, Survey Results, Personas, Wireframes, Prototypes (Low fi/High Fi), Usability Test Analysis

Tools

Figma, Adobe Photoshop, Milanote

Introduction

Artaro is an audio tour app for an art gallery that strives to be known not only locally but also for museums and art gallery visitors by venturing to the online world. Artaro aims to bring a different experience and accessibility for all users.

The Problem

Museum visitors who wants to fully experience the gallery but finds tour guide packages expensive and goers who wants to learn more about the gallery but doesn't have the luxury of time to visit personally

The Goal

Design an app that allows users to fully experience the tour at home or to fully tour the gallery without the need of a tour guide.

Research

I conducted interviews and created empathy maps to understand the users I'm designing for and their needs. A primary user group identified through research Was avid or first time museum and art gallery goers

This user group confirmed initial assumptions about museum and art gallery visitors, but research also revealed that location of the museum and art gallery was not the only factor limiting users. Other user problems included accessibility, interests, and prices that make it Necessary to make an app for the users to fully experience the exhibits.

Key Insights

image

Expenses

Galleries and museums who offer tour plans are a bit pricey

image

Time

Working Adults with children doesn't have the luxury to visit museum and art galleries.

image

Accessibility

Platforms without assistive technology and translate options for their preferred language.

image

Location

Museum and art galleries are sometimes far from homes and takes a bit of travelling time

Persona

personaka personaka

Ideation

Key Digital Wireframe Screen


kapaperwframe

As the initial design phase continued, I made sure to base screen designs on feedback and findings from the user research.


Provided a box details for users to review their ticket booking.


Added Paypal as another mode of payment requested by a participant.


Lofi Prototype

Using the completed set of digital wireframes, I created a low-fidelity prototype.
The primary user flow I connected was purchasing a ticket through the app, so the prototype could be used in a usability study.


kapaperwframe

Initial Usability Findings

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups.
The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.

Round 1 Findings

  • Users want more accessibility options
  • Users wants to have a confirmation notification after purchasing a ticket

Round 2 Findings

  • Download button nowhere to be found
  • “Choosing a language should be at the start of the app”

(Early designs, after purchasing a ticket, screen immediately goes to the home page without even notifying if the ticket is purchased).

Final Alteration


Key Screens



keyscreen__1

Users are asked on what language they prefer after the app opens for the first time.

keyscreen__2

Search and categories play vital roles in apps, particularly in enhancing user experience and facilitating efficient navigation within the app's content.

keyscreen__3

Users can see the whole tour and choose from the exhibit they are interested in or follow the playlist according to their sort and position in the gallery

keyscreen__3

Users gain numerous controls after opening an audio file, they are presented with the text version of the audio which users can translate to whatever language they prefer.

Common audio controls are included as well.

High Fidelity Prototype

Click here to view Prototype

artaro hifi

Accessibility Consideration

  • Provide a vast selection of languages to choose from or translate from
  • Integrate a text to speech feature at the very start of the app and apply color neutral icons for users diagnosed with color blindness
  • Name the icons so that everyone can have a clear understanding of what the icon means or do.

Artaro Website version

kidsaid website

Moving forward

  • Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed

  • Research a lot more accessibility options that can be integrated in the app

  • Gather data if the on-site app is a hit and can be integrated to the app for online purchases

Thank you!