UX design ideas for a Music Dashboard widget

🍱 Features & apps music
,
1

I’ve thought there should be a Music widget for the Nextcloud Dashboard feature. I :heart: the Music app.

I’ve put together a very simple sketch showing how it might work.

I am not a developer so don’t have the skillz to implement this. I’m just a simple UX designer :stuck_out_tongue:

Here’s how it might work:

  1. The steps to add the yet-to-be-created widget would be the same as for all other widgets → click customise → choose “Music” widget.
  2. Once the widget was added to Dashboard, it might look like below:

Nextcloud Music player widget_210604_083848_1
Nextcloud Music player widget_210604_083848_12172×1536 250 KB

  1. The main questions I have is - what content should be displayed on the widget?

It’s possible users have lots and lots of playlists, albums, etc. It’s probably not possible to display all of these - there’s not much UI area available. Unless we could search? :thinking:

From least favourable to most favourtable, my thoughts are that the widget shows:

:frowning: LEAST ideal option

Random Playlist, Internet Radio station, Albums

:neutral_face: MEDIUM ideal option

The first 1/2/3/X of each Playlist, Internet Radio station, Album

:grinning: MOST ideal option

The user is able to add a Playlist, Internet Radio station, or Album to their favourites (using the same method in other areas of Nextcloud), and the widget displays them.

This “add to favourite” option would also have an upper limit - you can only show a maximum number of albums, stations, playlists without introducing some scrolling in the widget. I don’t think it would be a good idea to introduce scrolling into the widget.

That’s OK - it will focus the users mind to choose exactly which music should show on the dashboard - what really is your favourite? :slight_smile: (For me it’s radio stations SomaFM Mission Control, Secret Agent, Rock Antenna and about 7-8 specific playlists.)

:+1: :+1: GOOD compromise between Medium ideal and Most ideal option

To show the N latest played entries. This is similar approach used in other Dashboard widgets where they have to show a list of things - like in mail, bookmarks apps.

I’d be interested to hear other people’s thoughts. @paulijar is the maintainer of the great Music and I’m sure he has thoughts about the idea.

Thanks

3 Likes
2

Thanks again for the concepting @bernard!

I wonder, could there be some playback controls on the widget (play/pause/next/prev/shuffle/repeat). On the other hand, all the Dashboard widget I’ve seen are just lists of things, so maybe there is some architectural limitation here? Also, all the widgets seem to have rather large list items so that the widget can hold only 7 entries in total. If that is enforced by the framework, then we could maybe drop the sub-titles Playlists, Internet Radio, and Albums; the type of the item would then be indicated just by the icon of the entry.

Instead of showing the N first/random/favorite entries, there is also fourth option: Tho show the N latest played entries. I think this beats at least the options of showing the first or random items. Favorite items would be nice, too, but it would require having the favoriting feature on the Music main UI which would be significant effort on its own. Of course the favorites feature for the Music app has been requested before and it may be implemented at some point regardless of the Dashboard widget. But I don’t know when would that be.

But overall, it’s a bit difficult to design the widget without knowing what kind of things are actually technically possible in these widgets.

3

Hi @paulijar you’re welcome. Thanks for the reply.

I wonder, could there be some playback controls on the widget (play/pause/next/prev/shuffle/repeat) […] maybe there is some architectural limitation here?

I wasn’t sure if it were technically possible to add playback controls on the widget, so I didn’t add them into version 1, but I’ve added them into version 2 below. The idea is to use the already implemented controls as much as possible. Although, if space was an issue, you could remove the “shuffle”, and “repeat” controls if necessary.

the widget can hold only 7 entries in total. If that is enforced by the framework, then we could maybe drop the sub-titles Playlists, Internet Radio, and Albums; the type of the item would then be indicated just by the icon of the entry.

Ah, this is good to know. I like your suggestion of using the icon to indicate the item type. :+1: I’ve incorporated it into the design.

Although we will need an icon for playlist. (more below)

What media items to show in widget?

there is also fourth option: Tho show the N latest played entries. I think this beats at least the options of showing the first or random items.

Yes! I like this option a lot, much better than my options. And it follows the same UI patterns of other Dashboard widgets:

This shows the recently used bookmarks widget
This shows the recently used bookmarks widget353×558 82.2 KB

This shows the frequently used bookmarks widget
This shows the frequently used bookmarks widget353×558 114 KB

As MVP we could start with showing the recently used Playlists/Albums/Internet Radio Stations?

Design version 2

Here’s version 2 of the design:

Nextcloud Music player widget_210604_083848_2
Nextcloud Music player widget_210604_083848_22172×1536 229 KB

I’ve also included some extra functionality (if its possible to implement):

  1. now playing - this could maybe scroll hozitontally?
  2. the item artwork if it’s present?

No playlist icon

Right now there’s no playlist icon in Music.

We’ll need to add one as otherwise visually it’d be a bit unpleasant to have icons for albums and internet radio stations, but no playlists

A simple option is shown below. Doing a web search for “playlist icon” shows this option seems to be pretty common.

Nextcloud Music player widget_210604_083848_3
Nextcloud Music player widget_210604_083848_32172×1536 277 KB

4

A few of the icons used in the Music app are from the Material Design icon set. There, suitable icons for the playlist could be Queue Music and Playlist Play. But I might want to preserve that Queue Music icon to be used when one day I’ll hopefully add the play queue view to the Music application.

1 Like
5

Ah good to know you’re using the Material Design icons - in which case you suggestion of Playlist Play works well I think. :+1:

I’ll update the design to version 3 and add it here soon.

I’m curious - is the design doable technically? Or does anything need to change?

6

Hi @paulijar, I wonder if this widget design needs any other improvements?

If no, and you have no objections I’d like to open an issue in the GH repo for it? I’d look forward to using it. :slight_smile:

What do you think?

7

Hi @bernard . I don’t think that it would be worthwhile to refine the design before we have a better understanding of what is actually possible with the framework. Feel free to open a feature request issue in GitHub.

I believe I have again some time to implement some new features for the app during July-August while I’m having my yearly vacation. But I’m not sure yet if the Dashboard widget will be part of this development sprint; there are also many other interesting options, including the podcast support. But I’m confident that there will be Music v1.3 with at least some new features before September.