UCLA RADIO • 2025

Show Archives

Project Detail

September 2025

January 2025 - Present

Team

Web Dev (UCLA RADIO)

ACM Design

Role

UX / UI Design

Web Dev

Tools

Figma

Figma

Project Detail

September 2025

January 2025

- Present

Team

Web Dev

(UCLA RADIO)

ACM Design

Role

UX / UI Designer

UX / UI Design

Tools

Figma

Notion

BACKGROUND

UCLA Radio is a student-run online radio station that emphasizes creative media development and student collaboration. Through radio programming, editorial content, event production, and multimedia storytelling, the organization fosters a creative community for students across all majors.

THE PROBLEM

The Gap Between Students

UCLA Radio's content lives almost entirely on YouTube, a platform not designed for the organization's unique needs. Poor playlist organization, limited DJ discoverability, and minimal opportunities for social interaction make it difficult for students to engage with content and participate in UCLA Radio's community.

THE OPPORTUNITY

An Opportunity to Go Out With a Bang

We focused on rebuilfing a first party website that would reimagine the student media creative experiences. Emphasizing archival shows and new discovery of shows.

💡

THE CHALLENGE

How might we help students easily discover content that matches their interests while encouraging deeper engagement with UCLA Radio?

INTRO

Design Process

1

Research

User Interviews

Usability Test

2

Synthesis

User Persona

3

Design

Userflow

Low Fidelity

4

Iteration

Userflow

Low Fidelity

5

Reflection

Userflow

Low Fidelity

1

Research

User Surveys

Usability Test

2

Synthesis

User Persona

3

Design

Low Fidelity

Mid Fidelity

4

Iteration

Design System

Low Fidelity

5

Reflection

Final Design

Key Insights

RESEARCH

Discovering What Drives Engagement

I started off with exploring student behaviors and content preferences, where I identified opportunities to improve discoverability and navigation.


By conducting user surveys, were were able to collect main pain points students faced.

Difficult content discovery

68% of students reported having trouble finding shows related to their interests.


Limited community engagement

74% of listeners wanted discover new DJs and creators.



74% of listeners wanted discover new DJs and creators.


Disorganized content library

61% of users said organizing content by years made it difficult to find previous shows from specific quarters.

SYNTHESIS

Identity to the Problem

I wanted to create a user persona to embody students user based my research process. By synthesizing the gathered data, I aim is to represent the user's preferences, pain points, and behaviors, allowing for a more focused and effective redesign for our ideal user.

Eliza Cruz, 18

“ First year student at UCLA”

Eliza has always been an active participant in extracurricular activities, especially in high school, where he was involved in coding clubs and STEM-related groups. He values community, collaboration, and learning outside the classroom. As a first-year student at UCLA, Eliza is eager to join clubs that align with his passion for technology and computer science but hasn’t yet found an easy way to navigate the wide variety of clubs available.

Frustrations

Overwhelmed with the various amount of clubs offered at UCLA.


Uncertain where or how to find the best STEM related clubs.

Emotional State

Confused

Overwhelmed

Excited

THE SOLUTION

Redesign Goals

By synthesizing user interviews and research insights, I found that students wanted a more organized way to discover shows, connect with DJs, and navigate content. These findings became the foundation for the redesign and informed the project's primary design goals.

🔍

Enhance Discoverability

Make it easy for students to find relevant shows, DJs, and genres.

🤝

Build Community

Encourage interaction and strengthen connections between listeners and creators.

Build Community

Create an intuitive experience that supports seamless browsing and listening.

IDEATION

Low Fidelity/Mid Fidelity

After conceptualizing a design direction, I began crafting mid-fidelity wireframes to visualize my intentions for the redesign. This primarily focused on the onboarding process and several other key features I aimed to incorporate.

ITERATION

Design System

To expand on UCLA Radio's identity, I examined their current style guide, and build on the typography, color, and imagery. This enables me to make usability changes while maintaining UCLA Radio's aesthetic.

DESIGN

Final Design Highlights

Explore Page

Following our mid-fidelity wireframes, we refined interactions, visual hierarchy, and branding elements to deliver our final high-fidelity designs.

01 Explore Page

DJ Discovery

Following our mid-fidelity wireframes, we refined interactions, visual hierarchy, and branding elements to deliver our final high-fidelity designs.

02 DJ Discovery

Program Schedule

Following our mid-fidelity wireframes, we refined interactions, visual hierarchy, and branding elements to deliver our final high-fidelity designs.

03 Program Schedule

REFLECTION

Key Insights

1

Don't be afraid to advocate for human centered design

While working with a team of creative developers, I noticed that they wanted to rebuild the website using only code without considering the necessary research, human touch, or unique identity of UCLA Radio. This experience taught me the importance of advocating for human-centered design and emphasizing the value of user experience research.

2

Create Accountability Within the Team

Without a designated lead to guide decisions, assign responsibilities, and follow up on progress, discussions often failed to turn into action. This taught me the importance of establishing clear ownership, expectations, and deadlines at the beginning of a project.

LETS MAKE A CONNECTION 🥳

RESUME

LINKEDIN

INSTAGRAM