A UX manifesto, universe and everything

Graphics

The next 4 posts were intended to be just one, then it evolved to be quite huge, so it got splitted in 4 posts that will be posted over the next days.

All started when i was working on a mockup for a theme. I am still unsure what do do about it, making a plasma theme (probable), a qstyle, or just a prototype in QML about what would be my ideal(tm) desktop UI.

This is a small glimpse of it, due the mandatory Back to the future quote: “You’ll have to forgive the crudeness of this model, I didn’t have time to paint it or build it to scale”

possible Plasma theme preview

Then this thinghie made me think about the current state of aestetics on all current platforms being KDE or GNOME, OSX, iOS, Android, Windows8, Unity… where they are going, what they try to achieve, if they are achieving it.

Quite a lot for a quick Inkscape mockup about a theme that is admittedly not that original, but maybe that’s actually the point.

It has some important characteristics, that will be quite important in the next posts.

  • It looks quite realistic, I paid attention to the lighting effects of the buttons.
  • It tries to have the least possible visual noise, borders between things are as few as possible, and big empty areas are used to make the various items “breath”.
  • Directions of the drop shadows, while looking as correct as possible, always try to represent a visual hierarchy: the thing that has an higher z-order is always more important. This not only between windows but also in the same window.
  • A theme like that is intended as an unified visual language for everything: consistency is more important than how realistic a particular application looks (hint: an address book application does not have to look like a real address book)

Since some years in KDE there are some projects that share a common goal, such as the Plasma Workspace and related projects, like KWin and Oxygen and Plasma Active; as I’ll talk about, distinctions between those, what they should be their goals and boundaries, are mostly an artificial limit that doesn’t actually exist.

This end goal is to make our software more useful, more easy, more pleasant to use. Computers (any kind of, from a desktop to your watch) should be an helpful tool that help the user to achieve a particular goal, for which the computer has facilities designed to accomplish.

In the next post I’ll talk about some of the central points in the UI design, both as in behavior and cosmetics of the Plasma desktop over the past years and Plasma Active over the last one.

14 thoughts on “A UX manifesto, universe and everything

  1. CTown

    It is really nice and I believe Nuno said in a post not to long ago that he hopes Oxygen is finished by the release of KDE 5:
    http://pinheiro-kde.blogspot.com/2012/01/dot-8.html

    The problem that I see in KDE applications is that applications are not as unified in terms of asthestics since it seems that QML applications tend to use the Plasma theme (or worse, their own colors) and QtWidget programs tend to use the Qt theme.

  2. CTown

    Sorry, I forgot to add that I like how your mockup makes me think of the default Plasma theme, “Air”! So, it looks like it can eventually be a great solution to the problem I just mentioned. But still, I hope Oxygen remains as the default theme for many KDE releases to come.

  3. Ivan Čukić

    This is something people should more often write to you – “You mate, are so insanely awesome, that I’m proud to know you” 🙂

    PA could use a redesign like this. (maybe even more than desktop p)

  4. Brilliant Deve

    very interesting indeed.know all OSs & DEs moved to desktop with hybrid Mobile UI such as (windows8, mac os …. )

    to be this reduce the usability of the system & find it unusable with earlier releases but then they get use to them like them more than the old ones

  5. Bello

    Sembra veramente bello, speriamo sia un primo passo verso un restyling di kde 5 che sostituisca degnamente Oxygen.
    La questione

  6. mohammad

    looks
    very interesting indeed.we know that all OSs & DEs moved to desktop with hybrid Mobile UI such as (windows8, mac os …. )
    to be honest this reduce the usability of the system & users may find it unusable for earlier releases but then they get use to them like them more than the old ones.

    keep amazing us with next four posts.

  7. the Madman

    Very attractive theme, but if there’s any one thing that worries me about it it’s easily one of the simplest things – padding. You talk about how the UI “breaths” because there’s big, empty areas. Be careful – in the past, there has been a problem with too little padding and too much information density, but a lot of people complain about Gnome 3 and Metro because there’s too *much* padding.

    You’ve also managed to change your Trash folder’s icon to a Music folder icon 😛

    Still, this is a highly attractive mock-up that doesn’t diverge too much from the current Oxygen theme. Though I do like the full-colour Oxygen icons used currently, these “3D Monochrome” (contradiction?) icons also make for very attractive candidates.

    Looking forward to reading more about it 🙂

  8. markg85

    Hi Marco,

    You might be trying to make realistic shadows and that might be the case for the actual forward pointing arrow button, but other then that all shadows are unrealistic and imho completely impossible in the real world 🙂

    Let me explain that one.
    The forward button itself has a shadow as if the light light where shining from above (thus you see a shadow below it). That is fine. The arrow within the button has a shadow as if the light where shining from.. all sides :p thus you see shadows on all sides but at the same time you could argue that there should be no shadow at all.

    To fix this and let it look better you should give the arrow only a shadow on the bottom parts. That should make it look a lot better and realistic.

    As for the “active” back button. The same is true for the blue shadow. It’s all around and not from one point/light source. It would be very interesting to see how this looks when you make the shadows act like real life like shadows so all with one light point.

    As for the image itself. I think you like OSX finder 😉

    // begin brainstorming
    What i would like to see or experiment with (what becomes possible with QML 2 and shaders) is to use your MOUSE as the light source and let the shadows in buttons change according to the mouse position. That will certainly give you a feeling that the UI is alive. It might get a little irritating after a while :p
    // end brainstorming

Comments are closed.