Billow

Product

Mobile App Interface Design

Team

Carol Li(Founder)

Jaying Yang(SWE)

Wayson Wei(SWE)

Sophia Xiao(PM)

Company

Billow

My Contribution

Product Design

User Research & Testing

Interactive Prototyping

Branding

My Role

Founding Product Designer

Overview

This is a 0 to 1, end to end Mobile design project ideating an event management platform for community users.

My primary contributions included
1. Influenced the shape of the enterprise product through research and data insights.
2. Executed design work with high-quality wireframes, mockups, and user journeys.
3. Developed interactive prototypes and led usability testing sessions.
4. Designed and maintained a comprehensive design system

Who is Billow

Billow is a vibrant social platform based in Seattle.

It’s community thrives on hosting and organizing a variety of events that brings people together.

Long term goal

Establish a community in Seattle focused on entertainment and leisure activities.

Slogan

Work Hard, Play Harder

THe Problem

Finding Event or Participants is Hard

Billow has over a thousand customers who enjoy various events each week. However, there's a significant communication gap between hosts and participants.

Repeated actions for host

#1 Repeated Promoting

Hosts spend extra hours copy-and-pasting their promoting material for their event into different group.

#2 Repeated Invitation

Hosts have to manually send group chat invitation to different participant for coordination and communication purpose.

Missing information for participants

#1 Repeated info-filling

Participants repeatedly enter the same personal information for each event, adding unnecessary steps and lengthening the registration process.

#2 Missed Events

Participants tend to miss important invitations of the party they wish to go.
‍

450+

new registered users two months after launch

50%

increase in total events creatinon.

2 mins

reduction on time spent on registration.

A WeChat Mini-App that provides participants with up-to-date event info while automates the host invitation process

Feature One

Centralized Event Center

It’s community thrives on hosting and organizing a variety of events that brings people together.

My Solution

Impacts after launch

Feature Two

In App Event Sharing

It’s community thrives on hosting and organizing a variety of events that brings people together.

Smooth Event Creation.

It’s community thrives on hosting and organizing a variety of events that brings people together.

Key Challenge

Which is the best solution?

My take: WeChat Mini Program

Billow is a small pre-seed startup with limited resources and tight project deadlines. As a product designer under this pressure, my primary responsibility is to select a platform that maximizes user experience while ensuring timely product delivery.

Option 1

Host on Website

Option 2

Build Mobile App

Option 3

WeChat Mini App

Option 4

Hire add-hoc admins

Three Reasons Mini-App Is Ideal

While my team favored the website, I advocated for the WeChat Mini-app as the best UX solution for three key reasons.

Design Process

Design Through Iterations, Make It Sharp

Information Architecture

I have created a well-structured information hierarchy, along with both low-fidelity and high-fidelity prototypes, to guide the design process.

Mid-fi & Testing

Based on the user flow and info architecture, I sketched the low-fi prototype for concept validation and tested the user flow with 7 stakeholders.

Mid-Fi Wireframe Prototype

Hi-Fi Prototype

I have created a well-structured information hierarchy, along with both low-fidelity and high-fidelity prototypes, to guide the design process. Based on the user flow and info architecture, I sketched the low-fi prototype for concept validation and tested the user flow with 7 stakeholders.

Final Wireframe Prototype

Design Technique

How did I Piggybacking WeChat Ecosystem to
‍optimize event registration flow

Automatic Info Fetching,
Preventing Manual Input.

Mini-App can pre-fill forms, personalize content, and streamline account-related actions without requiring repetitive data entry. This functionality not only reduces the risk of human error but also saves users valuable time, preventing the frustration that can arise from typing in redundant information.

Mini-App streamlines communication process.

Users can interact with the Mini-App directly within WeChat, which allows for real-time messaging, notifications, and updates in a single interface. This integration reduces friction and ensures that users remain engaged without the distraction of external links or third-party logins.

Branding

A Systematic, Replicable Approach

Create Mood board

My team and I hosted a workshop where we collaboratively created a moodboard to capture the essence of the Billow app. This final moodboard became the foundation for Billow's branding style.

Vote for Branding

Once we are satisfied with the mood board, I went up creating three main color palette and let the team member as well as 5 community members to vote the one that they like the most.

Curate Color Palette

After we chose our primary color, I curated it using a color palette tool to ensure consistency, rather than relying on visual estimates.

Final Color Palette

With that, we developed the final color system. The guideline below details all 90 shades and their corresponding accessible text color values. I also included accessible text colors on a white background for reference.

LEARning & Reflection

Scrum Increased Flexibility and Adaptability

Scrum's iterative approach allows teams to adjust priorities and project goals as new information or changes arise, ensuring that the product evolves based on feedback and market needs.

Be Mentally Prepared for Potential Changes.

New WeChat Oversea Usage Policy restricted usage for gathering purpose, which sabotaged our app. But our team quickly switched to another online platform, Wix, and continue the service while building branding for broader marketing purpose

Lower Complexity

Low Resource Consumption

Built-In Marketing and Distribution: