Clubhouse UX + UI redesign
Re-imagining audio-only chat app while preserving its brand
Role
UX Research
UX/UI Design
Prototyping
Animation
Tools
Figma
Adobe Photoshop
Miro
Oveview
Clubhouse is an audio-only chat app with cult-like following, where people can network, foster meaningful friendships, and build community by popping into virtual rooms by interests ranging from meditation practices to latest macroeconomic trends.
Problems
01. Limited User Control
Due to abundance of rooms, finding a suitable one is challenging.
People dislike not being able to sort what type of rooms they see in their hallways, depending solely on algorithms.
03. Lack of Interactivity
04. Unengaging UI
Design feels too static and dull, not representing the air of spontaneity, engagement, and flow of conversations in rooms.
People want to express and present themselves in a unique way.
.png)
Solutions
Improve discoverability of clubs and rooms suitable to people’s needs
Increase engagement by helping people interact with speakers
Personalize experience and integrate people with special needs
Organize hallway experience by introducing a filtering feature and topic badges for room previews. Freshen up card design to include pictures of friends to be easily scannable.
Let users curate their hallway suggestions, thus improving engagement and decreasing app abandonment rates.
Display clubs by interest categories to help users easily gain access to more content.
Introduce quick reactions in rooms.
Create an information sheet for rooms to help set the conversation agenda, tone, and share media.
Discover & Define
Heuristic Evaluation
Brand Research
Initially, Clubhouse was marketed as a secluded and exclusive audio chat app to top-tier influencers, celebrities, Silicon Valley investors, and industry thought leaders, but with a recent change in the app policies everybody can join without an invite from another member. Clubhouse finally opened its “doors” to the public. To understand the brand identity I researched the founders’ aspirations and intentions for the service.
"Our north star was to create something where you could close the app [...] feeling better than you did when you opened it, because you had deepened friendships, met new people, and learned."
— Paul Davison and Rohan Seth, Clubhouse Founders
Competitor Analysis
It was important for me to analyze the competitor landscape (including more of an adjacent service – Apple Podcasts) to identify what worked and what didn’t for these services as well as understanding what is currently expected in the industry. Following Clubhouse success, Twitter and Spotify implemented live audio chat features of their own. These strong competitors embody clarity and ease of navigation. They delight users with more control and features for non-audio communication. Though still, for the most part they provide basic, more utilitarian rather than engaging visual design.
Empathy Interviews
Conducting interviews with two major groups of users — “pros”, frequent members of the community, and novice users helped me discover unique paint points and needs these audiences had.
1. Confusing hallway experience and lack of curation control.
2. Unclear communication rules and workarounds.
People don’t like to interrupt speakers to react to what they say, but still want to feel included in conversations and share responses.
Thought leaders are doorway to content: most people like to follow industry/thought leaders to be exposed to more high-value conversations.
Organizing desk research and empathy interview findings with affinity mapping pointed out that each task flow had unique challenges.
Task Flows
Task 1: Find a room
Hallway
Improve suggestions
Filter by room
Join a room
Hallway
A filtering feature was introduced with room topic badges for easier scannability.
Room card design breaks visual monotony and includes profile pictures of up to eight speakers and three friends to help recognize people.
Task 2: Interact in a room
Room
Check room info
React to speakers
Room
Stage design expresses the air of spontaneity and improves speakers’ visibility
Emoji kit includes most common reactions people had to speakers according to my research, as well as the homage to the Bouquet emoji which is best-known and popular with the community of long-term Clubhouse members.
Task 3: Personalize profile
Visit a speaker's profile
Follow
Check personal profile settings
Speaker’s Profile
Influencers and industry leaders can get more exposure and followers through profile highlighting feature “Sound Waves”, making the app more inviting to professionals and mentors willing to give back to the community and grow their businesses.
Most popular reaction is shown on speaker’s profile to give an idea of the speaker’s vibe/tone.
Personal Settings
Clubs are broken into categories by interest to help people find and follow the ones they would be interested in.
Profiles can be personalized and liven up with color and animation to draw more visibility.
People have a choice whether they want to disclose what rooms they’re speaking in to non-subscribers in settings.
Takeaways
This project was a good challenge for me to explore how to approach a partial UI redesign and UX research with an intention of preserving the brand and solving broader scope problems.
With more time on my hands, I’d like to dedicate a larger portion of the discovery and definition stages to communicating with developers and learning about constraints, as well as being more in touch with the business side of the product to be aware of bigger goals the company wants to achieve.
In addition, I would conduct user testing workshops and use contextual inquiry to dig deep into what people need, want and look for in the app like Clubhouse.Besides that, working out a way to further minimize visual fatigue while reading long product information would be beneficial. Overall, this project was a great challenge for me to explore redesigning a brand’s web presence to be more vibrant and engaging.
.png)
.png)