3D Music Player
UI and Graphic Design
- Visual Lead whole 3D music Player project.
- UI Design whole 3D music Player project.
- Design every graphic/visual/3D/UI element in 3D music Player application.
The 3D Music Player is something I created five years ago when I was working in Ixonos. My design task was to concept a music player that was different than anything else. I had designed different kind of music players in the past (i.e. in my subcontractor career) and was given the chance to do something different.
My vision was to make one application that fits to many purposes: social media, music and video. At the same time it had to have some kind of interaction with the user. I started to imagine the space, where you can have something that transforms into your needs in different ways; some days that thing will be a music player and some other days it will be a movie player.
Users can always see that thing in their home screen and it is always available. Moreover, users can fly in that space and all their social media friends are doing the same. The user can see what friends are watching, listening or doing (integrated with social media, facebook, twitter, youtube, vimeo, etc).
Music player or movie player should not be complex. It should not have many views or menus. It has also to work in tablets, TVs, etc. In this kind of application less is more - including wireframes.
First sketches about this social media space were something like this. I hadn't decided if it would be a organic or metallic object.
But in in the end I decided that a robot is simpler to use and it fits better.
Final Robot and 3D music player Concept
Some of the following actions are in the video (see: 00:00) while some of them are only in wireframes:
Basic things (no need to draw wireframe pictures):
Enter the application
- The User has to install application in appstore or it can be there already pre-installed.
- When the user has installed app, Robot Widget can be placed in home screen.
- Pressing Player text in robot view, music player will be visible (00:13)
Exit the application
- Widget can be exit like basic home screen widgets
Minimize the application
- It is always on the background (00:50) unless the user closes application.
1. After the robot widget has transformed into music player mode (circle wheel object) the user can see all his albums in the upper menu and his newest album is always first in the music player (00:18).
2. Touching the album cover (play symbol), music starts playing (00:26).
3. Touching the album cover when music is playing (pause symbol), music stops.
4. Long press in album cover, stops song.
5. Song can be skipped by swiping song name left or right (00:31).
6. Song can be forwarded and reversed by using slider object.
7. Song can be searched by longpressing the library line.
8. After the user writes song name and presses enter, search bar dissapears.
Random, repeat or continuos
9. Song can be shuffled by pressing right corner in the album cover.
10. Song can be repeated by pressing left corner in the album cover.
Create Playlist, Load Playlist, Clear Playlist, Save Playlist
11. Create and load playlist is based on Dragging albums in circle wheel.
12. Clearing playlist is based on dragging albums out of circle wheel.
- If the user has not dragged any album out, the application will automatically save it as a playlist.
Show song, artist & album name and album art
- All these functions can be seen in circle wheel, no need to draw wireframe.
Sharing, social networking
13. Pressing the Social (Feeds) text in Robot menu Circle, robot takes the user in to the space.
14. The user can just fly in social media space, go deeper (Pinch & Zoom) and see what social media friends are watching. Social media friends can also see what he/she is listening. The application is integrated with social media networks like Facebook and Twitter. The user doesn't have to share anything; it's automatically shared in space (00:52) when the user uses the application.
I would like to thank my former boss Mr. Sami Paihonen, who gave me the freedom to design this concept in 2011.