Music Player Widget

UI Design UX Design

Music Player Widget

I am an avid music listener and as a final project for my interface design course, I decided to redesign the overall experience of a music player widget. I took the inspiration from the picture in picture mode introduced in iOS 14.

The Problem

As smartphones continue to get larger, our hands don’t which makes the top parts of your screen harder to reach one-handed or just with a thumb which is how most users use their smartphones. This means that important interactions must be placed within the reachability of the user i.e the bottom and the middle parts of the screen. One such scenario is in the case of music players like Spotify where when you’re not in the app the only way to control the music is by dragging down the notification panel to find the controls. I asked myself how can I make it more comfortable?


This is where the widget comes in. This widget is going to be constantly present on the screen whenever the music application is running in the background. You can drag it to place it either on the right or the left side of the screen depending on your dominant hand using the phone. Its initial form would be a semi-circle taking very minimal space on the screen and you can easily tap on it to pause/play the music. To change the track you can swipe up or down on the widget. In case you want to get more control options, you can drag the widget out and it will expand into a proper music player where you can get access to other options like a slider to control the timestamp of the music.