Chat for Spotify – UI/UX

Hey there! This started as an iOS app built in SwiftUI and was live for a good while, tapping into Spotify APIs so people could discover new friends through shared music taste. I’ve since retired it. Below are some screens and quick insights into what I did and why.

1 Icon
App Icon
The icon was modelled in Houdini. I was going for a skeuomorphic look with reflective surfaces.
2 Login
Login Screen
Simple login with Spotify. The dark gradient background was inspired by Spotify Greenroom app's design (now Spotify Live).
3 Main Screen
Matchmaking and Suggestions
You can scroll horizontally to see recommended tracks, artists, or new people. The artist icons under the users are scrollable too and offer a quick preview of the user's favorites.
Recommendations Screen
Recommendations show album art and metadata, plus play/like buttons.
Find Friends Screen
The “Find” bar at the bottom (safari style). As you type in any artist or track, you’ll see keywords appear as horizontal chips above it, and a matching set of user cards just above that.
4 Chat and Group
Conversations List
This is the active chats view. Each conversation card shows user avatars and genres. Accept invites with one tap—makes it easy to jump into chats.
Group Chat
Group chats list all participants in the user “bubbles” up top (it's scrollable too). Pulling that off in SwiftUI with dynamic profiles was a bit tricky.
Group Creation Screen
Group creation uses the same horizontally scrollable system. You type in track or artist names, those keywords appear as little capsules, and matching people show up above. Avatars are removable if you change your mind.
5 User Profiles
User Profile - Self
For the profile page, I layered a grid of favorite artist icons behind the user. It’s got a subtle color-bleeding animation, inspired by old iTunes. There’s also a sparkly button that spits out cursive AI generated bio.
User Profile - Others
Other users’ profiles also show their favorite artists, genres, and a short bio.
6 Preview Clips