Web and Mobile Design
A web platform that allows students to anonymously discover, rate, and review clubs and organizations at UCLA.
Web & Mobile Design
UI/UX Design
UX Research
OVERVIEW
ClubHouse is a web platform that allows students to anonymously discover, rate, and review clubs and organizations at UCLA. Every student needs a little help finding their community and ClubHouse intends to make that process more accessible and efficient!
Through enhanced filters, detailed club profiles, and candid peer reviews, ClubHouse empowers students to explore organizations that align with their interests, values, and schedules.
ROLE
Web Design
Mobile Design
UI Design
Interaction Design
TEAM
4 project leads
3 designers
4 developers
3 marketers
TIMELINE
Los Angeles, CA
Apr. 2025 - Jun. 2025
PROBLEM
The idea for ClubHouse was born out of a shared frustration my team and I experienced as UCLA students:
Despite the campus offering hundreds of clubs and organizations, there was no centralized, up-to-date directory or reliable way to learn about them. We often found ourselves unsure of which clubs to join, what each organization actually did, or whether they would be a good use of our time. Word of mouth and scattered social media posts weren’t enough to make confident decisions.
SOLUTION
A platform where every Bruin can find a home.
Instead of digging through outdated websites or relying on word-of-mouth, ClubHouse allows students to easily explore UCLA’s clubs through rich profiles featuring, detailed descriptions, categories, and quality peer reviews. With comprehensive filters and descriptive tags, ClubHouse helps students cut through the noise and find the communities that truly align with their interests, values, and time.
Effortless Discovery
Browse clubs by interest with smart filters to instantly find organizations that match your passions
Features That Guide You
From customizable filters to anonymous ratings and peer reviews, ClubHouse equips students with the tools they need to make confident, informed decisions about which clubs to join.
Time Commitment
3.4/5
Low
High
Diversity
3.4/5
Low
High
Social Community
3.4/5
Low
High
Competitiveness
3.4/5
Low
High
Student-Powered Ratings
Each club is evaluated across four core pillars—inclusivity, social community, time commitment, and competitiveness—offering a clear, honest snapshot of what it's like to be a member.
01. DISCOVER
How do users feel about current club discovery resources?
RESEARCH
In order to better understand how students currently discover clubs and how they feel about existing resources, we conducted six user interviews with UCLA undergraduates from diverse backgrounds.
We asked students about their past experiences joining organizations, how they found out about them, and what influenced their decision to join or not join a club.
KEY FINDINGS
1.
Overwhelmed by Options
Students often feel lost when trying to navigate UCLA’s vast club ecosystem, unsure where to begin or how to narrow down their choices.
2.
Lack of a Centralized Hub
Most students rely on informal sources like word-of-mouth, Instagram, or club fairs—methods that are inconsistent and don’t always offer enough information to make informed decisions. Students expressed a clear desire for a single, organized platform where they could browse and compare all clubs in one place, with accurate and up-to-date info.
3.
Need for Transparent Ratings
Students want upfront, honest insights into what being in a club is actually like, especially around time commitment, social atmosphere, and competitiveness, so they can make more informed, confident decisions.
ROOT CAUSE ANALYSIS
We used a Root Cause Analysis diagram to uncover why students struggled to find clubs, experienced frustrations, and chose to leave reviews. The analysis revealed that the primary underlying reasons were students’ desire to secure jobs, build strong friendships and support networks, and ensure that other UCLA students have a positive club experience
USER PERSONAS
To better understand the diverse needs and motivations of UCLA students using ClubHouse, we created user personas based on interviews, surveys, and insights from our root cause analysis. These personas represent typical users, capturing their goals, frustrations, and motivations when finding clubs and navigating campus communities.
MVP SCOPE
Based on our research insights, root cause analysis, and user personas, we defined the MVP scope to focus on the core features that solve the most critical student pain points.
Verified Login
Ensures only UCLA students can sign up using their official UCLA email, maintaining a trusted community.
Intuitive Interface
Simplifies club discovery with category filters and easy navigation to detailed club pages.
Detailed Transparency
Provides visibility into each club’s description, recruitment process, and student reviews.
Quality Assurance
Reviews undergo a verification process before being published, ensuring content is safe, accurate, and reliable.
02. IDEATE
Rethinking how students find and connect with campus communities.
SKETCH
During the sketching phase, we focused on exploring how to visually communicate our core rating pillars—inclusivity, social community, time commitment, and competitiveness—in a way that felt intuitive and aligned with our brand identity.
We also experimented with layouts for key pages like the discovery feed and individual club profiles. Throughout this process, we iterated on sorting and filtering options to ensure that students could quickly and easily find the clubs that best fit their needs.
03. PROTOTYPE
Bringing ideas to life
LO-FI
We began with low-fidelity wireframes to visualize core user flows and determine which layouts best suit ClubHouse’s features.
EARLY ITERATIONS
Through multiple iterations, we explored different layouts to determine the format that best supported ClubHouse’s goals! Although they were lengthy and time consuming, these early experiments helped us refine the foundation before moving into high-fidelity design.
BEFORE
AFTER
BEFORE
AFTER
We updated the landing page layout from left-aligned to center-aligned to create a more balanced and visually engaging first impression. To enhance the aesthetic and make interactions feel more playful and inviting, we also redesigned the category bubbles, making them rounder and more visually prominent.
VISUAL IDENTITY
Establishing the visual identity of ClubHouse was an iterative process that involved extensive experimentation, feedback, and collaboration. We explored various color palettes, typography styles, and UI elements.
Below features a few of our many color and formatting iterations. Our team spent endless meetings exploring diverse palettes, typography, and layout styles to find a visual identity that feels vibrant, approachable, and unique!
After many rounds of experimentation and deliberation, we landed on a fun, lighthearted color palette featuring various shades of blue, complemented by pops of green, yellow, and pink to add warmth, energy, and personality to the overall experience!
Light blue
HEX: F7FCFF
Search by category / sort by / category overlay tags
Sky blue
HEX: DCE8FF
Club profile tags / remove tag
Accent Blue
HEX: 5086E1
Leave a review button / selected tag
Light green
HEX: B1D49D
Card drop shadow / club ratings / rating sliders
Yellow
HEX: F6E18C
Rating star / logo star
Pink
HEX: FFA1CD
Sign in button
DESIGN SYSTEM
We chose DM Sans for its clean, modern feel and built a simple system of cards, buttons, and text boxes to prioritize usability. Pops of color and playful accents add personality while keeping the interface clear, consistent, and student-friendly.
We adapted our design system for mobile by prioritizing responsive layouts, touch-friendly components, and clear hierarchy, ensuring a smooth, intuitive experience across all screen sizes.
04. FINAL SOLUTION
ClubHouse is live at clubhouseucla.com!
Browse Club Categories
For students unfamiliar with UCLA’s wide range of clubs and organizations, the category browsing feature offers an easy way to get started. Users can explore clubs by interest tags or simply type keywords into the search bar.
Discover Clubs
Students can easily search for clubs of interest using the search bar and sort results by highest rated, most reviewed, or A–Z.
View Club Profiles
Students can click into individual clubs to access detailed profiles, including descriptions, overall satisfaction ratings, and peer reviews.
Each club is rated across four key pillars: time commitment, inclusivity, social community, and competitiveness, giving students a clear, honest look into what being part of the club is really like.
Leave a Review
Students can share their experiences by leaving reviews for the clubs they’ve been part of. They input their membership start and end dates, rate the club across the four key pillars, provide an overall satisfaction score, and write a short review.
To maintain quality and trust, ClubHouse reviews each submission to ensure thoughtfulness and value to other students.
Verified Student Login
ClubHouse requires users to log in using their official UCLA student email. Verification is completed through the university’s two-factor authentication system, allowing only current students to leave reviews and access the full platform experience.
MOBILE DESIGN
05. LAUNCH PARTY
Celebrating the launch of ClubHouse!
To celebrate the launch of ClubHouse, we hosted a launch party featuring live music, pastries, a matcha stand, and an interactive product demo! Over 150 students attended, making it a night full of energy, community, and great feedback!
06. DEMO DAY
Sharing ClubHouse with all Bruins <3
At the end of the quarter, my team and I presented ClubHouse at our program’s Demo Day. We showcased our full design process, from initial research and ideation to prototyping and a live product demo, to an audience of 50+ peers, mentors, and fellow teams. We were the only team to have a successfully launched product, and it was a rewarding opportunity to share our journey, gather feedback, and celebrate the work we brought to life!
REFLECTION
Key takeaways from this project.
CHALLENGES
Stepping Up As Design Lead
As the most experienced designer on the team, I quickly realized it was up to me to bring structure to our design process. Many of my teammates were new to key tools and design principles. At first, I felt frustrated having to take on a teaching role while managing the overall design quality. But over time, I embraced the responsibility, guiding the team through best practices in spacing, typography, and layout.
Unclear Visual Direction
Initially, we had a dedicated graphic/visual designer who was responsible for defining the brand identity, selecting colors, and creating illustrations for ClubHouse. However, due to unforeseen circumstances, they were unable to fulfill their responsibilities, leaving the visual direction in the hands of the UI/UX designers. This was a challenge, as none of us had extensive experience in visual design. We spent long meetings experimenting with different visual directions and iterating through countless palettes. Though difficult, the process ultimately pushed us to grow and strengthened our ability to think beyond just function.
Tight Deadlines and Long Workshops
Since ClubHouse was a fast-paced, project, we faced tight deadlines from the start. Unlike most teams, we aimed to not only design the product but fully launch it by the end of the quarter. To stay on track, we worked intense 3–5 hour design workshops multiple times a week, which took a toll on both myself and the rest of the team. Balancing speed with quality was difficult, but these long sessions pushed us to collaborate efficiently, make fast decisions, and stay aligned under pressure.
WHAT I LEARNED
Leading With Empathy
One of the biggest takeaways from this experience was the importance of patience. While it was challenging at times, I realized how much a calm, supportive mentor can impact a team’s growth. Watching my teammates improve and seeing our final product come to life made the entire journey deeply rewarding and reminded me that leadership isn’t just about skill, but about empathy, encouragement, and trust.
Learning to Let Go of Perfection
With such a fast-paced timeline, I quickly learned that creating the “perfect” design wasn’t realistic. Instead, I had to focus on making smart, thoughtful decisions quickly, prioritizing progress over perfection. This mindset shift helped me become more decisive, collaborative, and adaptable under pressure.
Embracing Ambiguity
At many points in the project, there was no clear “right” answer, especially when it came to defining the visual identity or structuring key features like our four core pillars. This taught me how to navigate ambiguity with confidence, lean into experimentation, and trust the iterative process. Rather than waiting for clarity, I learned to help create it.