LA OPERA MOBILE APP DESIGN

UX/UI DESIGN

CLIENT

LA Opera has several successful youth outreach programs but recognizes that the majority of their audience is over 40. While these performances are well attended, the organization is concerned about maintaining relevance in the years to come. 

PROJECT

LA Opera seeks a digital solution that engages a younger demographic, millennials 23-39,  and presents them with an experience that grows into active appreciation and patronage.

GOAL / CHALLENGE

Create an app with social, educational, and interactive features targeting millennials by showing them that opera can be accessible, enjoyable, and social.

 

MEASURE OF SUCCESS

Increased attendance in the age group 23-38—we will know this to be true when we see the audience demographics shift to include a younger crowd.

MY ROLE

UX/UI Designer

TEAM

Laurie L. Young

Bonnie W. Hanson

Samantha J. Lane

William McKay

 

TOOLS

Figma

Sketch

Photoshop

Slack

Whiteboard 

 

DURATION 

Two weeks to research,
ideate, design, and test
a new prototype

OUR PROCESS

Discover  

Through interviews, learn what millennials think and how they feel about the opera to see where there are misconceptions.

Define  

Use our research and synthesized data to see how we could change the perception millennials have about opera.

Develop  

Establish a design direction from several iterations of sketching, wireframes, and usability testing, that addresses these main perceptions and creates a more engaging and entertaining interface.

Deliver  

Create a clickable
prototype rendered in color that shows our suggested changes and the new features we designed to increase engagement.

DISCOVER

C&C ANALYSIS

To begin, we conducted a Competitive and Comparative Analysis to see what apps were out there and what the common features were:

 

KEY INSIGHT

We found that most of the other opera company apps had very limited functions, leaving us with open-ended possibilities for what we could do for LA Opera. The main takeaway was that an embedded playlist might be an asset to potential younger audience members.

USER INTERVIEWS

We conducted 11 interviews with people under 40 who attended a live music or theater event within the last year.

We asked questions about their familiarity and/or interest in opera, as well as live theater and music, in order to find out what would encourage them to attend an LA Opera event.

KEY INSIGHTS
  • There are a lot of misconceptions about what opera is. 

  • Millennials primarily want a social experience.

  • Availability of information in advance can be a key decision factor.

Google Form Survey: 

We also conducted a survey on Reddit, Facebook, and UX Slack LA to get a larger sample. 85 people responded,
providing these results:

I DON’T FEEL LIKE I WOULD FIT IN

  • 64% thought opera was for an older audience

  • 50% thought opera was too expensive for them.

I WANT TO KNOW AS MUCH AS POSSIBLE ABOUT THE VENUE AND PERFORMANCE AHEAD OF TIME

  • “I want to know what the dress code is. I want to know what the process involves from the time I arrive
    to when I get into the venue.”

  •  “I like to know where it is, if there's parking, where my seat is.”

I LIKE TO FEEL FAMILIAR WITH THE MEDIA I CONSUME

  • 25% wanted to be familiar with either the story or the music.

  • 40% did not mind if they were familiar with the music/story

I DON’T WANT TO GO TO A SHOW ALONE, ONLY WITH FRIENDS

  • 82% found out about events through social media

  • 76% found out about events through word of mouth.

 

I WANT AN EASY ONLINE-TICKET BUYING EXPERIENCE

  • “For me, the thing always putting off online ticket buying is the service fees.”

DEFINE

AFFINITY MAPPING

We did 3 rounds of Affinity Mapping to find the key concerns that kept our interviewees from attending an opera. 

KEY INSIGHT
By the third iteration, we were able to identify 6 main issues and create “I” statements:
Round 3
First Iteration
PERSONA

From our interview subjects, I realized our typical user would be a young professional in their late 20s or early 30s. I collated our research to develop a persona, Kara Thompson. Kara works long hours in the entertainment business and on the weekends just wants to hang out with her friends.

She loves music, so most often she and her friends can be found attending a concert or listening to music in a club. Since she is tired at the end of the week, Kara prefers to stick to her favorite bands and rarely seeks out new music.

KARA THOMPSON
PROBLEM

I created a scenario that would encourage Kara to step out
of her comfort zone and be more open to a new experience. This helped us define our problem statement and set a direction for our new features.

 

Scenario

Kara's friend, Lisa, has a birthday coming up and Kara wants to plan a great night out for her. She knows that Lisa loves the movie, Rent, and read in the LA Times that La Bohème is the original influence for the play. Kara thinks it could be fun, but she's never been to an opera before and worries it might be too hard to understand and that she and Lisa won't fit in with the Music Center crowd.

Problem Statement

Kara is a young professional who is anxious about attending the opera because she has no idea what it's about and is concerned she will not fit in.

How Might We

How might we alleviate Kara's anxiety and help her feel comfortable so that she can have an enjoyable experience with her friend?

FEATURE PRIORITIZATION

Focusing on the “I” statements, I created a Moscow Feature Prioritization chart to determine the most important features
to include in our design:

 

  • An onboarding section that would explain to newcomers what to expect

  • Easy to find information

  • A social activity to create greater engagement

CARD SORTING

We went through several rounds of open card sorting to determine the best order and placement for each feature. 

