One old Sawfish theme I always admired is "Friday". I liked its concept of having its window manager buttons shaped after the purpose they served (the Min button was a triangle looking down, and the max button a triangle looking up). I modified the theme to my liking (undoubtly it could still be done better by a pro graphics person) and here is its mockup. Update: An alternative design, possibly much better.
Post a Comment
the concept is a good one. the look should accentuate the functionality. if i had to suggest improvement, i'd suggest making the buttons look more like they are part of the title bar, maybe have a 1-3 pixel space between them tht brings out the title bar again, and maybe using the blueish grey of the title bar for the center of the buttons instead of glaring white.
>and maybe using the blueish grey of the title bar for the center of the buttons instead of glaring white.
For me, the most important thing is clear and clean interfaces. Making these buttons anything but white (even black doesn't stand out well, I tried), will make them hard spotted.
> maybe have a 1-3 pixel space between them tht brings out the title bar again
I don't understand what you mean. A mockup please?
I think he means that the 4-pixel window frame should run around the buttons on the right hand window side like it does on the button on the left.
Aaah. I don't think it will look good. It will be difficult to implement and it will look weird because it will be diagonial, and it will also take lots of space /me thinks. 
I think what Anonyposter meant was something like this?
http://209.15.63.121/friday.png
Yeah, not sure it looks as clean and the buttons are not as big this way (buttons should be clean and clear as they are frequently used, also for accessibility reasons).
That Anonyposter mockup is much nicer
You forget the most important aspect of good button design; target size.
We must keep in mind that by having a triangle shape, we are limiting our target "landing area" of the shape to inside the shape. Try quickly moving the mouse and landing on any pixelspace just inside any of the tip areas.
This problem is compounded by the fact that there are other buttons immediately next to the target button, mere pixels away, so you end up having to drive for the center of the triangle, further limiting your available target area.
It's a nice idea, from an asthetics point of view, but surely not as practical as allowing a more robust shape to be used like current buttons.
Or icons. Look at any icon in the toolbar of your browser. Notice that they have mostly square shapes, even in the transparent region around the image? There's a reason for it. It makes it easier to target the button, and saving just a little time and effort when selecting the icon.
-Chris Simmons,
Avid BeOS User.
The BeOSJournal.
No, it takes away much of the overall size of the buttons. This is something I wanted to change from the original Friday theme as well, as most people in the OSS world, when they design themes, they don't take into account accessibility. If someone can modify the theme to make it as the anonymous suggested but not in the expese of accessibility, then sure.
I think Eugenia's mockup looks great... if this was done I might just port it to Waimea. The port would also work in the three *box windowmanagers because the Waimea theme engine borrows much from them.
Also, I think the order change is just mucking it all up.
>You forget the most important aspect of good button design; target size.
I do not forget it, and I DO agree with you about its triangle shape being problematic. However, I always liked that Friday theme, as being a very "different" one. At least I credit that German guy who first created it, as having a pretty "original idea" overall. 
And because I don't forget that the triangle shape is already problematic, this is why I don't want to give in to the people's requests to make the buttons even smaller as suggested here: http://209.15.63.121/friday.png
The buttons have to remain pretty big-ish, otherwise their triangle shape is really a pain.
>Also, I think the order change is just mucking it all up.
The original Friday theme had it the other way around: max, min, close. I changed it, because I was always keep pressing the wrong triangle.
Also, the original Friday, was only 20 pixels high, and while I know a lot of people in the Unix world liking thin window managers, I will have to again beg for accessibility in this case.
I think anon. was saying to add borders to the buttons, not make them smaller. I'm sure they only made them smaller so as to more quickly get the mock up online. Kinda dumb to assume smaller's better.... unless it was obviously too big to begin with.
Just a tiny thing, but that alternative design is much better except for one annoying little detail. On the left-hand side, the raised bar that runs under the titlebar is joined with the left-border bar of the window. On the right, it is separated.
Where? I don't see it.. Please upload a mockup with an arrow showing the problem... (please note that I have uploaded a newer version of the alternative design in the past hour, so make sure you reload or empty your cache)
Why not change the title to "Contest: Create Theme!" Grandprice - two books by O'reily. [details]
Makes people more interested IMHO
Aah, never mind. Image must have been cached It's all good now. Very nice look btw
Hmm, are you sure that you can set a default icon in Metacity? Would it be a problem if this isn't possible? Or is there some other theme which does it?
THAT IS THE MOST HORRIBLE THING EVER. i really *HATE* the red yellow green bullshit in os x aqua. it is stupid and countar intuitave. what does green mean, go so get bigger? that does not make sense! yellow is the color of caution, so be cautions because we are about to get smaller?
seriously, the square buttons are tried and true formula! round buttons in os x aqua are gay and you have to mouse over to even figure out what button does what?! why not keep the symbols on all the time mouseover crap is stupid.
while the jacked up triangle design is better than aqua IN THAT RESPECT, i mean, at least you know what button does what, why keep the crappy colors? and why not just have big square buttons with arrows on them like win3.1 used to do. microsoft's new designs are great too, i really really like luna's buttons, there is absolutely positively no way of mistaking what they do.
the new design is better because of square button, but please fix the design on them the circles do not do it for me! hell even aqua's stupid + and - and x are making more sense.
if u ask me the real future is in gesture based window control systems where you don't need no stinky buttons to tell the window what to do, u gesture on top of it and it gets bigger or smaller or whatever u want it to do.
The logical button order would be Max, Min, Close,
or the other way around. (Microserfs.. 
Triangles don't mean the same thing to all people, direction-wise. What's more, up/down arrows only work on desktops that minimize windows to the bottom of the screen, a la Windows taskbar. (same with [_] minimize icons)
I have to agree with the people who perceive triangles as harder to hit with the mouse.
I actually quite like the larger circle for maximise, and the smaller for minimise, I think it works well. When you look at the two next to each other, the sizing automatically makes you think 'larger' or 'smaller'. It works well, and I much prefer the second design over the triangles.
I would very much like to see that concept made into a theme, not only for *nix WMs but also for XP.
It is just a window decoration. There is much more to do for a full theme. But I would really like to see a full theme designed by you, eugenia. That would be much more constructive than just critizising kde usability without offering alternatives. Maybe it would even replace dotnet as my favorite theme.
Maybe that's why the title says "Window Manager Theme". :p
I should be finished soon, turns out quite neat so far.
So, just because something is different from what you're used to, you refuse to try anything else?
Crawl back under your log, troll...
I don't know if I like the idea of color coding the 3 window operation buttons...for one, the color coding is probably not universally recognizable across international borders. As for functionality, the second mockup looks very similar to the metacity-iris theme here: http://art.gnome.org/show_theme.php?themeID=202&category=metaci... It's just using squares instead of circles. Even though it's quite spartan, I still like it for it's professional feel...and a little nostalgia.. I definitely like more than MS's current trend of 'fisher-price'-ifying the desktop.
Its always interesting to hear people moan about "reduced button target areas" and rectangular hit areas when its VERY easy to code for non-regular areas. All you need to do is create an invisible layer representing the button area that holds a colour map to the button area (one colour per button) and determine function by colour.
step 1. create colour map / hit area (allows for function linking - eg 2 minimize / scroll / whatever buttons)
step 2. intercept mouse position over button area
step 3. extrapolate position from step 2 over colour/function map (this allows for scaling also) and execute appropriate function.
There must be plenty of programmer using this out in the OSS world - i'd be very surprised otherwise...
This is something I wanted to change from the original Friday theme as well, as most people in the OSS world, when they design themes, they don't take into account accessibility.
Most people in the OSS world make a theme for themselves if they want it so badly, instead of asking other people.
People are not moaning about the difficulty of coding non-rectangular buttons, instead, they are moaning about the usability of such buttons:
"I'm working in my window and I am annoyed and want to maximize my window, so I move my mouse quickly to the maximize button and as I start to get closer to that button I will have to start exponentially (or is logarithmically) slow down so that I do not end up at the small upper side of the triangle where I might just hit the close button instead because I don't have enough area."
That's why the original buttons were so big because midway up, the button does no matter, no one will ever reach that place to click; because a user can only hit that close button instead so many times that he gets annoyed by it, and eventually change the darned theme.
After trying tooooo many themes, I am convinced that square buttons are just plain more useable (that is if you want to use the window and not just stare at how lovely it looks like)
One problem I have with window manager themes in X is that when a window is maximized I can't just "throw" the mouse to the upper right corner of the screen and hit the button to close the window, like I do with Microsoft Windows. I would like to see a theme that allowed me to do that, I mean, that let me kill a maximized window by clicking on the pixel on the top right of the screen. If I remember correctly, that is one of the four easiest places to click. :-)
> The original Friday theme had it the other way around: max, min, close. I changed it, because I was always keep pressing the wrong triangle.
This suggests that the shapes and colors don't matter so much then....
And I agree with the poster that mentioned mouse gestures. Like the scroll wheel on the mouse, once you've used it, it's really hard to give it up. I've "used" them accidently a fair number of times in IE.
pj
I can do that with the default theme in IceWM. You mean get the mouse in the very uppermost, righhand corner of the screen to close the current maximized window, right?
Works fine for me.
Ok, so I agree with you in that the buttons should be clearer. I like the concept of a minimize button that is an arrow pointing down. But the maximize button? Lest you've forgotten, that button (in windows and in gnome - I think in KDE as well, but I'm not sure?) also acts as a "Re-windowfy" button. As in, when you maximize a window, if you want it to be a window again, you reclick that button (in gnome, it's context sensitive - as in, the icon changes to a windows icon when you maximize a window). This up arrow, down arrow thing doesn't seem to include a provision for that, and even if the button has the same behavior, I think its even more confusing than the Windows style, no context change, way.
I'm all for accessibility, but complicating things even more isn't the way to go. I really like this idea of the arrows, but I think I'd like them implemented the gnome way (square buttons that are context sensitive based on state).
http://server204.serverflex.de/Snapshots/Screenshot-Gimp.png
Not quite finished yet but close. Hope that's ok.
While the alternative one looks better and more usable than the original, I don't really care for either. At least on the alternative one you've got a wide section of button to click -the triangular ones would be hard to click "on the fly"
They both remind me of a Beos window meeting one of Gnomes dark "metal" looking themes, with a color-handicapped version of Aqua (You know... "When I say red, I mean RED") thrown in for coloring.
Not saying that the idea's bad, but I would never consider such a theme/decoration. I much prefer cool, modern looking decorations (such as Liquid or some of the Aqua-like themese showing up for KDE). This looks too much like a cheesy Beos knockoff to me.
Rather big screenshot, 684k:
http://slider.rack66.net/~mechanix/shots/friday.png
I tried it without the background fill on the menu icon too, and must say it looks alot better that way. IMO.
that's turning into a really nice theme....please tell me someone is going to submit to art.gnome.org when this is over
Karl
Gentlemen and ladies, I present to you... Friday. In pure XML form (okay, so the buttons are standins to see exactly how I could get it to work.) I am working on the alternative buttons as we speak, but I assure you that this is far superior to the bitmap imitations, and will prove to be much more robust in the long term. Consider the contest over. (No, I'm not really a jerk, I just like to pretend to be one on Thursdays... after working 9 hours and seeing someone with the gimp pop out a cheap hack.)
http://www.inductiveart.net/pureFriday.png" http://www.inductive...
Download at http://slider.rack66.net/~mechanix/MCity-Friday.tar.gz, btw.
Actually, it looks alot nicer than it really is. The colors are not lively enough in normal state, and to cheesy in highlighted/pressed state.
And the small border, as someone already pointed out, makes it look like a MWM derivation. So did we really need another theme only to make metacity look like a 15y old windowmanager? ;-)
There are three issues.
1) No shadow text
2) Your border-only window is a cheat
3) It breaks with different font sizes.
2 and 3 are also my remaining issues.
<knee-jerk>
Contest over? Didn't you forget the color-schemes?
And btw... "seeing someone with the gimp pop out a cheap hack". So how do we tell yours isn't? Where can we download your version?
</knee-jerk>
Seriously though, I think the screenshots you linked actually look better as they are right now, without the missing parts (button colors, the menu button box). Nice work.
As for usability of those triangles, everyone knows real men, and women too, use keyboard shortcuts for window actions
If this indeed scales well and has no other issue, then I pull my hat, but release first. Besides, the triangles suck.
These look terribly unappealing to the eyes. I personally enjoy a more blended desktop feel. These mockups are just glaring. The clash between the button colors is brutal on my eyes.
I guess some people prefer for things to stand out a lot more, but it just gives me a headache. The button design could be nice, but not without some nicer color scheme.
> 1) No shadow text
Trivially fixed.
> 2) Your border-only window is a cheat
How so? (I didn't know squat of metacity themeing before I started this, so I have no idea why it would be a cheat)
> 3) It breaks with different font sizes.
Ah. You're right. I'll have to look at that.
If I remember correctly, that is one of the four easiest places to click.
No, it's the next four easiest.
One idea I'm not aware of anyone trying is proportional window buttons. If you think that's an odd idea, consider how odd it is that the buttons are so damn small when so much dead space is available. Up to a quarter of the title bar could be used per button, especially if they appear on a mouse movement event, though it creates other issues...
mechanix
"How so? (I didn't know squat of metacity themeing before I started this, so I have no idea why it would be a cheat)"
Because there is no border? The name is "border-only", not "border-less".
I gave up btw, your attempt is clearly the better one (if you make it scale like Bluecurve now )
If you want to make it 100% correct, you should check the Button Layouts tab though, the spacing to the left is not very nice, maybe you can get rid of this too?
Luckily there is good online documentation for C# heh.
Charles
"One idea I'm not aware of anyone trying is proportional window buttons. If you think that's an odd idea, consider how odd it is that the buttons are so damn small when so much dead space is available. Up to a quarter of the title bar could be used per button, especially if they appear on a mouse movement event, though it creates other issues..."
I don't think that's a good idea, because your buttons will constantly change size and even location then... That would most probably not be worth the gain. I rather use themes with large buttons by default or themes which scale so I can set a large font to get big fat buttons. I do that with Bluecurve for example: http://server204.serverflex.de/Screenshots/Screenshot-Epiphany-bin....
ok quick test for you. jam your mouse into a corner. see how long it takes you. then try manuevering your mouse onto a minimize or maximize button. see how much longer that takes?
how bout someone making a hack, that creates an ALWAYS ON TOP, ALWAYS UNFOCUSED 1 pixel window in each corner. The top right corner can trigger a WINDOW CLOSE command. The top left corner can trigger a WINDOW MIN command. The bottom right corner can trigger a WINDOW MAX command.
Sure it would take 5 minutes to get used to. But once realized, it basically creates a GESTURE for the gadgets (jamming a mouse off limits), and theoretically could replace the gadgets eventually, although I'd prefer them staying.
As of right now, on my WinXP, those corners aren't used by anything but borders.
(all commercial rights reserved)
There is a problem with this theme:
there is no way to tell if the window is in maximazed state or not. the Big circle always looks the same.
Yeah, I checked out your theme, actually. Nice. A bit early to be labeling it Friday, though. As far as I can tell, it's still Thursday.
http://www.inductiveart.net/MCity-Thursday-0.666.tar.gz
First of all, jamming your mouse into a corner isn't always fun on a 1600x1200 desktop. I'm certainly faster at aiming at a medium sized button near my cursor than to travel the mouse all over the desktop.
I think that Bluecurve already can do this with maximized windows but I cna't completely test this without deleting my menu panel. There is certainly no border anymore between close button and screen edge.
In GNOME, the corners are also tried to be used for more general functions. For example the menu panel will give you a window list in the top right corner and the applications menu in the top left corner. It is also common practice to place the foot or K menu in the lower left corner where the mouse can be jammed against.
I don't think it would be a good idea to reserve those corners for something as trivial as minimizing or maximizing your window. It wouldn't be logical either.
Give mine a shot. You might be pleasantly surprised. Of course, you could also be terribly confused and mollified that anyone would release crap like what I just hacked out, but hey... we're all (un)professionals here, right?
BTW, try to find GIMP in that 18k of XML. I dares ya.
Checked it out already. Pretty nice XML work. But it seems that it doesn't work so well for the button images.
The rounded edges also look more "cut-off" than anything on white background and some other issues you are certainly aware of.
It also has the same font scaling problems. This is getting really interesting.
This is really amazing. The article was for a contest, not a critique. I know that a few of you that posted know how to design a wm theme. The rest of you just need to go to the store and buy a couple of books. Then design the theme that _you_ want, and offer another contest with those books for _your_ theme.
It's really pretty simple, don't you think?
So where's your theme, hotshot?
The only reason why the "Slashdot" part of your slug line holds true is because of armchair critics like yourself. If you want to complain about the problem, do so by contributing, not by furthering the downward spiral.
Yeesh.
>Why don't you make a full theme?
I already have, months ago. But only few people seen it.
So, how many people are working still on it? Three? Please email me with your status, so we can discuss who gets what book.
Will your theme be available any time soon? I would love to try it out.
Does anyone have a suggestion how to take care of the maximize button issue in the alternate mockup?
I've fixed the scaling issues with different title bar sizes. (Small titles still look somewhat odd, as the buttons become rectangular rather than square)
> The name is "border-only", not "border-less".
In that sense you're right. However, I simply like borderless windows better. The border on borderonly windows, when there actually still is a border, doesn't serve any purpose at all.
How about a black dot inside of the white circle when the window is maximized.
"In that sense you're right. However, I simply like borderless windows better. The border on borderonly windows, when there actually still is a border, doesn't serve any purpose at all."
Aren't those windows supposed to be resized? Actually I have no clue and am wondering what they are used for.
Mechanix, also please take care the "one pixel off" that all four corners have...
It works great btw. I am using it now. Thx.
>Will your theme be available any time soon? I would love to try it out.
I never coded it. I did that design for another OS (not linux) but as I left that project 2 months ago, I might take a look at doing it for GTK+ or QT.
"Mechanix, also please take care the "one pixel off" that all four corners have...
It works great btw. I am using it now. Thx. "
If this is possible, probably not... Metacity doesn't support translucent areas, all you can do is to make the corners rounded. But if I understand it correctly, it will use the bordersize to determine how much it is rounded, so there is probably no way to get this "one pixel off" without making the borders very thin. Unless there is some trick.
As Spark said, there appears no way to do the one pixel off. That's why I didn't have it in the first place.
The closest is simply not drawing anything there, which gives it some sort of default "window fill color" (which color exactly depends on your gtk theme). It's the same color you can see when e.g. unshading (rolling down) a window on a very slow system, before the window contents gets redrawn. But it's not really nice that way, the corner pixels look like visual artifacts.
Why not use the .png files for the corners as transparent for that specific pixel? Wouldn't that work?
Considering transparent pngs don't give holes in the window in other places (even when not drawing anything underneath- I've been there when I started this theme), I am fairly sure it won't work that way.
And while rounded borders might work for the top corners, if you cheat with what are borders and what is the main body of the titlebar, there's no way to cheat at the bottom. So that's a hack which can only get you halfway there.
I c... How is Mandrake doing it for their Galaxy theme under Gnome?
BTW, are the last remaining issues being worked out? If yes, guys please email me as to what book you want and which address to send it.
Galaxy is simply using the "standard" rounded edges just like Bluecurve. To make them possible, Metacity is probably using a shaped window surface but you can't control the radius unless you change the border size. Metacity could probably support more kinds of shaped surfaces (like some other windowmanagers do), but I don't think Havoc wants to spend much time working around current X limitations.
I just uploaded a version I'm happy with for now. I don't think there are serious issues left with this one. Url is http://slider.rack66.net/~mechanix/software/MCity-Today.tar.gz
(Though onley a few minutes away now here, it's still not friday yet :-)
Awesome, that's one hell of a quality job. I'm just still a bit worried about your borderless border only windows.
Maybe slightly more spacing between title text and borders?
This is a decent WM theme! A couple of things I'd like to see, perhaps in a different version of the same theme. I'd like to see the theme follow the GTK theme colors, and the buttons match that color unless moused over. Would that be easy to do?
it should change the colors following the gtk2 colors theme
>the buttons match that color unless moused over. Would that be easy to do?
That was in my original mockup. I changed it to the colorful buttons because it was looking blunt and boring as hell. Trust me, is worlds better with some coloring.
> I'm just still a bit worried about your borderless border only windows.
I really don't understand what is that.
I hope Havoc adds support for a default "icon" when there is no icon supplied, and also for the 1-pixel-off thingie... I will email him later about this.
It is really not obnoxious.
The default theme, when you don't mouse over it, its colors are really "not strong". If you take all this coloring away, it is truly hard to distinguish which one is the focused window.
Have you tried the theme btw?
Yup, I'm using it now. I was using Metacity "Simple" before, and "Bluecurve" before that. I'm just simplistic I suppose lol. I really like it other than those two little things. Maybe I'd like them better if the minimize and maximize buttons weren't different colors. hmmm..
I modified the default button colors to #848AAD and left the highlight and click colors alone. I REALLY like it now! Just have to figure out how to set it to use GTK. :-P hehe
>screenshot?
Here:
http://img.osnews.com/img/3476/today.png
Check the Galeon window, which is the focused window. The grey-ish windows are unfocused. However, the main Gimp window, has its "close button" mouse overed, this is why it has the red color.
Aitvo, upload a screenshot of your setup.
BTW, there are still three problems with the theme, which probably won't get solved, as Metacity doesn't support them:
1. 1-pixel off the corners. Are we sure transparent pngs won't work? I think I've seen some such metacity themes... :o
2. Set the minimum height for the window manager, because if you select a very small font, the 16x16 icon gets squashed as the window manager resizes the bar.
3. Change the default icon to a custom one, if the application has no icon.
Haaavoooc...
Here's a window using the modified version of the theme.
http://www.fewt.com/desktop/Today-changed.jpg
I can roll it into a tarball as well if you want.
http://www.fewt.com/desktop/Today-Flat.tar.gz
I think the author of the Today theme did a GREAT job, and definitely deserves the prize! :-)
Uhm. Isn't it a bit weird to highlight the shaped button and eventually declare someone who gave up on that concept the winner? That's pretty arbitrary. Not sure this "contest" isn't just abuse of this site's popularity. Well. No, this is not a troll post, it's just an opinion. I usually enjoy reading OSNews.
BTW, I really like Red Hat's BlueCurve widgets combined with KDE's ModSystem window decoration and the KDE 3.1 Default colorscheme. It's a very clean, space-saving, good-looking combination: http://www.eikehein.com/linuxdesktop.png
>eventually declare someone who gave up on that concept the winner?
No, the winner is the one who delivered a theme first, before the others, and CLOSER to the original mockup. Someone else did a first tar file, but it was nowhere near the clean state of Filip's effort and the mockup's.
That looks terrible.
>BTW, I really like Red Hat's BlueCurve widgets combined with KDE's ModSystem window decoration and the KDE 3.1 Default colorscheme. It's a very clean, space-saving, good-looking combination: http://www.eikehein.com/linuxdesktop.png
I love the concept of a contest where the object is to code a small open source "app/theme/..."
instead of randomly giving away a book, something creative has come out of it. Good idea!
I like the theme created, but not enough to replace my current setup, but still really cool!
What other things are wished for that could be fixed via a small contest like this?
This should improve on the original forms and add some aesthetically-pleasing changes (such as a dedicated Restore icon and a less murky color scheme).
http://www.inductiveart.net/MCity-Thursday-0.777.tar.gz
The one who can fix all the issues you mentioned and gets the other book =p
Here is my final "Today" variant. I call it "Last Week" hehe
http://www.fewt.com/lastweek.shtml
I didn't get it to use GTK, but I'll hopefully get that later. Thanks again for the Today theme!
Why are circles used as icons for minimised and maximised? The windows on a desktop are generally nor circle's, and it doesn't make sense. The purpose of the symbol is to represent what will happen when you click on it. Will the window turn into a small circle?
>Will the window turn into a small circle?
Yeah. 
very nice, any chance of a all-out GTK+/GTK+-2 (or GNOME2) theme coming out? :-)
And how about making a luna theme as well 8-)