Listen Boldly

App Redesign Concept

Role

I worked as the Interaction designer for this concept project. I used rapid prototyping to create sketches and a paper prototype. Using Sketch I created wireframes and built clickable prototypes in InVision. Based on feedback received by our researcher, Ernest Grijalva, I iterated the design to address pain points and issues encountered and expressed by the users.

Challenge

Redesign the Seattle Symphony’s app Listen Boldly so that users can navigate the app with ease, by redesigning the navigation, improving calls to action and removing unnecessary features.

Duration

2 weeks

Platform

Mobile

Deliverables

Sketches, Wireframes, Paper and Clickable Prototypes

Team

Owen Camber - Interaction Designer

Paige Jenson - Visual Designer, Project Manager

Ernest Grijalva - Researcher


What is Listen Boldly?

Listen Boldly is the Seattle Symphony’s app. It focuses on the events put on by the Seattle Symphony, but also showcases other events at Benaroya Hall. Users can view upcoming events and purchase tickets for them from the app.

Orignal Logo.jpg

Problem

We believe that users need a way to quickly purchase and access already purchased tickets, and have more control over seat selection through the Listen Boldly app, because currently it is a lengthy and complicated process which causes users to turn to alternative methods when purchasing tickets.

Solution

We believe that by restructuring and simplifying the ticket purchasing and access process, our users will be able to quickly and easily purchase and access tickets. We will know this to be true when more users are purchasing tickets through the Listen Boldly app and report a positive experience.


Sketches and Wireframes

Persona

Ernest Grijalva, our researcher, created the primary persona of Fiona Gutierrez. I used this persona to guide my design and help identify which features to include and which to remove.

  • Fiona likes to keep all her schedules in one place, and so would prefer an app that automatically adds events to her calendar.
  • She is easily annoyed by apps that have inconsistent and hard to understand navigation.
  • Apple pay is Fiona’s preferred method of payment.
Primary Persona.jpg

Sketches and Paper Prototype

To begin I created multiple very low-fidelity sketches of each screen using rapid prototyping. I then created a slightly higher fidelity sketch of each screen to be used as a paper prototype in order to test the navigation of the app.

Home.png
Event Page.png
Events.png
Seats.png

Wireframes

Using the feedback I got from the paper prototype I created wireframes in Sketch. I focused a lot on the seat selection of the app, trying to find a solution for the small screen of a mobile phone. Once the wireframes were complete I built a clickable prototype in InVision, which was used for usability testing.

Screen Shot 2018-03-30 at 10.23.28 AM.png
Screen Shot 2018-03-30 at 10.23.53 AM.png
Screen Shot 2018-03-30 at 10.24.22 AM.png

Usability Testing

Iterations

I used feedback from the usability testing to iterate the design, improving the navigation, reorganizing content and improving features.

This shows the iterations of the event information page. Initially the user would select an event from the event calendar and then select the date. But many users found this confusing, so I changed it so that each day that a show was playing was its own event. Later I added a clear call to action for adjusting the number of tickets the user was purchasing as this was not clear.

Event Page.png
Version 1 Event Page.jpg
Event Info.png

Design Studio

The problem of how to allow users to select a seat was a very difficult one. Each section had several hundred seats in it, so selecting any particular seat was impractical on a phone. However, automatically assigning a user the “best seat” in a section did not work, as users stated that they wanted direct control of this. We decided to hold a design studio with the entire team in order to come up with a solution. This worked very well, and we came up with a system where users would select their section, and then apply several filters, then the app would prioritize the seats available for the section based on those filters.

IMG_20180220_153842.jpg
Event Info with boarder.jpg
Section Selections with boarder.jpg
Seat Selections wiht boarder.jpg
Pick Seats with Boarder.jpg

Reflections

Next Steps

If I were to continue this project I would like to do another round of usability testing. While I am really pleased with the solution we came up with for the seating problem, we did not get a chance to validate it with users.

Lessons Learned

One of the biggest lessons I learned during this project was that I should always be working. Doing nothing while waiting for the researcher to conduct user interviews just waists time. There is always something that I can be working on.