Introduction
I wanted to build a new music player for the GNOME desktop, because GNOME Music is hardly maintained and doesn’t have a responsive design. However, I recently found a new job and no longer have the time to develop the application myself. I have already created the designs though, and I would like to share them here in the hope that someone else might be interested in taking over the project.
Objectives
The application should be:
- As simple a possible
Both from a design and a technical perspective, it is always good to keep an application as simple as possible. - Use the latest technologies
By latest technologies I mean GTK4, Libadwaita and Blueprint. - Be responsive so it can also be used on mobile phones.
Once the mobile patches have landed in GNOME Shell, we have a truly responsive desktop.
Design
Design Rationale
- In order to make the first version of the application as simple as possible, I removed all playlist functionality.
I understand that people may want to be able to create new playlists, so this functionality could be added in a later version. - I also removed features as Recently Added, Recently Played, Most Played, and Starred Songs.
Do people actually use these features? Are they necessary? And are they necessary for a first version? I think not. - I never really understood the purpose of the Albums and Artists tabs in the header bar, so I removed them.
Why make this distinction? When you want to search for something, you probably want to search the complete music library, rather than only albums, artists, or songs. - By removing the tabs, there is now space for the search bar, allowing users to search for a song directly!
No need to click the search icon anymore! One irritation less! - In GNOME Music, the music player is at the bottom. I never liked this placement, because it forces the user to look down towards the bottom of the screen. It doesn’t feel right. The player should always be somewhere at the top.
- Thanks to the new multi-layout view in Libadwaita, we now have a sidebar, so why not make use of it? It offers the perfect place for the music player. I saw a similar approach in other music players such as Tonearm, High Tide, and Vinyl, and it was these applications that inspired me to create this new design!
- Now that we have a sidebar on the left, there is also more room for the album cover and for the current queue. This way, the user can see what will be played next in an album.
- In order not to clutter the music player itself, I moved the repeat and shuffle buttons to the queue below.
These buttons are only relevant when there is more than one song. - I’m not sure if this is possible, but it would be great if clicking on the artist name would take you directly to the artist view.
- As you can see in the mobile view, the bottom sheet has to transform from a music player with just a pause button to the full music player with the album cover. I’m not sure how this can be done, but it is possible, because the music players Vinyl and High Tide are doing this.
- Not shown in the design, but you can search for individual songs. I only think it’s not useful to create a ‘View all view’ for all songs, because what is the use of that, if someone has, for example, ten thousand songs?
- The loading of music in GNOME Music has two problems. First, the loading bar takes the full window width and show a blue bar that moves from left to right and back. This is very distracting. Second, it’s not clear to the user what this loading bar actually does or means. To solve these two problems, I replaced the loading bar with the text ‘loading music’ and show a small spinning animation. The spinning animation could still be irritating, but I don’t know of a better solution. I also don’t know if it’s possible to guess how long the loading takes. If that is possible, a loading bar or circle could be shown that show the progress.
- Searching for a song, artist or an album works exactly the same as in GNOME Music; the results are shown as you type.
- I kept the header of the album view more or less the same as in GNOME Music. So the album cover on the left and the title of the album on the right. This way the order of the elements can stay the same in the mobile view: the album cover at the top and the title below.
- Not sure what is better: show the exact duration of an album or the time rounded to the nearest minute?
- I kept the Artist view also more or less the same as in GNOME Music. The only difference is that the name of the artists is now shown at the top.
- In the Preferences menu there are only two settings: Music directory and Background gradient. With the first someone should be able the select a different directory than the Music directory for the music collection. This because I can imagine that people have there music collection stored in a different directory. I don’t know however if this is technically feasible or desirable. If not, this feature can be removed or postponed. The second settings is about settings a gradient effect to the background of the application. This is not something that is really important, but the effect, especially on the desktop, is really nice. This feature is also not really important for the first version of the application.
- As a design experiment, I moved the menu with the options Preferences and About Remix to the top of the screen. I know they are normally placed at the bottom, but the menu button itself is at the top, so I would find it strange if this menu would appear at the bottom. Not sure if this would work or though.
Development
If someone wants to build this application, they should use the following technologies:
- GTK4
Gtk – 4.0 - GTK XML / UI files
Gtk.Builder - Libadwaita
Adw – 1 - Blueprint
Blueprint documentation - TinySPARQL
Tsparql – 3.0 - GStreamer
GStreamer - GstPlay
GstPlay - One of the programming languages that GNOME supports
Programming Languages
If some chooses the programming language Vala, the music app Gapless could be used as a basis. This because Gapless has two very interesting features: fast loading of files and a low memory footprint.
Maybe Hylke Bons want to develop an icon for the application?
Questions
- How do you write GTK XML / UI files?
- How do you write Blueprint files?
- Which nesting of GTK widgets are allowed?
- Where can someone find the properties of the GTK widgets?
In the documentation of GTK? - Is there example code of how to use TinySparql in Vala?
- What is better: use Gstreamer directly or use GstPlay?
- How does GObject Introspection work?
How is the binary files composted if the application uses two programming languages (C and your own language)? - Does it matter which language you choose?
Is there a preferable or best language? - How much time does it, for a beginner, take to develop this application?
- Which guidelines do you have to follow if you want to develop this application for the GNOME Circle?
Contact
If you want to develop this application, or know someone who might; feel free to leave a comment!