Amarok’s new Context View: GSoC updates

Posted by ruphy at 12:37 on the 6 of August, 2012 — Categories: Amarok,GSoC,KDE.

Hi everybody,

so, this is my first blog entry here since 2010 (whoa!), but at least I have some nifty blingy things to show to the world. :)

As you might (or might not) know, I’m working on a GSoC to revive Amarok’s Context View.

A little history: the Amarok team was not terribly happy with how the Context View was working. So I proposed to help rewriting it, and I sent in my proposal, to apply for a GSoC slot. The decision taken at the time were few: I proposed that the new interface would be completely based on QML (so it would be fast and sexy) and that it would be completely rethought and simplified.

Most importantly, I wanted to avoid the current lego-style design, inheritance of the plasmoid design. Which, let’s be honest, works on a desktop, but doesn’t really make too much sense in a media player.

So, in the past months, I’ve been doing quite some research: I’ve been working on the interface within Inkscape, I’ve written a working mockup in QML, I’ve produced quite some documentation about how things should work, and obviously, after all that, I’ve also started putting the code where my mouth was.

Even if the research work has been done on all of Amarok’s UI, the coding work was concentrated on the Context View, subject of my GSoC.

Without further ado, here’s a screenshot of the new Context View and what has been integrated in the code so far:

For those of you who want to play with it already (beware, it’s still an early version) you can get the qml branch directly from the amarok repository.

I know this ain’t perfect (of course): the first thing that i need to do now is for example to put the icons in a recolorable SVG, in order to get great looking monochrome icons in all condition, then the Wikipedia visualization will need to improve, and so on (there is a nice TODO in the repository). However, I think it’s a good start.

Ah, and before you ask, I’ll get to the mockups topic. I have actually made more or less complete mockups for the whole UI, but I’m a little reluctant to show them right now: they’re not fully finished, and I’d like to avoid bikeshedding on something of which I’m not totally happy about.

I will show them to you soon, but I first want to get them convey at least the general feeling of the UI that I want to create, not just parts of it. I will actually really need your feedback and testing (who said QML mockup?) but it’s not the time yet. After all, I’m serious about this project, and I will continue helping with the QMLification of Amarok even after the GSoC. :)

Stay tuned!

11 Comments »

  1. Comment by Anonymousse — August 6, 2012 @ 1:26 pm

    How about focusing on usability for a change? Please put the collection and the playlist next to each other so you don’t have to move the tracks over the whole screen

  2. Comment by IAnjo — August 6, 2012 @ 1:50 pm

    Looks very interesting: I too was a bit disappointed at the continued poor state of the amarok context view, it’s great that someone is working towards a more integrated and visually simpler design, even if some of the customizability of the older design is lost.

  3. Comment by DerWonko — August 6, 2012 @ 2:29 pm

    @1: No need for ruphy to do this, as you can move the views around as you want them. Personally, I like to have the playlist at the right, and context and media view to the left, grouped together in two tabs, because I usually do not need both at once, and want to save space. http://www.wonkology.org/comp/desktop/2012-04-01/desktop2-1.png

  4. Comment by Eric Mesa — August 6, 2012 @ 2:33 pm

    It looks a lot more beautiful. I love the ability to tailor the context view to my needs, but the way you’ve implemented it looks a lot better.

  5. Comment by rabuzarus — August 6, 2012 @ 3:56 pm

    a little bit OT:
    would be nice if the colors of the whole amarok gui wouldn’t be just gray in gray. are there any plans to improve the amarok gui in this way?

  6. Comment by DerWonko — August 6, 2012 @ 4:31 pm

    I like the gray :) But here’s another OT: I often confuse the current song (blue background, black text) with marked songs (blue background, white text). Some different color scheme would be nice here.

    About the context view: I would like to see more things there, like genre and description of the current song.

  7. Comment by ruphy — August 6, 2012 @ 5:37 pm

    Thanks to everyone for the feedback! :) Let me answer some comments:

    @Anonymousse:
    that’s out of the scope for this post, since it’s in the mockups for the whole UI. The good news? It will likely be what you say, with playlists and collections next to each other.

    @rabuzarus:
    yes, absolutely. But the problem seems to lie more in the wrong usage of the blue. Still, we’re going to fix it as soon as the playlist will be qmllified.

    @DerWonko/#6:
    As said above, that will change as soon as it is QMLifiable. I will implement a small “current song information” thingie at the top, but it’s meant to be in another place in the final UI.

  9. Comment by ruphy — August 6, 2012 @ 5:55 pm

    @xpete:
    thanks, it’s definitely something to keep in mind. I will not have this in the first version, since it’s definitely more difficult to implement, but it’s certainly a non-intrusive way to support some kind of configurability in the future.

  10. Comment by rabuzarus — August 6, 2012 @ 6:15 pm

    Well I’m no gui expert and many persons might see it in a different way, but my point of view is that there should be a clear differnce between an area for operations (something like press play, change play mode and such things) which should be gray and an area of presenting the content (e.g playlists, list of all music files.) This area should have been colors with more contrast (traditionally it’s black text on white background).

  11. Comment by cochise — August 7, 2012 @ 6:02 pm

    Dear Anonymous

    http://img831.imageshack.us/img831/9861/imagem4ca.png

    Right click -> unlock interface -> drag and drop panels -> right click -> Lock interface.

RSS feed for comments on this post. TrackBack URL

Leave a comment