NINA YU

Get In Touch

NINA YU

Get In Touch

NINA YU

Mobile App Design

Music Hive

Connecting music fans through virtual concert experiences

Duration

8 weeks

Team

Tracy Vu, Michelle Chen, Tina Nguyen, Yuxing Liu

Tools

Figma, Adobe After Effects, various platforms for live prototyping

My Role

Prototyping Lead - conceptualization, user research & analysis, usability testing, competitor analysis, wireframing, live prototyping, branding (logo, design system), lo-fi & hi-fi design

Challenge

Concerts are deeply social experiences, yet digital alternatives fall short. Platforms like Twitch and YouTube provide livestreams but are not designed around concerts, while concert-focused apps like Songkick or Ticketmaster lack livestreaming altogether. Fans end up either passively watching or only discovering shows but never experiencing the energy of being part of a live crowd.

oPportunity

Build a platform that merges concert livestreaming with community-building features, creating a social, immersive, and continuous fan experience before, during, and after concerts.

Mobile App Design

Music Hive

Connecting music fans through virtual concert experiences

Duration

8 weeks

Team

Tracy Vu, Michelle Chen, Tina Nguyen, Yuxing Liu

Tools

Figma, Adobe After Effects, various platforms for live prototyping

My Role

Prototyping Lead - conceptualization, user research & analysis, usability testing, competitor analysis, wireframing, live prototyping, branding (logo, design system), lo-fi & hi-fi design

Challenge

Concerts are deeply social experiences, yet digital alternatives fall short. Platforms like Twitch and YouTube provide livestreams but are not designed around concerts, while concert-focused apps like Songkick or Ticketmaster lack livestreaming altogether. Fans end up either passively watching or only discovering shows but never experiencing the energy of being part of a live crowd.

oPportunity

Build a platform that merges concert livestreaming with community-building features, creating a social, immersive, and continuous fan experience before, during, and after concerts.

Mobile App Design

Music Hive

Connecting music fans through virtual concert experiences

Duration

8 weeks

Team

Tracy Vu, Michelle Chen, Tina Nguyen, Yuxing Liu

Tools

Figma, Adobe After Effects, various platforms for live prototyping

My Role

Prototyping Lead - conceptualization, user research & analysis, usability testing, competitor analysis, wireframing, live prototyping, branding (logo, design system), lo-fi & hi-fi design

Challenge

Concerts are deeply social experiences, yet digital alternatives fall short. Platforms like Twitch and YouTube provide livestreams but are not designed around concerts, while concert-focused apps like Songkick or Ticketmaster lack livestreaming altogether. Fans end up either passively watching or only discovering shows but never experiencing the energy of being part of a live crowd.

oPportunity

Build a platform that merges concert livestreaming with community-building features, creating a social, immersive, and continuous fan experience before, during, and after concerts.

Mobile App Design

Music Hive

Connecting music fans through virtual concert experiences

Duration

8 weeks

Team

Tracy Vu, Michelle Chen, Tina Nguyen, Yuxing Liu

Tools

Figma, Adobe After Effects, various platforms for live prototyping

My Role

Prototyping Lead - conceptualization, user research & analysis, usability testing, competitor analysis, wireframing, live prototyping, branding (logo, design system), lo-fi & hi-fi design

Challenge

Concerts are deeply social experiences, yet digital alternatives fall short. Platforms like Twitch and YouTube provide livestreams but are not designed around concerts, while concert-focused apps like Songkick or Ticketmaster lack livestreaming altogether. Fans end up either passively watching or only discovering shows but never experiencing the energy of being part of a live crowd.

oPportunity

Build a platform that merges concert livestreaming with community-building features, creating a social, immersive, and continuous fan experience before, during, and after concerts.

Try The Prototype
Try The Prototype

Background

Music Hive is a mobile-first platform designed to make digital concerts interactive and social.


Key features:

  • Pre-concert: Servers and chatrooms for fans to connect before shows.

  • During concerts: Livestreams from multiple perspectives, chosen by fans via a seat map.

  • Post-concert: Shared photos and videos form a hub of memories.

  • Community identity: Profiles and badges build long-term fan engagement.

  • Branding: Inspired by stage lighting and energy.

Stage 1: Research

To explore this opportunity further, I conducted research to understand how fans currently experience concerts digitally, what keeps them engaged, and where existing platforms fall short.

