Visualization of data submitted to ListenBrainz is a big feature that will probably make it much more popular among users.
With this in mind, we should try to show lots of pretty stats that users find interesting. I am soliciting more ideas on graphs that we could add and some feedback on the idea of using plotly.js for these graphs. Plotly.js is an MIT licensed charting library based on d3.js which draws interactive graphs of all types. Link: https://github.com/plotly/plotly.js/. If anyone has any better suggestions for charting libraries, please help out!
Here is what I have come up with so far:
Right now, I have divided graphs into three categories:
- User graphs: graphs which tell the user about her own listening history.
- Entity graphs: graphs which show details about entities like artists,
- Miscellaneous graphs: graphs which don’t fit into the above categories, like a sitewide listen-count graph
What graphs should ListenBrainz show
User graphs
Last.fm has three graphs on the user page: top artists, top albums and top tracks. We should also show these graphs with
each graph being a horizontal bar chart showing top 10 (open to suggestions on number here) artists, albums and tracks.
These would look like this: https://codepen.io/iliekcomputers/full/rjPYEw (Please ignore the colors and fonts, this is just a demo). Each of the labels on the y-axis would link to the relevant page on LB, the artist graph linking to the artists, the album graph linking to the albums etc. I have used plotly.js, an open source charting library based off of d3.js to build the demo graphs. In my opinion, plotly should be okay to use to draw graphs on the main site also.
Also, I propose that the graphs on listenbrainz.org/user/iliekcomputers will show only top 10 artists etc and we add the following views to show more detailed graphs:
-
listenbrainz.org/user/iliekcomputers/artists
: Shows a horizontal bar chart similar to the one on the user page of all artists listened to by the user in some past interval of time (1 month / 1 week) -
listenbrainz.org/user/iliekcomputers/albums
: Same as artists but shows top albums -
listenbrainz.org/user/iliekcomputers/tracks
: Same as artists but shows top tracks
Optional ideas:
- A top tags pie chart which would show (you guessed it) top tags.
- daywise listening history: horizontal bar chart which shows frequency of listens by day
Entity graphs
Right now, LB does not have any entity view at all. We add views inspired by CritiqueBrainz artist page, release group page for artists, release-groups etc. all uniquely identified by MBIDs. Then we add the following stats to these pages:
- Top listeners (all entities): This would not work as a graph imo, I think just a flat list of the top 5 listeners of the entity would be the best thing to show here.
- Top tracks (artists and release groups): This would be a horizontal bar chart with number of listens sitewide on the x-axis for each track of the particular entity. For artist pages it will link to a view
listenbrainz.org/artist/mbid/tracks
which would contain a bigger bar chart with top 100 or so tracks of the artist. For release-groups, there does not need to be a different view because most release groups
will have 10-20 tracks at most. - Top releases (artists): This would be a graph on the artist page, showing her top releases in a bar chart.
Miscellaneous graphs
The front page is currently being used to describe the goals of listenbrainz and I think we should not clutter it up.
We should add a different view, maybe listenbrainz.org/stats
which should show the following graph:
-
Cumulative number of listens submitted sitewide over time. This graph would look like this: https://codepen.io/iliekcomputers/full/LxqvZJ/
-
Top entities: We can show images of top artists and releases listened to. I do not want to show graphs here as I think for sitewide stuff images would look much better in a collage format. For albums, we can use cover art archive for images.
Any suggestions or new ideas would be greatly appreciated!