Phased Redesign for a Seamless Mobile Meeting Experience
Intro
Developed Gather Town's mobile app from scratch, creating a seamless meeting experience that keeps users effortlessly connected on the go.
Background and Timeline
Given the project's complexity, we adopted a phased approach to native app development, rolling out a Beta Prototype, Essential V1.0, and Advanced V2.0.
Over three months, I worked with PM Justin to refine the PRD and enhance meeting and A/V capabilities, continuously integrating internal feedback and finalizing V1.0. However, technical issues later delayed the launch by six months, allowing us to add more features.
Justin's strategic planning streamlined our workflow, and Laura's guidance ensured quality. Though I left before the launch, I'm deeply proud of the team's success.
Over three months, I worked with PM Justin to refine the PRD and enhance meeting and A/V capabilities, continuously integrating internal feedback and finalizing V1.0. However, technical issues later delayed the launch by six months, allowing us to add more features.
Justin's strategic planning streamlined our workflow, and Laura's guidance ensured quality. Though I left before the launch, I'm deeply proud of the team's success.
Timelime
Project Kickoff: Oct 2022
Wireframe: Nov 2022
Development & Visual Design: Dec 2022
Prototype Testing & Feedback: Dec 2022 - Jan 2023
UX Finetuning & V1.0 Completion: Feb 2023
V1.0 Beta Testing(Invite-only): Mar 2023
Launch Plan Pending: Post-Mar 2023
Design & Scope Enhancement: Ongoing Post-Mar 2023
V1.0 Release: Aug 2023
Wireframe: Nov 2022
Development & Visual Design: Dec 2022
Prototype Testing & Feedback: Dec 2022 - Jan 2023
UX Finetuning & V1.0 Completion: Feb 2023
V1.0 Beta Testing(Invite-only): Mar 2023
Launch Plan Pending: Post-Mar 2023
Design & Scope Enhancement: Ongoing Post-Mar 2023
V1.0 Release: Aug 2023
Team
Product/Interaction Designer: ShaoPing Chen
PM: Justin
Engineer: Donald, Karen, and team
Design Supervision: Laura and design team
PM: Justin
Engineer: Donald, Karen, and team
Design Supervision: Laura and design team
User Demand and Goals
Gather Town was initially desktop-only and too complex for mobile-responsive design. Recognizing the need for a mobile-friendly experience, we developed one that addresses mobile web limitations and ensures smooth transitions between desktop and mobile meetings, thereby enhancing the product’s appeal, retention, and longevity.
Previous mobile web version.
Mobile Experience Challenges
Limited Functionality
Previous browser-based mobile experience lacks essential features.
Poor Usability
Difficulties interacting with participants and joining meetings.
Performance Issues
Frequent bugs and stability concerns undermine user experience and trust.
Customer Demand
User feedback reveals a need for improved mobile meeting experiences.
Industry Standard
Competitors offer advanced mobile apps, setting a high benchmark.
Strategic Imperative
Enabling flexible and spontaneous remote communication.
Short-Term Trade-offs and Long-Term Vision
🎯 V1.0 Scope and Priorities
This initial version prioritizes easy meeting creation and participation to ensure a stable, seamless, and efficient mobile meeting experience, foregoing more complex features like avatar and map interactions.
🏁 Post-V2.0 Strategic Vision
The goal is to reflect Gather's aesthetics and interactive features, such as map navigation and avatar interaction, effectively bridging the physical and virtual worlds like a metaverse. Exploring experimental features that could enhance engagement beyond traditional desk-bound interactions.
Design Process
Competitor Research
I analyzed user flows from competitors like Zoom, Google Meet, and Around, assessing the strengths and weaknesses of their interaction designs.
Aesthetic Inspiration Exploration
With the original Gather Town style developed hastily with minimal effort, the design team considered rebranding during the mobile app launch. I then explored various visual directions for the possible new branding.
Functional Map for MVP
I created a functional map outlining essential features for our early version, ensuring comprehensive coverage.
Wireframe for MVP
I crafted wireframes for the MVP, covering login processes, meeting join points, rooms, and creation flows to facilitate efficient team communication.
Visual Style Refinement
I tested various styles with design team, adjusting color contrasts, layouts, and text-image ratios to create multiple page variants and gather team feedback.
Low & High Fidelity Prototypes
I made prototypes at different stages, using company-wide reviews to collect feedback and align product expectations.
Core User Journeys of Ver 1.2
1. Onboarding & Sign in
Splash, welcome and sign-in flow.
2. Space Selection
Select previously used spaces or directly join meetings.
3. Home screen & Calendar
Link your calendar and view meeting details
4. Joining Meetings
Join meetings via calendar or link, with audio/video settings.
5. Meeting Room Controls
Control meeting room access and allow participants.
6. Video Views/Grids
Different meeting layouts: grid, speaker, full screen.
7. Meeting Tools
Interactive tools such as emojis, raise hand, and chat.
8. Creating Meetings
Create instant or scheduled meetings.
9. Participant List
Wave to online users or start instant meetings.
Takeaway
Proactive Feedback Loop
Actively gathering feedback from stakeholders at each step helps prevent disruptive late-stage suggestions or unforeseen changes. Achieving consensus among teammates, developers, and leadership early on can ensure a smoother, more predictable timeline and minimize the need for last-minute revisions.
Incremental Progress, Not Perfection
Complex products require thoughtful migration, not direct porting. Strategic planning for iterative versions fosters steady, measured progress towards long-term goals, avoiding the risks of ambitious, all-encompassing initial releases. An incremental mindset empowers agile teams to consistently improve while maintaining a clear vision.