Literature review

  • Concert enjoyment is tied to social connection and interaction (O’Neill, 2022).

  • Gen Z values accessibility but craves immersive, interactive features in digital concerts (Lv et al., Rattanadilok et al., 2022).

  • Real-time interaction and emotional cues (emojis, reactions) strengthen engagement and loyalty.


To better understand the effects and benefits of certain features, I conducted research on recent literature on livestreaming features.

(Lv et al., 2022)

Competitive analysis

We found that current apps on the market usually fall into one of two categories:

  1. Livestream Platforms

Live interaction features

Community building

Not genre specific

  1. Concert Organizers

Concert Specfic

Focused on ticket sales / organizing live events

Little or no focus on social interactions between users

Twitch & Youtube

Strong for streaming, but overwhelming chats and no event-focused design.

Twitch & Youtube

Strong for streaming, but overwhelming chats and no event-focused design.

Twitch & Youtube

Strong for streaming, but overwhelming chats and no event-focused design.

Qello

Offers archived concerts, but limited in content and community.

Qello

Offers archived concerts, but limited in content and community.

Qello

Offers archived concerts, but limited in content and community.

Ticketmaster & StubHub

Ticket discovery only, no engagement layer.

Ticketmaster & StubHub

Ticket discovery only, no engagement layer.

Ticketmaster & StubHub

Ticket discovery only, no engagement layer.

user Research

User Research survey

I conducted an online survey gathering 30 responses (96.7% between ages 18-34) to understand the following questions:


  1. How do people currently connect with others before, during, and after concerts?


  1. What are the primary barriers that prevent people from attending live concerts?


  1. What platforms do people use to engage with others for concert experience?

Top Attendance Drivers:

80%

Ticket Price

80%

Ticket Price

80%

Ticket Price

73%

Artist

73%

Artist

73%

Artist

73%

Venue/location

73%

Venue/location

73%

Venue/location

47%

friends

47%

friends

47%

friends

Pre-event:

60%

Participants check who else is attending via friends or social media

60%

think that connecting with other attendees before the event is somehow important

“I think it’s nice to find people who are interested in the same music taste”

“I think it’s nice to find people who are interested in the same music taste”

“I think it’s nice to find people who are interested in the same music taste”

“figuring out who is sitting in my section, afraid of being lonely during concert experience”

“figuring out who is sitting in my section, afraid of being lonely during concert experience”

“figuring out who is sitting in my section, afraid of being lonely during concert experience”

Streaming Interest

33%

watch livestreams if they couldn't attend

Top Motivators: Convenience and lower cost

Post-Event Sharing

60%

share photos/videos online

Desired Features:

87%

Concert Discovery

87%

Concert Discovery

87%

Concert Discovery

70%

Post-Event Sharing

70%

Post-Event Sharing

70%

Post-Event Sharing

67%

Live Streaming

67%

Live Streaming

67%

Live Streaming

50%

Real-Time Interaction

50%

Real-Time Interaction

50%

Real-Time Interaction

Key takeaways

Major User Pain Points in Concert Attendance

  1. People who don’t have tickets or can’t physically make it to the concert want to attend and be involved with the concert

  2. People usually need to search for concert livestreams on other platforms manually which is inefficient

  3. People desire to connect with others who have the same music taste during pre and post concert events


The survey results reveal a strong interest among concert-goers in features that enhance both live and remote experiences.


While live attendance is preferred, many are open to live-streaming options when barriers like cost, location, or health concerns arise. There is demand for high-quality, interactive live-streams that replicate the excitement of live events and foster community.


A platform combining concert discovery, streaming, and social features could appeal to fans by offering a convenient, affordable, and engaging alternative to in-person attendance.


Problem Statement

How might we create an end-to-end digital concert experience to facilitate social interactions between concert-goers before, during, and after a concert?

Stage 2: Prototype

Feature rationale

Home (Events)

Live Details

Posts

Messages

Based on research, I mapped features to the entire concert journey:

  • Before concerts: Servers and chatrooms build community around shared music tastes.

  • During concerts: In-person fans livestream for remote audiences, who can view from multiple perspectives.

  • After concerts: Fans share media, creating a central hub of memories to relive and extend the event.

prototype (round 1)

Example Prototyping Slides

