The document provides guidelines for developing Spotify apps. It outlines user experience (UX) principles like avoiding duplicating Spotify's native UI, keeping apps simple with a clear purpose and limited features. It also covers technical specifications like using the correct app icon format, making the app responsive on different screens, using Spotify's loading indicator, and linking to albums, artists and tracks. The document aims to help developers design apps that are integrated with Spotify and provide a seamless user experience.

1. Spotify Apps
INTRO TO DEVELOPMENT AND DESIGN
LUKASZ DYNOWSKI

2. What can you do with Spotify ?
Applicability
https://www.spotify.com/us/aboutus/advertisers/ad-specs/billboard-ads/
Resources:
https://www.spotify.com/us/aboutus/advertisers/adspecs/appendices/downloads/

3. The Architecture

4. UX Principles

Don’t duplicate functionality from the native Spotify UI. “User have to
stick to Spotify native controls, which they are used to”

A Spotify app is not a website : “The best apps have a clear
purpose, no tabs, minimal amount of text, flat hierarchy and limited
number of features, buttons and other controls.”

The start page should be easy to understand and use

All about music.

Make it instantly personal.

Be here now “Don’t add features that force users to go out to your
website.”

Integrate

5. App Icons

Use the correct format for the app icon
Link: https://developer.spotify.com/technologies/apps/design_resources.zip
”If you are planning to include deviations from the requirements in your app. You have to provide
information of which deviations have been made and why”
Design application icon in colours that pop from
both a light and dark background
 Use our own set of icons to convey different
features and actions


Make your own icons align with ours

Make sure your icons are sharp and crisp

6. Responsive
The app should work on both small and
large screens.

Min width :640 px (based on a screen resolution of 800 px with an
160 px ad banner)

Max width: 2500 px or more (large screens).

7. Columns
Don’t use columns!
“Adding another column navigation inside your app might
lead to column creep.”

8. Buttons
Use native Spotify buttons as much as
possible. “Use native Spotify buttons as much as possible.”
However, New buttons should resemble
Spotify look and feel

9. Sharing

10. Loading
Use Spotify’s throbber when loading

11. Scrollbars
Don’t use scrollbars within components

12. Pagination
Using previous/next page navigation.

13. Album Link

14. Artist Link

15. Track Link

16. Overlay play button

17. RESOURCES
Design:
https://developer.spotify.com/technologies/apps/guidelines/design/
Resources:
https://developer.spotify.com/technologies/apps/design_resources.zip
Advertisers:
https://www.spotify.com/us/about-us/advertisers/ad-specs/spotify-adformats/
Templates:
https://www.spotify.com/us/about-us/advertisers/adspecs/appendices/downloads/