# Apple CarPlay Audio App UI: Templates and Safety > By Lawrence Arya, Founder & CEO of VP0. Published 2026-05-31, updated 2026-06-02. 4 min read. > Source: https://vp0.com/blogs/apple-carplay-audio-app-ui-template CarPlay does not let you draw your own screens, and that is the point: the system enforces glanceable, safe layouts so the road stays first. **TL;DR.** CarPlay audio apps do not use custom-drawn screens, they use Apple's strict system templates (list, now-playing, tabs, grid) that the system renders for safety. So designing a CarPlay app is really about structuring your content into those templates well, keeping lists short and glanceable, and letting the phone app do the rich UI. Understand the template model, design your iPhone app from a free VP0 design, and respect the driver-distraction rules. The first thing to know about CarPlay is that you do not design custom screens for it. The short answer: CarPlay audio apps use Apple's strict system templates (lists, a now-playing screen, tabs, a grid), which the system renders for safety, so your job is to structure content into those templates well and keep everything glanceable, while your rich UI lives in the iPhone app. CarPlay is everywhere, Apple says about [98%](https://www.apple.com/ios/carplay/) of new cars sold in the US offer it, so getting the model right matters. ## CarPlay is templates, not freehand UI Apple deliberately limits CarPlay to a fixed set of templates so apps cannot create distracting, inconsistent, or unsafe interfaces while driving. For an audio app, that mostly means a few list templates for browsing (playlists, stations, episodes), a now-playing template for playback, and tab or grid navigation. You supply the data and structure; the system draws it with safe sizing, contrast, and interaction. This is a feature, not a limitation: it keeps the driver's eyes on the road. The official [CarPlay developer guidance](https://developer.apple.com/carplay/) defines exactly which templates audio apps may use. ## Design the structure, not pixels VP0 is a free iOS design library for AI builders. You will not pixel-design the CarPlay screens, but you absolutely design the iPhone app that pairs with it, browse, search, library, now-playing, so pick those designs from VP0, copy the links, and have Cursor or Claude Code build them in SwiftUI. For CarPlay itself, focus on content structure: keep lists short and scannable, use clear titles and artwork, limit depth so drivers are not navigating menus, and make the now-playing controls obvious. Apple's [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/) include CarPlay-specific safety guidance. For the broader Apple-ecosystem patterns, see [Apple TV tvOS streaming app UI kit](/blogs/apple-tv-tvos-streaming-app-ui-kit/), and for another glanceable surface, see [watchOS 11 health ring UI clone](/blogs/watchos-11-health-ring-ui-clone/). ## CarPlay audio templates Structure your content into these. | Template | Use it for | Keep it | |---|---|---| | List | Browse playlists, stations | Short, scannable | | Now playing | Playback controls | Big, obvious controls | | Tabs or grid | Top-level navigation | Few, clear sections | | Search | Find content | Simple, fast | | Artwork | Recognition at a glance | Clear, high-contrast | ## Common mistakes The first mistake is expecting to design custom CarPlay screens; you cannot, and trying to fight the templates wastes effort. The second is deep navigation that makes a driver tap through menus, exactly what the rules prevent. The third is long, dense lists that are unreadable at a glance. The fourth is neglecting the now-playing controls, the most-used screen while driving. The fifth is forgetting that the iPhone app, not CarPlay, is where your rich, branded experience lives. Work with the system, not against it. ## A worked example Say you have a podcast app. The rich browsing, discovery, and settings all live in your iPhone app, which you build from VP0 designs. For CarPlay, you map your content to templates: a tab for Library and a tab for Browse, list templates showing shows and episodes with artwork, and a now-playing template with large play, skip, and speed controls. Lists stay short, navigation stays shallow, and the driver can start a show with a glance and a tap. For the phone-side player it complements, see [parallax scroll header UI mobile](/blogs/parallax-scroll-header-ui-mobile/), and for the messaging-style app inside another platform, see [Telegram Mini App UI kit Figma free](/blogs/telegram-mini-app-ui-kit-figma-free/). ## Key takeaways - CarPlay audio apps use Apple's system templates, not custom-drawn screens. - Your job is to structure content into list, now-playing, and tab or grid templates. - Keep lists short, navigation shallow, and now-playing controls obvious for safety. - Design your rich, branded UI in the iPhone app from a free VP0 design. - Work within the template rules; they exist to keep drivers safe. ## Frequently asked questions How do I design an Apple CarPlay audio app UI? You structure content into Apple's system templates (lists, now-playing, tabs or grid) rather than drawing custom screens. Design the rich iPhone app from a free VP0 design, and keep CarPlay lists short and glanceable. Can I make custom CarPlay screens? No. CarPlay renders a fixed set of system templates for safety and consistency. You supply the content and structure, and the system draws it, so you cannot create fully custom layouts. Why is CarPlay so restrictive? To minimize driver distraction. The fixed templates enforce glanceable, consistent, safe interfaces so drivers keep their attention on the road, which is why deep menus and dense screens are not allowed. Where does my app's real UI live then? In the iPhone app. That is where you build the full, branded browsing, search, and settings experience from a free VP0 design, while CarPlay shows a safe, simplified view of the same content. ## Frequently asked questions ### How do I design an Apple CarPlay audio app UI? You structure content into Apple's system templates (lists, now-playing, tabs or grid) rather than drawing custom screens. Design the rich iPhone app from a free VP0 design, and keep CarPlay lists short and glanceable. ### Can I make custom CarPlay screens? No. CarPlay renders a fixed set of system templates for safety and consistency. You supply the content and structure, and the system draws it, so you cannot create fully custom layouts. ### Why is CarPlay so restrictive? To minimize driver distraction. The fixed templates enforce glanceable, consistent, safe interfaces so drivers keep their attention on the road, which is why deep menus and dense screens are not allowed. ### Where does my app's real UI live then? In the iPhone app. That is where you build the full, branded browsing, search, and settings experience from a free VP0 design, while CarPlay shows a safe, simplified view of the same content. --- *Published on the [VP0 Journal](https://vp0.com/blogs). Free to read, index and cite with attribution.*