Brand new Widgets explorer

Software

The rewamp of the KDE Plasma Desktop is continuing: in the 4.8 release it got a completely new QML based device notifier (already quite improved for 4.9), now a new redesign has landed in master, scheduled for the 4.9 release of KDE Plasma Desktop.

The Plasma widget explorer and activity manager have been rewritten from scratch in QML, giving it s much smoother look and feel, new animations for free and what I love most, a way simpler code base.

By replacing the activity manager and widget explorer with the new implementation, over 4000 lines of C++ were removed (traded with around 1000 of much more readable and maintainable QML): this makes it easier to maintain, easier to spot possible problems, easier to modify and experiment new ideas.

With the rewrite of the various components of Plasma Desktop in QML I expect to slash away most of its C++ code base, making the entry level for contributors significantly lower (and being able to finally close long standing bugs 😉

How does it look now?

QML widgets explorer

And the Activity manager: designed to look as coherent as possible with the widgets explorer:

QML activity manager

Here showing the inline ui to configure and delete an activity

The overall design is almost the same, but the layout has been redesigned to overcome a problem of the old implementation: it looked quite crowded and dirty, because elements were too cramped together, not very well aligned and sizes were quite eterogeneous. Now we paid a lot of attention about the sizes and positioning of the elements, as shown below, everything is positioned along a quite precise grid, that makes the view look less crowded that it actually is.

QML widgets explorer alignment

I a good trend can be established here, for each release of the KDE Plasma Desktop having some element not only rewritten, but its UI becoming significantly more elegant with few but important improvements in the look or in the behaviour.

33 thoughts on “Brand new Widgets explorer

  1. Anders

    I have 11 activities in my current list. With the new layout, they will not fit the screen width.

    Is the layout a result of technical problems, or am I not supposed to see many activities easily?

    Reply
  2. the_madman

    The main problem I’ve had when navigating the Add Widgets dialogue with the mouse is that it’s alphabetically ordered. The idea that Analogue Clock and Digital Clock should be separated by ~15 widgets just seems wrong.

    Ideally, they’d be sorted by the groups in the, “Catagories” menu, with each group indicated somehow.

    Reply
  3. the_madman

    The main problem I’ve had when navigating the Add Widgets dialogue with the mouse is that it’s alphabetically ordered. The idea that Analogue Clock and Digital Clock should be separated by ~15 widgets just seems wrong.

    Ideally, they’d be sorted by the groups in the, “Catagories” menu, with each group indicated somehow.

    Reply
  4. hoho

    Definetly looks better than the old one. It would be nice if the buttons were more “plasma like”, I think they stand out too much. Tagging support for plasmoids would also be nice; the current interface is a bit difficult to navigate if one has many plasmoids installed.

    Reply
  5. Adam

    Please, just use a window with categories and a list, like kcontrol windows. Horizontal scrolling is horrible. Just because it’s “Plasma” doesn’t mean it has to be a shiny, narrow panel which has contents 8 times wider than the screen itself.

    Reply
  6. Peter

    Thanks for your work, looks much nicer now. Nontheless I am the same opinion as the poster before: I find it very unconfortable to scroll horizontally, you know, it is not by accident, that most other software trys to only work with vertical scrolling (browsers, text-editors,…).

    Reply
  7. Kondo

    Same as Adam: this layout has always been a desaster (notmart, don’t get me wrong, this is not your fault in the first place since you only ported it to QML).
    Horizontal scrolling is widely recognized as a very bad idea, and still it’s been used for years now in Plasma (and pretty much exclusively, at least in KDE).
    I’ll never understand why and it seems like it will never be fixed.

    But now that you’re at it, you might want to consider different layouts.
    I’d still prefer a plain old window. With all its controls it is well known, no new concepts to be learned, vertical lists, more natural category selection (e.g. similar to the layout the KCM modules or general config dialogs use: the white bar on the left with symbols and a caption underneath).

    Reply
  8. chr1s

    sorry mate,
    its better than before but still a desaster.
    Just take a look at some other designs from other users or companies, and for the sake of it, copyit – if you dont want to – perhaps a complete different path should be taken.

    Reply
  9. redsteakraw

    This is great, it looks much better. I think there is one thing that could be done to make it even better. It seems that some people don’t like to scroll all that much could there be an option to add rows, or in the case of activity manager add rows when there is enough activities to fill a row. If this could be done it would be greatly appreciated by many users.

    Thank you for the good work and have a happy new year.

    Reply
  10. Scias

    I agree with some of the comments saying that the horizontal scrolling is horrible even with the best possible layout, at least for normal PC users.
    A simple window listing the widgets vertically would be a thousand times better than what’s now and if I recall correctly, it was like this before. I will never understand why you changed it.
    Okay it might be better for touch devices and Plasma active but for a regular PC user it’s just a huge waste of space and time trying to find a specific widget…

    Reply
  11. BartOtten

    +1 for another layout. Only look at the cutoff descriptions (and the useless one: CPU Monitor: A widget to monitor your CPU. NOOOO…..really?) Competition does it so much better. Please rip it 😛

    +1 Activity manager. Much much much better this way.

    “I have 11 activities in my current list. With the new layout, they will not fit the screen width.”

    I have 4 and they would perfecly fit with the new design. 😉

    Reply
  12. Andre

    First, nice work! The spacing makes a huge difference.

    Regarding the comments about the design, I remembered that the widget explorer was originally designed in a GSoC, so I thought that there must surely be some documentation still about the reasons for the horizontal nature. Some searching brought up this blog which documents the progress: http://www.wouwlabs.com/blogs/anniec/

    The first mockups indeed looked different:
    http://www.wouwlabs.com/blogs/anniec/wp-content/uploads/2009/05/img_3842.jpg
    http://www.wouwlabs.com/blogs/anniec/wp-content/uploads/2009/05/img_3845.jpg

    The layout was changed during the runtime of the GSoC, because apparently the other design choices had their own respective problems.

    I also searched for alternative mockups from the community, e.g. on the KDE Brainstorming Forum, but there are none. Or at least I couldn’t find any. So either most people are happy with the layout, or it is too difficult to design something better.

    I’m curious, who/what is the competition that allegedly does it much better, and how do they do it?

    Reply
  13. Lionel Chauvin

    In the first and last screenshots, subtitles are too large. Item content doesn’t look like centered.

    About the layout:
    Why not add one or two row and a vertical scrollbar ?
    You could hide the widget explorer when an item is dragged and show it again when it is is dropped.

    Reply
  14. Aurélien Gâteau

    Looks nicer, but as other says horizontal scrolling is not as efficient as vertical scrolling: our eyes are much faster at scanning a vertical list than an horizontal one. A vertical list also makes it easy to show longer description without reducing the number of visible widgets.

    Actually just taking the existing implementation and forcing it to always open the way it opens when the panel is vertical would be nicer. Or go fullscreen like the beautiful Plasma Active explorer.

    (Just for the sake of beating a dead horse, I made a mockup for a vertical widget explorer in July 2010, but it was rejected: http://agateau.files.wordpress.com/2010/07/add-widget-e1278885892283.png )

    Reply
  15. ri.p

    I like very much the new improvements. I like one row solution, too.

    If we will use more rows (for example, 3 or 4) for the widget explorer, it will occupy half screen and this means we will have less possibilities to drag the chosen widget in the position we want with just one operation… So we will be forced to drag the widget on the desktop, to close the widget explorer and put the widget in the position we want.

    Of course, this may happen with the one row widget explorer too, but this event has a less probability because it is littler.

    Reply
  16. ChALkeR

    Did you test it on a netbook? It will have like 4 apps on a page, instead of a 7 now.

    7 wasn’t to good, either.

    It’s wery hard to find a widget if you do not know what you are searching for. Can you make an option to turn it to multi-row, and the possibility to remove last instance / add one instance to a random place with a click (hover icons) or a right mouse button click?

    Reply
  17. ChALkeR

    Did you test it on a netbook? It will have like 4 apps on a page, instead of a 7 now.

    7 wasn!t to good, either.

    It!s wery hard to find a widget if you do not know what you are searching for. Can you make an option to turn it to multi-row, and the possibility to remove last instance / add one instance to a random place with a click (hover icons) or a right mouse button click?

    Reply
  18. ChALkeR

    Sorry for the flood post, it kept giving me php errors.

    I did not notice that new answers appear from the top.

    Can you please live just one?

    Reply
  19. Ian

    It looks great as far as i’m concerned but i’d also like to see a full page view, i.e. the whole screen filled with the widgets with a left/right scroll – can there be a config option to do that?

    Reply
  20. TheBlackCat

    I like the plasmoid launcher a lot. Will this finally fix the search-bar focus bug?

    For those asking, the reason we have this instead of a window is because a window covers the desktop. This is fine when you are configuring your window decorations or fonts, but when you want to drop things on specific places on the desktop covering the desktop is a big problem.

    A few possible improvements on the design (these may or may not be good ideas):

    1. Like a panel, allowing someone to drag it to another edge of the screen, and have it remembered. For wide-screen displays a vertical strip would be more space-efficient.

    2. Maybe have taller arrows that take most of the height of the widget on the left and right, to increase the size of the hit target.

    3. Make the widget flickable, so you can grab and flick it so it scrolls quickly.

    4. Maybe have the categories show up in the widget explorer rather than as a menu. So you press a button and the widgets list gets replaced by a categories list. You then get the widgets in that category. This would be more similar to kickoff and lancelot app launchers.

    5. Is there any way to get a preview of the widget on hover?

    For the activity browser, I think it is a big improvement, but is this really the best way to browse activities? There has been a lot of good work going into innovative activity browsers in plasma active, it may be time for a rethinking of the desktop activity browser as well.

    For a list of things you want to drag to the desktop, avoiding blocking the desktop is important. But for activities I don’t so the advantage of not blocking the desktop, so a larger, full-screen activity browser makes more sense to me.

    At the very least, is it possible to drag and drop tasks from the task manager on activities to change which activity it is associated with?

    Reply
  21. lazy

    The truth is that kde would need a GUI, such as Android Market or appstore, centralized and divided into categories, which do you choose all the widgets and things to download from KDE-look.org. sarebe would be fantastic and a killer app

    Reply
  22. TheBlackCat

    I like the plasmoid launcher a lot. Will this finally fix the search-bar focus bug?

    A few possible improvements on the design (these may or may not be good ideas):

    1. Like a panel, allowing someone to drag it to another edge of the screen, and have it remembered. For wide-screen displays a vertical strip would be more space-efficient.

    2. Maybe have taller arrows that take most of the height of the widget on the left and right, to increase the size of the hit target.

    3. Maybe have the categories show up in the widget explorer rather than as a menu. So you press a button and the widgets list gets replaced by a categories list.

    4. Is there any way to get a preview of the widget on hover?

    For the activity browser, I think it is a big improvement, but is this really the best way to browse activities? There has been a lot of good work going into innovative activity browsers in plasma active.

    For a list of things you want to drag to the desktop, avoiding blocking the desktop is important. But this isn’t an issue for activities so a larger, full-screen activity browser makes more sense to me.

    Reply
  23. Jay

    Looks nice, but since I had some difficulties with a widget lately, I would propose an additional feature:

    My difficulty was this: when moving a (clock-) widget on the one desktop (while using the “different set of widgets on every desktop” toggle) it suddenly disappeared. the only to find and deactivate it, was to move back to the “same widgets on every desktop” state, where it reappeared an I could deactivate it.

    Furthermore: when looking at the actual widget-explorer it appears as if in the “different set of widgets on every desktop”-state the widgets that were running in the “same set of widgets on every desktop”-state are still active.

    Therefore: how about a list of active widget-instances that could be displayed on right clicking the widget symbol within the explorer with ” on “?
    that way you can find and remove widgets from one place without zapping around and serching for them even in such cases as mine …

    Just an Idea …
    Would be nice to see if thats possible.

    Jay

    Reply
  24. Matt Rogers

    Do the search boxes get focus by default now? The extra click (especially considering the travel distance required by the mouse) is not optimal.

    Reply
  25. David Edmundson

    Yes! That pixel perfect matching up of designs is exactly what we need to see in KDE, especially in plasma which has a lot more flexibility (and hence requires the developer to do more work)

    Adding guidelines to make sure things are lined up is exactly right. 10/10 for me.

    Reply
  26. Kevin Kofler

    > I a good trend can be established here, for each release of the KDE Plasma Desktop having some element not only rewritten

    http://www.joelonsoftware.com/articles/fog0000000069.html

    > but its UI becoming significantly more elegant with few but important improvements in the look or in the behaviour.

    As other commenters have already pointed out, the UI still has the same basic design flaws as before. The dialog from 4.0 was the best UI, maybe not as “pretty” or “slick”, but it was actually USABLE.

    Reply
  27. Andrew Lake

    That’s a great improvement Marco. Especially with respect to spacing.

    I wonder though if there is a design element missing in plasma themes/theme engine. So much plasma content is indistinct from the chrome. Using this widgets explorer for example, the widget choices(content) appear as buttons. The content for that activity explorer look like buttons on buttons. Many plasma list views appear to use the same graphical elements as the chrome elements. So with the default air theme, everything appears to be a wash of grey on grey, widgets on widgets.

    QWidgets have a really clear distinction between content and chrome, with distinctly different color palettes (view vs. window) for each. It is a distinction which I sometimes struggle to find in the plasma environment(s) since it can feel quite limiting when trying to put together a successful graphic design for a UI.

    Just some feedback, intended as nothing other than constructive. Good luck!

    Reply
  28. Shaun Reich

    @ everyone…

    The issue with the lineedit not focusing by default yet looking like it is, was in fact fixed by Marco’s work.

    Reply
  29. shamaz

    First thing : porting to QML is good!
    And one of the most beneficial point is that it’s supposed to be easier to redesigned.
    I concur with most of the commenters about horizontal scrolling. It’s horrible with a mouse wheel : (which is meant for… vertical scrolling).
    I clearly imagine this new explorer widget on the side of screen (right or left…), and larger so that it’s possible to have more info on the widget. From your screenshot there’s not enough room for the description (‘communicate using…’, or ‘view comic strip fro…’. using vertical scrolling you could solve this easily.

    Reply
  30. markg85

    Hi Marco,

    It looks really polished and nice. Can’t wait to get my hands on it to add a few animations ^_-

    QML on steroids for the win, hehehehe. (as long as it makes the experience better!)

    Reply

Comments are closed.