A redesign of Twenty map annotation pop-up content-focused cards with integrated status and response interaction.
The objective of the card pop-up card was confusing, and our users were unclear on how to interact with our core functionality. We had to rethink and develop an improved experience to increase user retention, engagement, and quality and make the experience more fun and delightful.
The Twenty App's purpose was to enable and enrich the product by bringing people together in real life. The app helps people see if their friends are down for something and make it happen.
UI content structure concept with 5W 1H method
The problem with this app was that people didn't understand what it did or why they needed it. A few issues led to this confusion like the app was too complicated or didn't have the background knowledge to understand how the app worked or why they needed it. The app didn't explain itself well enough, and we assumed users would realize what it did base on our assumptions.
Brainstorm wireframe sketches
We thought it might be helpful to reconsider the card structure we have now. It doesn't quite communicate purpose or value as well as it could.
High-level interaction screens overview
We think having a more concise story on each user card will help provide more clarity. Coupled with tagging and new custom responses, we believe it will improve and increase our engagement. Our approach was to focus the user card to be a single piece of content presented as one cohesive story to the user and ensure we take advantage of familiar patterns from other social apps like Facebook, Instagram, and Twitter. We experimented with a few consumption layout structures.
We ultimately chose to provide the user with an answer to the following five questions:
(Who, What, Where, When) to interact with their friend's status.
High-level screen preview
User journey contextual map user card
After the refreshed design was released, our data team showed us user status updates after a few weeks, which helped us gain insight.