Sleeper
Reimagining Communication: Enhancing the message center experience using design thinking to strengthen social connections among sports fans
As a Product Designer at Sleeper, I focused on reimagining the Message Center to enable users to connect, chat, and engage around sports more intuitively and seamlessly. By redesigning this core feature, I aimed to amplify the social interactions that make Sleeper unique, fostering deeper connections among sports fans. This enhanced experience is designed to drive higher user engagement by strengthening the platform’s community-centric approach, a key differentiator in the fantasy sports market.
Role
Product Designer
Timeline
3 Weeks
Softwares
Figma
CONTEXT
What is Sleeper?
Sleeper is building the leading platform to connect friends over sports. Its mission is to create a digital playground where sports fans, whether casual or diehard can hang out, compete, and have fun.
On Sleeper, users can check scores, play seasonal fantasy sports, join daily fantasy contests, chat, send memes, and engage in interactive activities with friends. The platform offers games across football, basketball, and e-sports like League of Legends and opportunities to win cash by accurately predicting player stats for NBA, NFL, MLB, and NHL games.
What sets Sleeper apart is its strong social focus. Users can voice chat, send DMs, and interact while drafting leagues, entering contests, or discussing players. This vibrant, community-driven experience makes Sleeper more than just a fantasy sports app. It’s a hub for sports fans to connect and celebrate their shared passion.
CURRENT KEY PROBLEMS
Difficulty in creating and finding DMs
Users struggle to create direct messages (DMs) and find specific users to chat with. Our data shows that users often spend over two minutes just trying to create a DM, particularly when searching for the right person to message.
Unclear league origins of messages
With users participating in multiple leagues (4-5 on average), it’s challenging for them to easily identify which league a message or notification is coming from. This lack of clarity leads to confusion, especially when managing multiple conversations.
Challenges in finding past conversations
Users face difficulties when trying to locate previous conversations, such as discussions around player trades in their leagues. They often have to scroll through countless messages to find what they need, with some users reporting spending over 10 minutes on this task before giving up. This results in a frustrating and inefficient experience for users trying to revisit important discussions.
🤔💭
How might we improve and streamline the end-to-end messaging experience?
GOALS
Optimizing messaging for seamless communication and engagement
The goal of this project is to enhance the end-to-end messaging experience within Sleeper, from creating a DM to sending and revisiting messages. We aimed to analyze the entire user journey, starting from the Message Center's main hub, and optimize each touchpoint to create a more seamless and intuitive experience for our sports community. This includes streamlining the DM creation process, making it easier to identify message origins across multiple leagues, and refining the flow for quicker, more efficient access to past conversations, all while maintaining the engaging, social atmosphere that makes Sleeper unique.
SOLUTION 01
Create a DM
“I want to send a DM to my league-mate about a player trade!”
PREVIOUS DESIGN
😡 Search inefficiency: User search fails to surface friends, even when multiple characters of the username are entered
❌ Missing friend list: Users don’t have a visible list of friends to browse or choose from when creating a DM
😡 Exact username requirement: Users are forced to remember and input friends’ usernames precisely, letter by letter, to successfully search for them
NEW DESIGN
✅ Suggested friends list: Display the user’s most interacted friends upfront for quick access
✅ Searchable username: Display matching friends as the user types, removing the need to recall full usernames
✅ Non-friend suggestions: Show other users below the friends list based on the search input
SOLUTION 02
Check unread messages and notifications
“I want to check if I got any messages or notifications from my league-mates regarding a trade!”
PREVIOUS DESIGN
😡 Unread message confusion: Users struggle to distinguish unread messages, especially when the entire lobby is highlighted in green due to multiple unread messages
❌ Message request visibility: Users have difficulty accessing message requests or recognizing when a new request has been received
❌ Origin of message: No clear indication of which league a message or notification is from, causing confusion when managing multiple conversations
NEW DESIGN
✅ Unified message center: Merged DMs and notifications into a single hub with distinct tabs, streamlining navigation and allowing users to quickly access both messages and notifications from specific leagues or channels
✅ Enhanced Unread Message Indicators: Replaced full bar highlighting with bold text and a red notification badge enabling users to quickly distinguish between read and unread messages at a glance
✅ Improved message request visibility: Designed an expandable component prominently placed in the message center, ensuring users can easily notice new DM requests. The component allows seamless access to all requests, reducing interaction effort by enabling users to view and manage them with a single tap
NEW DESIGN
✅ Clear source identification: Added visual indicators to messages and notifications, showing the specific league, channel, or group chat they belong to. This helps users quickly identify the source, reducing confusion and simplifying the management of multiple conversations
✅ Notification type differenciation: Introduced distinct visual indicators for different notification types (comments, mentions, posts, etc.), allowing users to quickly identify the nature of each notification
✅ Mentions page: Introduced a dedicated mentions page within the message center, allowing users to easily access mentions with clear indicators showing the source of each mention for faster context and navigation
SOLUTION 03
Search old conversations
“I want to look at my old messages to double-check which player I promised to trade with”
PREVIOUS DESIGN
😡 Limited search functionality: The current search bar only allows users to search for friends or group chats, limiting their ability to find specific messages or conversations within the message center
❌ No search for past conversations: Users are unable to search conversations, making it difficult to quickly find and revisit important messages or discussions. Users spend more than 15 minutes searching for old chats
NEW DESIGN
✅ Enhanced search functionality: Improved the message center search bar to allow users to search for conversations with friends, group chats, and keywords from all chatrooms, providing quicker access to past discussions and enhancing overall usability
NEW DESIGN
✅ Search for past conversations: Introduced a search-in-chat feature that allows users to quickly locate specific messages by keywords, eliminating the need for endless scrolling. This feature enables easy navigation through them, drastically reducing the time spent searching for past conversations from 15 minutes to under 30 seconds
SOLUTION 04
Quick reply in active conversations
“I want to actively discuss about a trade with my league-mates!”
PREVIOUS DESIGN
❌ Unclear reply button: The reply button is not prominent or visually tappable, making it harder for users to quickly engage in active discussions, which is crucial for real-time conversations in sports-related group chats
NEW DESIGN
✅ Reply interaction: Redesigned the reply function by introducing a left swipe gesture for quick replies, eliminating the need for users to tap a small, hard-to-reach button. The swipe action is designed for one-handed use and automatically triggers the keyboard with the selected message for confirmation, providing a more intuitive and efficient reply experience
IMPACT
How can this redesign make an impact to Sleeper?
01
Increase user engagement
This redesign can drive higher app engagement, as seamless communication and socialization are key features that contribute to Sleeper’s success. By making it easier for users to chat with friends and access the right leagues and games, the user experience will be enhanced, leading to greater social interaction.
02
Measuring success
Success can be measured by tracking the increase in chatting activity per user. As user activity grows within the message center, it will indicate that users enjoy socializing on the platform. Ongoing data auditing will help refine the feature and ensure continuous improvement based on how users interact with the messaging functions.
03
Future improvements
Explore optimizing read indicators in large group chats to enhance clarity and reduce visual clutter. The current approach of displaying 15+ avatar bubbles for read messages overwhelms the interface. A more scalable solution could maintain readability while delivering a cleaner, more user-friendly experience.