The Atlanta Symphony Orchestra (ASO) is one of America’s leading musical institues. While it was officially founded in 1945, different versions date back to 1923.
As part of a student project while attending General Assembly, our team was given the task of redesigning ASO’s desktop and mobile experience in a way that increased diversity/inclusivity and improved their overall ticketing process. During this project, we found that those unfamiliar with symphonies and orchestras had difficulty finding information relating to etiquette and attire and also wanted more guidance when choosing their seats.
A more intuitive website that appeals to a wider audience, features an internal ticketing process with a "view from seat" feature, and easily locatable first time information.
My Contributions
While I contributed to each phase of the project, I played a pivotal role in interviewing users, affinity mapping our data, developing desktop wireframes, and testing our designs.
Duration
2 weeks
Tools
Adobe XD, Miro, Google Docs, Google Slides
Click a box to skip to a specific section or keep scrolling to start from the beginning.
User Interviews
Contextual Inquiries
Competitive Analysis
Card Sorting
Affinity Mapping
Personas
Journey Map
Site Map
User Flow
Design Studio
Whiteboarding
Wireframing
Mockups
Usability Testing
A/B Testing
|---------------------------------------------------------- 2 weeks ----------------------------------------------------------|
The average age of an audience member at an ASO concert is 50+. We decided that within our 2 week time frame, we could create the most impact by focusing on what considerations different age groups had in regards to the symphony. We also believe that there are other opportunities for increasing ASO audience diversity.
Over the course of 2 days, We completed 6 user interviews & contextual inquiries.
Our users ranged from 19 to 45 and included some that had been to the ASO and some that had not. Of the 6 people interviewed:
During this time we also completed a competitive analysis. It compared ASO to other symphonies in the US and other attractions in Atlanta. The data revealed two distinct differences: ASO was not reaching as many people on social media as other symphonies in the US and most well-known symphonies had an internal ticketing process while ASO did not.
As we started to synthesize our data, we quickly realized the majority of our users disliked that the ASO uses Ticketmaster and Live Nation for their ticketing process. They found this part frustrating and untrustworthy. They also found the website to feel cluttered and had difficulty finding pertinent “first-time” information.
"I have had hiccups in the past with bringing in a backpack or water bottle that wasn't allowed."
"I hate Ticketmaster in general."
Other key insights:
This information led me to create our journey map. Later, our group created problem, solution statements, and a user flow diagram.
Problem: Tim wants to buy tickets to the symphony as they are featuring one of his favorite artists. He needs help finding a "good" seat in the concert hall that won't exceed his budget as well as information on what to expect at the concert.
Solution: The new ASO website will feature an easy to navigate FAQ page for new participants, a concise event page, and an internal ticket booking service that features information on each seat's view and sound quality.
User Flow:
Once our data was synthesized, we spent a day whiteboarding, sketching, and conducting a design studio. We felt that this was the quickest way for our group to begin redesigning ASO's website based on the key features our users wanted.
After debating, dot voting, and iterating over these early sketches, we were able to begin wireframing in Adobe XD. That weekend I created the homepage, event calendar, event list page, and event page. One of my teammates created the FAQ pages and ticketing process.
Over the course of 2 days, I conducted 4 usability tests with our desktop wireframes while another teammate worked on building and testing mobile wireframes. Initial tests revealed that a couple of our menu items were worded awkwardly - specifically “Concerts” and “Visit.” As suggested by one of our teammates, we created an A/B test, thinking that either “Calendar & Events” or “Ticketing” had to be the one. As it turns out, “Calendar & Events” still felt awkward for our users and when testing “Ticketing,” they had trouble locating the calendar page. Further research and interviewing revealed a new option:
I tested “Events” with a couple users and, so far, this has proven to be our best solution. Below is a comparison of ASO’s current header and our final version.
We made a number of other iterations throughout our testing. These include:
Event list page: Added a filter system, changed the menu header, made the button “Buy Tickets” go straight to the ticketing process.
Instagram / Attire page: Reduced the size of the “Attire” section. Changed “Dress to Impress” to “See What Others Are Wearing.” Added a “Load More” button instead of arrows. Changed the top menu header.
Ticketing page: Added breadcrumbs, moved the “Date and Time” to the same gray box as the name of the event, added a seat selection tool in place of a gray box. Removed the “Add Best Available Seats to Cart” button and changed “Select My Own Seats” to “Select Seats.” Changed the min and max prices to better reflect symphony pricing. Changed the main menu header. Changed the size of “clear selection” links.
Seat selection page: Added breadcrumbs, a legend, and the description “view from seat(s).” Added a clickable diagram to “Search Other Levels.” Removed “Add Seats” button and made more things clickable. Now, after selecting seats, the user can click “Proceed to Checkout.” Added fees and link for fee description. Removed filters at the top right. Added “Step 4.”
After finalizing our wireframes, our team began creating high fidelity desktop and mobile mock-ups in Adobe XD and putting together a 20 minute presentation.
Here are some of the desktop mock-ups that I made:
I'm always happy to discuss UX, music, modular synthesis, ping-pong, etc...
