The goal was to redesign the core app feature to better align with user needs and values. This involved enhancing clarity, increasing user engagement, and improving the “hangout” experience. Additionally, we created a design system to streamline development.
Key question: How can we provide a cohesive, streamlined experience that adds value and clarity for our users?
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
Our users found it challenging to know who was free and willing to hang out, leading to declining engagement. We needed a solution that allowed users to quickly and flexibly arrange hangouts without requiring firm commitments. Through user research, we learned that users wanted greater control over their visibility to friends, a clearer way to indicate availability, and flexibility around meeting plans. This insight guided us to design a solution that met these needs, though we were uncertain how well it would perform initially.
User experience flow overview
Initial Design system components and atoms development
User Experience Flow
Hangout experience journey stages:
Color themes specifications for engineering
We gathered insights on user preferences and brainstormed multiple approaches, using wireframes to visualize solutions. Our initial success metrics included creating active pins on the map—an indicator of user engagement. We refined the solution with continuous feedback from product and engineering teams.
Project contribution
Hangout experience rapid prototype
The new experience allowed users to see friends on the map and easily organize hangouts, bringing back users who had drifted away. A small group of long-term users tested the new feature and appreciated the customization options and added flexibility. After implementation, we observed a 23% increase in user engagement.
Suggestions for Improvement
1. Make Goals and Success Metrics Clearer: Define the exact success metrics earlier in the case study, like engagement increase, user satisfaction ratings, or pin creation rate.
2. Strengthen User Insights Section: Expand on specific user research findings to give readers a deeper understanding of the users’ needs and challenges.
3. Add Visual Aids or Screenshots: Including wireframes, a user journey map, or snippets from brainstorming sessions could break up the text and make it visually engaging.
4 Highlight Key Changes and Impact: Be more explicit about what was different before and after the redesign. This could clarify the impact of the changes and why they were effective.
5. Summarize Outcomes with Data: The result mentions a 23% increase in engagement; you could elaborate on other qualitative feedback or retention metrics to provide a fuller picture.
This refined version is focused, concise, and guides the reader through the problem, process, and impact of the redesign, making it more effective for potential clients or stakeholders.