Instead of UI-first testing, we focused on experience prototyping. I led two live roleplay sessions (25 minutes each) with 200+ students and faculty, using Google Sheets, Padlet, and Zoom to simulate Music Hive’s features:

Before

Participants browsed a Google Spreadsheet of upcoming concerts, joined a community via Padlet, and shared their excitement by answering prompts like "What song are you most looking forward to?"

Example Prototyping Slides

During

Simulated livestreams on Zoom featured multiple angles of a performance. Participants engaged through live comments, polls, and reactions.

Live Prototyping Session

After

Participants shared clips and screenshots on Padlet and engaged with others’ posts. The most engaging post was awarded a prize, showcasing gamification features like badges and rewards.

Live Prototyping Session(left), Padlet (right)

Stage 3: Iterate

Round 1 findings

Feedback Survey

I conducted a feedback survey on the prototyping experience. Out of 32 responses, it received an average rating of 4.25/5, with 46.9% rating it 5/5.


Fans most enjoyed live chat, multiple angles, and post-concert sharing.

Painpoints

27%

(9/33) cited problems like lag and pixelation

9%

(3/33) expressed worries about the legality of streaming paid concerts.

12%

(4/33) found navigating between features or platforms challenging

Some participants noted it didn’t feel fully immersive and wanted to experience more of the livestreamer angle.

Round 2 improvements

What We Kept

  • Padlet for pre/post engagement → validated as effective for community-building.

  • Interactive photo/video sharing → matched user habits for post-concert sharing.

  • Acknowledged streaming limitations → technical constraints prevented immediate fixes, but noted as a future priority.

Subscription Plans

Zoom Livestream

Seating Map

What We Changed

  • Added subscription plans → addressed artist protection concerns.

  • Structured problem statements in presentations → clarified navigation, reducing confusion.

  • Introduced seating map for streamers → gave fans clearer control over views.

  • Invited roleplay as streamers → responded to feedback that users wanted to experience both the audience and performer/streamer perspectives, making the simulation more immersive.

Round 2 Feedback

Despite these improvements, the second prototype scored lower overall (avg. 3.7/5). Participants still valued the interactive features, multiple perspectives, and sense of community, but struggled with complexity of navigation, forced features (streamer interactions), and friction in navigation/quality.

Most Liked

Least Liked

Key Learning

  • Not all user feedback should be implemented verbatim — it must be prioritized against clarity, feasibility, and vision.

  • Prototyping across multiple platforms (Zoom, Padlet, Sheets) introduced navigation friction, but was a requirement to highlight feature novelty. This constraint limited seamlessness but reinforced the challenge of designing under real-world limitations.

Branding

We designed Music Hive’s identity to feel immersive and energetic, echoing the excitement of live concerts.

  • Dark background with bright purples and gradients → evokes stage lighting and atmosphere.

  • Typography (Figtree) → modern and legible in high-energy contexts.

  • Logo (designed by me) → combines a music note with a livestream play symbol, representing both the heart of concerts and digital participation.

Stage 4: Future Directions

Current Limitations

  • Connectivity: Heavy reliance on livestreaming makes the platform vulnerable to Wi-Fi disruptions, which could cause buffering or delays.

  • Copyright: Proper licensing is required for concert streams and user-generated content to avoid legal issues.

Potential SOlutions

Connectivity

  • Adaptive Streaming: Adjust video quality based on real-time internet speed.

  • Local Data Centers: Use edge computing to reduce latency.

  • Pre-Event Speed Check: Provide a Wi-Fi speed test before the concert.


Copyright

  • Secure Licensing Agreements: Collaborate with artists and venues to ensure proper licensing.

  • Content Moderation System: Automate detection and blocking of unlicensed content.

  • Guidelines: Communicate copyright policies clearly to users.


Check Out My Other Work!

Because one project is never enough 👀

Tag 1

Feature title.

This is a feature description spanning a couple of lines.

Tag 1

Feature title.

This is a feature description spanning a couple of lines.

Tag 1

Feature title.

This is a feature description spanning a couple of lines.

Tag 1

Feature title.

This is a feature description spanning a couple of lines.

Tag 1

Feature title.

This is a feature description spanning a couple of lines.

Tag 1

Feature title.

This is a feature description spanning a couple of lines.

Tag 1

Feature title.

This is a feature description spanning a couple of lines.

Tag 1

Feature title.

This is a feature description spanning a couple of lines.