OverviewThe ProcessResearchIdeationDesign & IterationFinal DesignReflection

Escape

An online concert experience that is as immersive as an on-site one.
Mobile + Web
0-1 Design
Digital Entertainment
Dark Mode
CONTEXT
4 months, Fall 2020
MY ROLE
End-to-end UX Designer
TEAM
Sarah Hu, UX Designer
Liuyun Hu, UX Designer

Overview
The live music industry lost more than 30 billion dollars in 2020 due to the pandemic. Hundreds of live music events have been cancelled or postponed. Therefore, some artists started to stream performance online. However, according to SCADpro's survey, 84% fans were disappointed with the current online concert experience.
How might we make a better form of online concert experience that is as amazing as an in-person one?
We, a team of three designers, conceived a new form of online concert experience with multi-device interaction - when users wave their phones as interactive glow sticks, their avatars do the same in the virtual auditorium! 🪄  
We also invented a roller-coaster like online concert journey including 3 phases:
‍
‍
‍
Jump to Final Design
THE PROCESS
I was actively involved in every stage of the UX design process:
WHAT USERS SAID
"Going to concerts is a short escape from life."
To empathize with our target users - concertgoers, we started by analyzing SCADpro's survey findings and conducting 7 semi-structured interviews. The main purpose of concertgoers is to enjoy the live atmosphere, release pressure, and interact with the artist. However, online concerts didn't meet the user needs in these three aspects. In addition, they tend to use larger screens (laptops, TVs, etc.) instead of phones to watch online concerts to enhance immersion.
‍
‍
‍
USER JOURNEY
What is missing in the online concerts compared to the onsite ones?
  • Compared to the on-site version, the online concert is completely missing the pre-concert and post-concert activities, such as buying merchandise and dressing up before the concert, or sharing photos and videos after the concert.
  • During the concert, lack of interaction leads to low immersion & low participation.
Click to enlarge 👆
‍

‍
TO SUM UP
The entire concert experience is a roller-coaster like journey consisting of 3 phases:
  • Building anticipation before the concert
  • Immersive experience during the concert
  • Transferring the energy from the concert into life after the concert
There were 4 key components that contributed to an amazing concert experience that led us to our design goals:
‍
Ideation
Brainstorm ideas and prioritize those most relevant to the design goals
‍
‍
Consolidate prioritized ideas into a journey
‍
USER FLOW
Structure information into 4 categories and specify the user flow
‍
‍
PROTOTYPING
Mid-fi UIs & prototype for testing
‍

‍
USABILITY TESTING
Address issues and refine UI & interaction design to enhance immersion
Here is an example of how the interactive page on mobile during the concert was iterated.
‍
‍
‍
DESIGN SYSTEM
Young, energetic, align with the colors of the concert
‍
FINAL DESIGN
Welcome to Escape!
Before the concert
Dress up your avatar before entering the concert
‍


‍
During the concert
Sing along with the singer, try to top the real-time leaderboard!

‍


‍
Voting Activity: vote for the next song you want to hear

‍
‍
AFTER THE concert
Keep the exciting moments in your memory box
‍
‍
‍
REFLECTION
Learnings
  • Collaborate with other designers using documentation, site maps, style guides, etc.
  • Rethink the possibilities of "the online version" - think out of the box to shape future experiences
  • Conduct usability testing with InVision
  • Domain knowledge on creating immersion
‍
Future Work
  • Validate technical feasibility with engineers - implement and test the interactive glow stick function if possible
  • Explore possible business models such as subscriptions, virtual currency, VIP fan services, etc.
‍
Let's create an impact together :D
ResumelinkedinEmail
© Yuki Liao 2022