Communities
Hello Pal is a live streaming app that incorporates social media features to connect users globally. As of October 2020, the platform has more than 20,000 daily active streamers and viewers, with a total of 6.7 million registered users from over 100 countries.
Overview
I led the design of "Communities", a new feature allowing users to discover shared interests and move from private messaging to vibrant, open discussions.
As the UI Designer at Hello Pal, I joined the project during the Design Process stage, following our design brief. My aim was to improve the user interface and enhance the overall experience based on our findings. The project timeline was set for 2 weeks, from May to June 2023.
Year
2023
My Role
Lead UI Designer
Frontend Developer
Tools
Figma, Zeplin, Leonardo AI, Illustration
Problem
Breaking the Wall
Our deep dive into platforms like Reddit and Douban revealed a stark reality: Hello Pal's existing structure was a barrier, not a bridge. It limited users to passive viewing rather than active connection.
Community Page in Hello Pal app
Research Findings
Through interviews, we identified these core pain points:
Discovery Friction
Users struggled to find groups relevant to their specific interests.
Engagement Gaps
Beyond live streams and Moment feeds, there were few options to encourage ongoing conversation.
Passive Consumption
The platform lacked tools to turn passive viewers into active content creators.
Solution
A Digital Park
We envisioned Communities as a “digital park”, a welcoming space for individuals to gather and share stories. Our solution focused on five strategic pillars.
Easy Discovery
Interest-based matching to help users find their "tribe" in seconds.
Seamless Integration
Placing the feature directly in the bottom navigation bar for instant access.
Empowered Ownership
Tools for users to create their own groups with custom names, languages, and tags.
Interaction Prompts
Real-time sharing and discussion tools to reduce isolation.
Global Accessibility
A multi-language interface supporting English, Mandarin, Vietnamese, and Arabic.
Process
From Isolation to Interaction
With the project brief in hand and a solid grasp of our goals, I designed Communities to seamlessly integrate into the Hello Pal ecosystem, enhancing user experience while maintaining visual consistency with the existing UI.
User Flow & Wireframing
Defining the path from the home screen to posting.
Communities - User Flow
Communities - Wireframes
Navigation Design
Integrating the "Communities Home" into the existing UI to ensure it didn't feel out of place.
Updated Bottom Navigation & Communities Home Screen
Creation Suite
Designing a setup process where users could upload covers and define their group's identity.
Setup Community Screens
Tiered Interfaces
Creating distinct views for viewers, owners, and members to facilitate better management and engagement.
Variations of Community Pages
Visual Language
Using SF Pro Text for readability and Exo for hero banners, while introducing a new color palette as users delved deeper into the feature. With this foundation, I created assets, buttons, and essential graphics and illustrations.
Technical Handoff
Uploading detailed specs to Zeplin and developing an in-app webpage using the WeUI framework for easier future updates.
Iteration
Feedback to Excellence
After presenting the initial designs to stakeholders, we refined the experience based on usability feedback:
Visual Unity
We unified the Community Page by adopting colors from the Instructional Page to create a more cohesive feel.
UI Tweaks
The top section background for Community Page was updated for better contrast, and navigation icons were resized for consistency.
Functional Clarity
We added additional app screens to clarify complex processes, such as multi-community posting.
Updated Community Page & Additional Screens
Outcome & Impact
A Rejuvenated Ecosystem
The feature launched in late 2023 and quickly became a primary driver of social activity.
Boosted Community Engagement
Significantly increased the daily time users spend in social areas by optimizing the layout and visibility of group spaces.
Improved First-Time User Experience
Effectively reduced new-user drop-off rates by introducing a more intuitive group-matching system that quickly connects users with relevant communities.
Key Learning
By shifting the focus from private messaging to shared community spaces, we didn't just add a feature; we revitalized the app's social core.
Communities - Full Product Spread