KEY INSIGHTS
  • Starting with an open card sort, we defined the most logical categories and established a hierarchy for the subsequent closed card sorts

  • Going through 4 rounds of closed card sorting tightened up the categories and determine an
    optimal user flow

P3_OpenCardSort_GeneralNav_1.jpg

In addition, an online survey was conducted to see what commonalities we could find:

P3_OpenCardSort_CommunityEvents_Results.
USER FLOWS

For the design of the app, we focused on two particular user flows—one to buy tickets and one to get information about the venue and details on transportation options and parking.

 

 

KEY INSIGHT

These user flows have several points of information to make it easy for Kara to choose the things she wants to find out about most.

SITE MAP

We mapped out rough site architecture to get an idea of what the pages would contain.

KEY INSIGHT

For the home page, there was still some question as to the importance of features. 

I conducted one last card sort to see which elements would be most important to users and created a chart to more easily scan the results.

This gave us a definitive direction and we learned that ticket information and purchase was the number one overall goal for potential users.

site map card sort 4.jpg
Final Card sort results.jpg

DEVELOP

BRAINSTORMING

With our synthesized research and a clear design direction, we began sketching and brainstorming layout ideas.

 

KEY INSIGHTS

We discovered that our initial site architecture did not have an element that would set the app apart from other venue apps, and did not offer anything significant beyond what the existing website had to offer. 

In order to attract the millennial demographic and get them excited about an unfamiliar experience, we needed to create something unexpected that would involve social engagement.

 

Brainstorming idea after idea, we decided a scavenger hunt would accomplish our goal most effectively. It would provide information and facts about the venue, the currently running opera, and opera in general—while also being fun and interactive. 

SKETCHES

This set of sketches is for the scavenger hunt specifically and shows the process from my first set of thumbnails to revised low fidelity wireframes to work out the flow.

Visual depiction of icons
for scavenger hunt
First thumbnail sketches
Low fidelity wireframes for scavenger hunt
PAPER PROTOTYPE TESTING 

LO-FI

We did 4 rounds of paper prototype testing and here were the main takeaways:

  • Put a notification over the account menu after user has purchased tickets

  • Replace swipe navigation with a hamburger menu

  • On product page, “Opera 101” should have new information apart from home page, specifically the history of the particular show user would be attending

  • Rework ‘scavenger hunt’ to add a reward coupon

And one more round of low fidelity wireframes for the venue and transportation info making the navigation simpler:

WIREFRAMES
MED-FI

Moving onto medium-fidelity, we conducted 5 usability tests. Here were the main takeaways:

  • Add a ticket discount offer to the home page 

  • Add photos for seat selection (including view from seat)

  • Add more of a synopsis to the show page

  • Add price range to area seat selection

  • Add more information to logistics section

  • Shorten the length of the scavenger hunt to 5 challenges

WIREFLOWS
ONBOARDING FLOW

From all research, testing, and user feedback, we created an onboard experience that is logical, intuitive, and allows the customer to easily access any information or action they want. 

Additionally, there is clear navigation to special features
such as discount coupons, a photo view from any seat, and the scavenger hunt.
P3_Wireflow_DayOf.png
CHECKOUT FLOW

This flow is uncomplicated and allows the customer to gain information at each stage, as well as go back or view tickets after purchase.

P3_Wire_Flow_purchase_v2.png
DESIGN VISION

For the design process, I created a mood board to show the social aspects of LA Opera and the LA Music Center. This would guide our team in creating the high-fidelity screens, but also show “Kara” that there is a lot about the experience that will feel familiar and fun to her.

STYLE GUIDE / BRANDING

The style guide was heavily influenced by LA Opera’s existing branding. We used their color palette and added the green for contrast. We chose bold, line art for the icons to denote a fun, enjoyable feel., and a simple font that would read well on small mobile screens.

DELIVER

WIREFRAMES

HI-FI

In developing the high-fidelity screens, we took into account the existing brand guides from LA Opera, as well as feedback we received from a design critique by local developers. 

KEY INSIGHT
Based on feedback, we focused on large, evocative photos, as well as fun, illustrative icons with strong semiotic indications.
Onboarding
Buying Tickets
Home Page / Opera 101 / Select by Show / Show Information / Getting Here
Scavenger Hunt
RECOMMENDATIONS

If we were to continue developing this app, there are some components we initially explored but had to set aside for time.  

We recommend adding these features to enhance the opera-going experience and make LA Opera a must-see destination
for all ages. 

CONCLUSION

The process of discovering what LA Opera is about has been broadened to provide substantial relevance for millennials to make the connections that will resonate with them and create an appreciation and desire for the experience.

This is an ongoing evolution that would work hand in hand with the organization’s own outreach program, but by bringing together the social, digital, and in-person interactions, the experience can fit more organically into the lives of the younger demographic and convert millennials into life-long patrons of a vital and valuable art form.

KEY INSIGHT
I learned that connections can be formed even when there
is no obvious overlap in interests by finding the points of commonality and building out from there. We started with a persona who had no curiosity or desire to attend an opera—and I believe she is now looking forward to the next one. 
CANOPY BOOKS 
CANOPY BOOKS QUARTO
BABY TATTOO
  • White LinkedIn Icon
  • White Pinterest Icon
  • White Instagram Icon

© 2019 Laurie L. Young

Created with Wix.com