Daily UI #009 - Music Player [Car UI]

Daily UI #009 - Music Player / Car UI

Initial Thoughts:
When I saw that Today’s challenge was to design a music player, I immediately thought of the horrendous UI Design I see in my car every time I want to listen to my favorite jams.

I didn’t want to create another “generic” music player, I saw a ton of the same Google Play and Spotify clones. Also, I wanted to explore an exotic screen resolution size and environment.

Design:
I feel that a lot of car screens and UI designs are severally lacking in polish and sophistication. Honestly, I haven’t seen luxury car screen designs personally, but I do have my own personal Honda Accord 14’ with a screen that I look at almost every day.

Here is what it looks like https://imgur.com/a/BfqNric. Needless to say, it is lacking inspiration. Why is the Bluetooth icon SO BIG??

As the subject for my song, I chose the Song EARFQUAKE from Tyler, the Creator, one of my favorite songs at the moment. http://smarturl.it/tylerthecreatorigor

The first thing I wanted to include was more imagery and style to the screen. That was injected via an obvious inclusion of the album art, more efficient use of visual space, a classier typeface, and a modern aesthetic.

Another idea I was excited about including was an animated background image. I was inspired to include this when I saw Spotify using a similar technique for certain songs. However, since this UI would exist in a car, the video is intentionally blurred slightly and covered by a dark-colored overlay. The idea is that the whole music video wouldn’t play in the background, just a small section either curated by hand or a self-learning AI.

There are limited controls included on the screen because the actual controls are on the steering wheel, and can quickly be accessed there. The 1 and 2 buttons correspond to an area on the center dashboard and can be accessed by the passenger.

I changed the volume UI to be a circle to correspond with the actual controller which is a circular knob on the center console. The small dot would also move according to the level of the volume.

The device source, menu tab (Bluetooth), and clock were all mad smaller and efficiently tucked in the top of the screen, giving the rest of the design more room to breath.

Takeaway:
I wish I could replace the UI in my car with this one here, it would make the times when I get stuck in traffic on the 24 and 580 more bearable.

If this was my new UI, I would be super stoked. I feel car UI in general in incredible underexplored. Maybe this can be my ticket into the Honda 2014 Car UI Redesign Team

--

More about the design challenge:
https://www.dailyui.co/