As a fan of the open-source soundcloud player Cumulus, I was disappointed when it stopped functioning. With the app's ever-increasing popularity, Cumulus users were reaching Soundcloud's API play rate limit of 15,000 songs before 9am daily. The app functioned perfectly, just not for very long.
Instead of only listening to my music until 9am, I decided to build my own version of the app. I applied for a SoundCloud API Key, cloned the Cumulus Github Repository, and got to work on my redesign.
The Cumulus player functioned well, but it wasn't very visually appealing. I put together a list of items that needed addressing in my redesign:
1. Album artwork was cropped and covered by the artist and track information.
2. Controls were squished between the artwork and the progress bar.
3. Colors and typography could be improved.
To get inspired, I researched music player designs from around the web and found alot of great examples. Music players are very common, and usually follow a typical layout convention. To increase accessibility, I decided to follow a conventional layout while designing my music player.
I dove into the code and started adjusting elements. I simplified the color scheme to help the text be more legible. I increased the padding between the track controls to make them easier to select, and moved them to the bottom of the window so they'd be quickly accessible. I increased the size of the artwork and moved the track & album information to the bottom of the field.
After several dozen rebuilds, I was able to manipulate all of the code to create the design I desired. I now have a very functional and (in my opinion) pretty music player that I use every day.