Designing Twenty’s Hangout experience
Overview
I led design work on Twenty’s Hangout experience and helped establish a design system. The work focused on making availability, privacy, and planning clearer while giving the team reusable patterns.
Client
The Twenty App aims to bring people together in real life. The app lets users see if their friends are available and interested in hanging out.
A few screens from our team brainstorming sessions
Problem
People had trouble seeing who was available and making plans without committing too early. Research pointed to three needs: control over visibility, a clearer availability signal, and flexibility while arranging a Hangout. Those findings shaped the flow and privacy decisions.
Silent overview of Twenty Hangout flows and interface screens.
User experience flow overview
Initial Design system components and atoms development
User Experience Flow
Hangout experience journey stages:
- Sender creation (customization and expression)
- Time and date picker
- Location search
- Invite Friends
- Post creation
- Recipient flow
- Messaging
- Map annotation
Color themes specifications for engineering
Solution
We compared multiple flows in wireframes and prototypes. We treated active map pins as an early engagement signal, then refined the creation flow, messaging, and map interactions with feedback from product and engineering.
Project contribution
- Led early feature experiments
- Served as lead designer for the project
- Developed strategy and followed up with leadership
- Prepared user testing and prototypes
- Collaborated with user research teams
- Established the Design System
- Developed map annotations, group interactions, and privacy settings
- Built a messaging UI Kit
- Supported Android and web landing pages
Silent Twenty phone prototype showing the flow for creating a Hangout plan.
Hangout experience rapid prototype
Result
In testing with a small group of long-term users, participants valued the added flexibility and control. After implementation, the team observed a 23% increase in user engagement.