# Spotify-Style Music Player UI in SwiftUI, Done Right

> By Lawrence Arya, Founder & CEO of VP0. Published 2026-05-31, updated 2026-06-02. 4 min read.
> Source: https://vp0.com/blogs/spotify-ui-clone-swiftui

A great music app is two screens and a habit: a library to browse, a now-playing to sink into, and a mini-player that never leaves.

**TL;DR.** A Spotify-style music or podcast app comes down to a few patterns: a browsable library, an immersive now-playing screen, and a persistent mini-player that follows you everywhere. Build them from a free VP0 design in SwiftUI, wire audio with AVFoundation, and support background playback and lock-screen controls. Learn the interaction pattern rather than copying Spotify's brand or assets, and bring your own identity and catalog.

A Spotify-style player is really a handful of well-worn patterns done smoothly. The short answer: build a browsable library, an immersive now-playing screen, and a persistent mini-player from a free VP0 design in SwiftUI, then wire audio with AVFoundation and support background and lock-screen playback. Learn the pattern, do not copy Spotify's brand, logo, or assets, and bring your own identity and catalog. Streaming is mainstream, Spotify alone reports more than [600,000,000](https://www.statista.com/) users, so the bar for a music app is high.

## The patterns that make a music app feel right

Three things carry the experience. The library and browse screens let people find music: playlists, albums, search, and recommendations, scannable and image-rich. The now-playing screen is where listeners sink in: large artwork, a precise scrubber, clear transport controls, and quick access to the queue. And the mini-player is the secret to a great music app, a compact bar that persists across every screen so playback is always one tap away and never interrupted by navigation. Get those three right and the rest follows. Everything else, search, recommendations, playlists, downloads, hangs off that spine, so nail the spine first and add depth once playback feels effortless and the mini-player never gets in the way. Apple's [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/) on media and now-playing apply directly.

## Build it from a free design

VP0 is a free iOS design library for AI builders. Pick library, now-playing, and mini-player designs, copy their links, and have Cursor or Claude Code rebuild them in SwiftUI, then wire playback with [AVFoundation](https://developer.apple.com/documentation/avfoundation) using AVPlayer or AVAudioPlayer. Make the scrubber precise (seek on release), keep the mini-player persistent above your tab bar, and support background audio with lock-screen and Control Center now-playing info, listeners expect playback off-screen. Use your own brand, colors, and content; the value is the pattern, not the imitation. For a streaming sibling on the big screen, see [Apple TV tvOS streaming app UI kit](/blogs/apple-tv-tvos-streaming-app-ui-kit/), and for overall polish, see [how to make my app look better](/blogs/how-to-make-my-app-look-better/).

## Music player building blocks

Each part keeps playback central.

| Part | Job | Get it right |
|---|---|---|
| Library and browse | Find music | Image-rich, searchable |
| Now playing | Sink into a track | Big art, precise scrubber |
| Mini-player | Always-on control | Persistent across screens |
| Background audio | Off-screen playback | Lock-screen now-playing |
| Queue | What is next | Easy to view and reorder |

## Common mistakes

The first mistake is copying Spotify's exact look and branding rather than learning the pattern, a trademark and originality problem. The second is no persistent mini-player, so playback gets lost during navigation. The third is missing background and lock-screen controls, breaking the core use case. The fourth is a janky scrubber that stutters; seek on release. The fifth is a cluttered now-playing screen that buries the artwork and controls. Learn the pattern; build your own brand.

## A worked example

Say you build a podcast app. From VP0 designs, you build a browsable library, an immersive now-playing screen with large art and a precise scrubber, and a mini-player that sits above the tab bar on every screen. Audio runs through AVFoundation with background playback and lock-screen controls, so a listener can lock their phone and keep going. Your colors, name, and catalog are your own, only the proven interaction pattern is borrowed. For a map-based marketplace pattern next, see [Uber clone app UI kit free download](/blogs/uber-clone-app-ui-kit-free-download/), and for a focus-first counterpart, see [black and white dumbphone launcher UI clone](/blogs/black-and-white-dumbphone-launcher-ui-clone/).

## Key takeaways

- A Spotify-style app is a library, a now-playing screen, and a persistent mini-player.
- Build them from a free VP0 design in SwiftUI and wire audio with AVFoundation.
- Keep the mini-player persistent and support background and lock-screen playback.
- Make the scrubber precise (seek on release) and the now-playing art prominent.
- Learn the pattern; never copy Spotify's brand or assets, bring your own.

## Frequently asked questions

How do I build a Spotify-style music player in SwiftUI? Build the library, now-playing, and mini-player from a free VP0 design, wire audio with AVFoundation, and support background and lock-screen playback. Use your own brand and catalog.

What makes a music app feel professional? A persistent mini-player that keeps playback one tap away on every screen, an immersive now-playing screen, a precise scrubber, and reliable background and lock-screen controls.

Is it okay to clone Spotify's design? Learn the interaction pattern, but do not copy Spotify's logo, brand, or assets, which are trademarked. Build your own identity around the proven library, now-playing, and mini-player patterns.

Do music apps need background playback? Yes. Listeners almost always have the screen off, so support background audio with lock-screen and Control Center now-playing controls, or the core experience breaks.

## Frequently asked questions

### How do I build a Spotify-style music player in SwiftUI?

Build the library, now-playing, and mini-player from a free VP0 design, wire audio with AVFoundation, and support background and lock-screen playback. Use your own brand and catalog.

### What makes a music app feel professional?

A persistent mini-player that keeps playback one tap away on every screen, an immersive now-playing screen, a precise scrubber, and reliable background and lock-screen controls.

### Is it okay to clone Spotify's design?

Learn the interaction pattern, but do not copy Spotify's logo, brand, or assets, which are trademarked. Build your own identity around the proven library, now-playing, and mini-player patterns.

### Do music apps need background playback?

Yes. Listeners almost always have the screen off, so support background audio with lock-screen and Control Center now-playing controls, or the core experience breaks.

---
*Published on the [VP0 Journal](https://vp0.com/blogs). Free to read, index and cite with attribution.*
