To be totally honest, so am I.
(I was kinda hoping you would get it so we both could look smart and insightful )

I THINK that what he's saying is that you can do them in 24x24 because you don't HAVE to do them in 22x22 as long as the icons in the theme are the same size and aligned with each other (same distance of empty space etc etc) it's fine no matter what size they are.

So go with 24x24.

alake wrote:

Full size here: http://wstaw.org/m/2014/02/20/mockup_b4_1.png

I have to say that i like the direction of simpleness, to clean out the interface. But i dont like the overall look. it reminds me to a mix of LXDE and a Microsoft Access 2000 query builder layout i had to use for a long time . It's not what i would use as "the next/future desktop" (I do not want to sound mean :s sorry for this)

since i saw this in in our moodbar, i'm fascinated of it
https://dribbble.s3.amazonaws.com/users/108394/screenshots/576250/attachments/44311/windows_ui_concept_full.png
the next is steam for linux http://www.thenerdfilter.com/wp-content/uploads/2013/03/steamonlinux.png
this is a direction i would like to see a future desktop.

Because i know that the kwin guys has some really cool feature with color scheme syncing of windeco (https://www.youtube.com/watch?v=UNkbWcfswbk) and a lot of people like dark colored windows for multimedia applications (krita, videoplayers, imageviewer, etc) it would be cool to have a simple button where you can switch from a light, to a dark window colored window.

http://i.imgur.com/mGCj7WP.jpg

there is a little search botton in the top left of every window, you can search to application menu with this (in supported applications). Windows in the background goes a little darker (not more translucent, darker). and thats my idea for now.

btw we need something to share/collect good (and free) fonts because my fonts always sucks a lot and i'm to lazy to find new ones

alake wrote:You can see the progress from the top left to the lower right. The lesson for me is: Let the pixels do the talking! Right up until I mocked up the new titlebar on a full app, I was convinced it would look just boring. Yeah, I like the asymmetry of the original but, considered as part of a whole app visual design, I think the new titlebar on the lower right successfully communicates the light, cohesive feeling intended by our mood goals while also affording a consistent tabbed window experience. Let me know if anyone prefers the old one.

Hope this helps!

starting to look quite good, only a couple of comments:

* the scrollbar looking like a slider: besides looking very weird, i'm not sure is possible with qstyle (at least without epic hacks)
* the titlebar: i would really like to keep the same glyphs it has now for the actions, for the usual reason: continuity (sorry, i have to repeat this word continuously, kinda my role )
(quick and very dirty mockup with different glyphs and a bit less ocean of blue, another thing not too fond of)

Ok first off its kind of awesome that we are at that point that we can actually start working and talk about window decorations, comparing them. On the one hand I like the "sea of blue" but on the other I understand the idea of complete windows with the button and panel as something part of the window instead of different.

Martin Grässlin will be added to this little clubhouse so he can have some input on Plasma Window decorations. One thing that we really should consider (and I feel a little bit ashamed of) is that he said "You can be really radical with the design" - as a designer when a dev says that to you instead of "wth are you doing, are you insane?" we should start concentrate on being a tad more extreme in our ideas

Hi all,
This message is a bit of a recap of the whole thread, the part strictly regarding the Plasma theme (that is the part we need more urgently since it would be included in the first release for sure)

We had several ideas (personally i like a lot the last posted by alake) so i think it may be time to start sketching them for real.
What i would propose is the following:
* open a scratch git repository on the KDE infrastructure
* starting from the current air theme (because is the one we are sure is complete) and starting to replace elements
* obtaining a series of iterative prototypes until we have the real thing

For who has already some experience in creating a plasma theme this should be quite easy, since the new theme should be (at least at the beginning) ~90% compatible with plasma1, so it will be possible to try it in a plasma1 system

I realize that somebody here will already had some experience with Git, while somebody will be new to it, but we'll keep things simple so should be easy for everybody to get up to speed (and learn a new thing in the meantime, that is always good

Hi! You've got really nice mockups here, so I would like to share some of my insights. But first, since I don't belong to neither the Visual Design Group or the Plasma team (hey Jens said it's fine that I post here! ), I would like to introduce myself a bit. Feel free to skip this part.

Introduction wrote:I'm Hans Chen from Sweden, currently doing my Ph.D. in United States. I'm a long-term KDE user and have contributed to various parts of the projects, but didn't belong to any "group" until I joined the forum team. You may have seen some of my posts on the Planet, such as my vision on activities, or maybe you open your application menu with ksuperkey?

Anyway, it's always been in my interest to help with increasing the polish of KDE workspace and applications because I believe that's what KDE workspace/applications currently need the most. I love the direction you seem to be heading at - I've always been a fan of simplicity and flatness - and am excited to see what it'll all lead to. Unfortunately the Visual Design Group formed at an unfortunate time for me as my free time is very limited at the moment. I would still like to offer my ideas and suggestions, but as I'm unlikely to do any real work, please take from my comments what you think is helpful, and feel free to ignore the rest.

Now to the real deal - I would like to focus on window decorations in this post. (I started working on a mockup but it didn't turn out very well. Maybe I'm getting rusty...)

General comment about all mockups: It would be nice if they included a more "exotic" application, such as a black terminal (Konsole).



I think this looks neat, but there are some concerns:
1. It takes up more space than necessary, in my opinion.
2. I would prefer the buttons to appear near the top edge and top corners. That'll make them easier to hit if the window is at the top edge of the screen.
3. How would this look for applications that don't follow the colorscheme, such as a black terminal (see general comment above)?
4. The minimize button reminds me of a download button. As silly as it sounds, I can see people getting confused by that.

My idea was more in line with what plusfabi and notmart proposed.





Yes it doesn't stand out as much, but I agree with Ivan that the window decoration should be one of the least interesting parts of the workspace. I personally prefer the old-school glyphs ( _ □ ✕). The "Oxygen" glyphs imply a direction for minimize, when in reality the taskbar could be anywhere, and it seems a bit strange to me that "v" isn't the opposite of "^" (i.e., "^" is used to maximize but "v" isn't used to restore the window). But I can see notmart's point of keeping the continuity.

Oh, and finally a small point: I can see a lot of users complaining that the application icon is left out of the window decoration ("it's an important visual clue to find the correct window!"). Don't know if you want to add them or not, but it's something to keep in mind.

By the way guys, I noticed that many of you have uploaded two versions of the same picture, a thumbnail and a full version. To save you some trouble, you can instead use

Code: Select all

[thumb=720]http://url_to_full/image.png[/thumb]

for example:

Code: Select all

[thumb=720]http://i.imgur.com/mGCj7WP.jpg[/thumb]

"720" is the width of the image in pixels. I believe this was implemented by our forum staff, so it's not documented in the official BBCode documentation.

Hans wrote:Oh, and finally a small point: I can see a lot of users complaining that the application icon is left out of the window decoration ("it's an important visual clue to find the correct window!"). Don't know if you want to add them or not, but it's something to keep in mind.

yes, it should still have the application icon.
now, window decoration buttons are configurable, so whether the icon button is present by default or not is secondary, but should be there when the user puts it in the titlebar.

On another topic, now that the direction is taking shape, is probably good to have separate discussions for the widget style, the window decoration and the plasma theme (that are actually 3 different things)
even if they'll end up being the same big style, right now we mostly need the plasma theme, the other two is good that the discussion starts (and most important that people that can implement them are gathered), but we don't need them yet for the first release.

About Plasma theme before we open another thread on it, which we should, we need to figure out how to replicate it.
Otherwise anyone working on it will be flying blind and simply hope it works in the end.

So what's needed is not only a solid way to create mockups (which we kinda have) but also an exact definer on how the SVG elements need to be set to get that look. You've said that when finishing them up we need to set them to 20% opacity which will, in combination with the number crunching, produce the correct result - but is there anything else we need to do?

As it is we need to create a working theme for Plasma CURRENT I think, something to work on, in which case I suggest following Fabians pointer and just set opacity for 95% and pretend its the same effect - its not the best sollution but with mockups faking the effect and the prototype perhaps it might work.

jensreuterberg wrote:About Plasma theme before we open another thread on it, which we should, we need to figure out how to replicate it.
Otherwise anyone working on it will be flying blind and simply hope it works in the end.

So what's needed is not only a solid way to create mockups (which we kinda have) but also an exact definer on how the SVG elements need to be set to get that look. You've said that when finishing them up we need to set them to 20% opacity which will, in combination with the number crunching, produce the correct result - but is there anything else we need to do?

yes, but this just for the couple of elements that will be used as window backgrounds, most elements are internal widgets such as buttons and so on, those wouldn't really be affected by the opacity of the windows.

jensreuterberg wrote:As it is we need to create a working theme for Plasma CURRENT I think, something to work on, in which case I suggest following Fabians pointer and just set opacity for 95% and pretend its the same effect - its not the best sollution but with mockups faking the effect and the prototype perhaps it might work.

Yes, that would be fine, a working plasma1 theme would mean ~90% of the work done.
now, if for you guys is ok, i'll put up in my scratch area a git repo (any suggestion for the theme name?) with the current theme, and there elements would be slowly replaced.

Hans wrote:Yes it doesn't stand out as much, but I agree with Ivan that the window decoration should be one of the least interesting parts of the workspace. I personally prefer the old-school glyphs ( _ □ ✕). The "Oxygen" glyphs imply a direction for minimize, when in reality the taskbar could be anywhere, and it seems a bit strange to me that "v" isn't the opposite of "^" (i.e., "^" is used to maximize but "v" isn't used to restore the window). But I can see notmart's point of keeping the continuity.
.

_ □ ✕ also suggests the position of the taskbar... thinking about it, - □ ✕ would work... and that's kindof funny, since is what it was used in kde1 and 2 more than a decade ago.. ah the cyclical universe

Ok the reason for the chubby icons where my call because we need to weigh up the different aspects of the desktop so it doesn't become too sharp. Andrew followed my lead there in a lovelly way and I don't want to scrap his idea completely so for now try to work either with it or based on it (I kinda like the idea of non-stereotypical icons too).

About Git, go for it. Also concerning Plasma Theme, I'd love for Fabian (Plusfabi) and Andrew (Alake) to take lead on that together (not excluding anyone (everyone can be a part etc), just that they are capo di tutti capo for that bit) if they are both ok with it. They are both really good at what they do and since we just got one member more (I'll do a proper announcement tomorrow, for now: its Uri Herrera who made the Nitrux icons, Compass icons and Flattr icons who will co-design the new icon theme with Acid!!!) I'd love to set up the Plasma theme as fast as possible to get a good head start on things now.

Tomorrow I'd thought of getting some threads up here split into Plasma Theme Work, Icon Work, Window Decorations, Layout Ideas etc... (or if anyone feel like taking that)

Marco: Concerning git, go for it handsome!

I tried a few updates based on comments regarding continuity and the "sea of blue".



I also wanted to see how it might look if we allowed the close icon a little bit (just wondering if a squared icon might anchor the visuals a little better on that side... although there may be enough visual anchoring there as it is).


I forgot the close button on the tabs again so use your imagination.

A few other thoughts in response to other comments:
* I respectfully reject the notion that the window title is the least important part of a window. The window title is the anchor of the visual and information hierarchy for a window. A window, including its title, is a single, cohesive collection of information presented to the user. One of the (many) things love about Nuno's work on Oxygen is that the window title wasn't just an afterthought - it was considered part of the window. Now we have an opportunity to take it to the next step by reclaiming the real, hierarchical value of the window title. That doesn't mean the title needs to overwhelm everything, but it should have enough visual characteristics - consistent with the design theme - that make it more than just another chunk of text just incidentally present in the layout.

* Window buttons really don't need to be stuffed in the corner or against the upper edges when the window is not maximized. The titlebar and the clickable button area can easily be handled differently for a maximized window to address our FItt's law concerns. Windecs (on all platforms) already do this today.

* Scrollbars. Yeah Marco, I was just playing with the idea of something that's not too heavy visually but still provides a decently sized handle. They're similar to the scrollbars on some Unix systems I used in college. I'd definitely like to avoid the annoying disappearing handle that Ubuntu uses. I'll keep playing around and share other ideas as well.

* Plasma theme. Marco posted some controls design which I think would work just fine with our design goals. Translucency's been agreed upon. Lighting and shadow, we probably still need to finalize, but the basics are there. So from a technical plasma theme-ing standpoint I think we have most of what we need (still need icons?). From an applet design standpoint, well we'll just have to tackle those one at a time. I posted a few mockups here so far. I've done my fair share of plasma themes so, if there's really no one else to gen up the theme, I can certainly chip in. Also, yeah we can probably start breaking these mockups and sketches into separate threads now - so long as we keep the full picture in mind

* There are some aesthetic goals of material, lighting, whitespace, etc. that can be helpful when coming up with some designs. Jens, are we far enough along to post a thread with these high level goals? It might serve as a good reference point when crafting and discussing mockups inthe different threads, so we don't run off too many directions visually.


Straddling this line between continuity and change is quite challenging. No worries though, we'll keep plugging away at it till we get it!

alake wrote:I tried a few updates based on comments regarding continuity and the "sea of blue".

The version on the right with the blue line under the title/buttons is.. intriguing (in a good way, really)

alake wrote:* Scrollbars. Yeah Marco, I was just playing with the idea of something that's not too heavy visually but still provides a decently sized handle. They're similar to the scrollbars on some Unix systems I used in college. I'd definitely like to avoid the annoying disappearing handle that Ubuntu uses. I'll keep playing around and share other ideas as well.

ha! I think I know what it was, I used it as well back then.. Sun OpenLook
http://en.wikipedia.org/wiki/OPEN_LOOK

(btw, i'm fine with those, i just fear pain for doing them in QStyle. maybe is possible... but as some kind of epic hack probably )

notmart wrote:_ □ ✕ also suggests the position of the taskbar... thinking about it, - □ ✕ would work... and that's kindof funny, since is what it was used in kde1 and 2 more than a decade ago.. ah the cyclical universe

True, and I was going to comment on that but thought it got a bit too long. While "_" implies that the taskbar is at the bottom, I think it's less explicit than a down arrow and also illustrates what will happen to the window (it'll go from □ to a _ in the taskbar). But yes, - □ ✕ is an alternative as well.

alake wrote:

I'm a fan of the left window decoration!

alake wrote:A few other thoughts in response to other comments:
* I respectfully reject the notion that the window title is the least important part of a window. The window title is the anchor of the visual and information hierarchy for a window. A window, including its title, is a single, cohesive collection of information presented to the user. One of the (many) things love about Nuno's work on Oxygen is that the window title wasn't just an afterthought - it was considered part of the window. Now we have an opportunity to take it to the next step by reclaiming the real, hierarchical value of the window title. That doesn't mean the title needs to overwhelm everything, but it should have enough visual characteristics - consistent with the design theme - that make it more than just another chunk of text just incidentally present in the layout.

Sure, when I wrote "least important" I meant that the actual window decoration doesn't need to stand out that much in my opinion. In the previous mockup I felt that the decoration dominated the whole application, overwhelming the actual contents that the applications were showing. I think your new mockups are much better in this regard!

alake wrote:* Window buttons really don't need to be stuffed in the corner or against the upper edges when the window is not maximized. The titlebar and the clickable button area can easily be handled differently for a maximized window to address our FItt's law concerns. Windecs (on all platforms) already do this today.

I thought it would make it easier to click on the buttons when the window decoration is at the top edge of the screen. Seems like that isn't the case - so I agree.

From a technical point of view I wonder if it's possible to show the application icon without the blue background, but well, that's not really the point of this discussion right now.