This case study explores how music streaming and social messaging can be combined into a single, fluid mobile-first experience. Inspired by Spotify's minimalist player and modern social UX patterns, I designed a chat feature prototype within the Spotify app—allowing users to message friends, share tracks, and engage in real-time, all without ever leaving the app.
Problem & Goal
The Problem
Music sharing today happens outside the listening experience. Users must switch to WhatsApp, DMs, or other platforms to send tracks—interrupting their flow.
The Goal
Design a native chat interface integrated into a music player where users can:
- Send and receive messages
- Share music instantly
- Stay immersed in the app experience
Research & Inspiration
Comparative Products
- Spotify: Player UX
- WhatsApp, Telegram, iMessage: Chat architecture, presence indicators
- Instagram, Twitter DMs: Media sharing, user interactions
User Insights
- People want to share songs in the moment
- App-switching breaks the listening flow
- Most chat UIs feel too generic—not music-aware
Design System
Typography
- Font: Circular (Spotify's font by Lineto)
- Sizes:
H1: 36px | H2: 32px | H3: 28px | H4: 24px | H5: 20px | H6: 16px
Colour Palette
| Name | Hex |
|------------------|-----------||
| Spotify Green | #1ED760 |
| Primary BG | #121212 |
| Secondary BG | #333333 |
| Primary Text | #FFFFFF |
Iconography
Includes icons for:
- Playback controls
- Messaging actions
- Music sharing
- Presence and reactions
Key UI Features
Home Integration
- Mini-player remains visible at all times
- New Chat icon in the top-right for instant access
Chat List Screen
- Filter tabs: All, Unread, Groups, Favorites
- Message previews for quick context
- Streak pills show frequent messaging
- Green dots for unread messages
- Mini-player always active at the bottom
Chat Window
- Contact name, presence status, and current song displayed
- Mixed message bubbles (text + music share)
- Action bar shows current song's album art (clickable)
- Input box supports both text and voice messages
Sharing Music
- From the player, tap Share
- Choose contact/group from overlay UI
- External sharing to WhatsApp, Messages, TikTok, Snapchat, and more
Tools Used
- Design: Figma
- Role: Solo UX/UI Designer
- Type: Personal Concept / Case Study
What's Next?
- Conduct usability testing
- Explore accessibility optimizations
- Build a working prototype using React Native or Swift UI
Final Thoughts
This concept reimagines Spotify as not just a music platform, but a social music-sharing space. By embedding messaging directly into the music experience, we keep users immersed, connected, and in the moment.
