Haiku UI look patch

Forum thread started by admin on Mon, 2008-12-22 12:01

Inspired by this mockup, I started to implement something similar as code. Modifying the app_server and InterfaceKit code slightly, I came to the following intermediate result:

The patch is not quite finished, I just changed the drawing code of a few controls (window decorations, menus, scroll bars, buttons), and the look is not perfect yet, but I thought I should gather some feedback from you before I continue coding. The patch (against Haiku r28819) can be found here.

Comments

Re: Haiku UI look patch

Very nice work!
But wouldn't it be better to implement something to change decorators and controls on the fly?

Re: Haiku UI look patch

You should use the development mailing list for this.

Re: Haiku UI look patch

Looks terrific!

It looks very complete and suggest not making any further changes to it. Some users or developers will be opposed if you over do the look. I would like to see this as the default UI look for Haiku.

You should create an enhancement ticket and attach the patch & screenshot to it.
http://dev.haiku-os.org

You should join the Development Mailing List and discuss it there. This way it has a better chance of being included in Haiku.
http://www.haiku-os.org/community/ml

Regards,

Re: Haiku UI look patch

Definitely post your intentions on the development mailing list :)

I did hear a rumor that someone may already be working on a patch to improve the default theme look-and-feel (just a rumor anyway)...so maybe that person would be willing to contact you to coordinate efforts if they saw you were interested...

Re: Haiku UI look patch

I'm lovin' it !
:)

Re: Haiku UI look patch

Denis Washington wrote:

I have now sent a mail to the mailing list.

Heh, just after posting that i noticed your email thread in my inbox (guess that's what I get for going through my email chronologically!)

Re: Haiku UI look patch

Wow, this is great! Well, one way to improve this would be to change the default button a little. Instead of a dark grey line outside the button, maybe the default button could have a slight yellow glow? Please keep us updated as you go, I'd like to see what you do with tabs! Oh and, apart from what I mentioned about the default button, the updated look for buttons is great!

Re: Haiku UI look patch

Looking beautiful. Keep it up!

Hope you're making it easy to edit layouts later though.

Re: Haiku UI look patch

Not bad at all! I have three suggestions, however:

1. Lighten up the base background grey just a tad. It's too dark at the moment.

2. Give the menu selection gradient a color. I recommend a blue similar to the default BeOS desktop blue, perhaps a bit darker.

3. Darken and saturate the titlebar tab background colors a little. It looks odd for the buttons to be darker than the titlebar. I also might add that the yellows you used feel a bit "off" - they aren't the yellows/oranges used in the original R5 theme.

Re: Haiku UI look patch

I'm not sure I agree about the blue. I like autumn colours like orange, red, green and yellow, some seen in the leaves in the Haiku logo, some seen in the "About Haiku" window (here: http://picasaweb.google.com/haiku.inc/HaikuScreenshotTour#51670802367716...). If you can make it blend in well though, I don't know.

And I actually love the colour of the titlebar. I agree about the titlebar buttons looking a little odd, but apart from the buttons, I like the colour as he made it.

Re: Haiku UI look patch

I'm already using your first patch as it definitely looks better then the default colors, so nice job in the first place.

The updates seem nice, so +1 from me (as long as it's not too shiny),
but better use the mailing list for this.

Hopefully your patch will be in mainline soon.
Keep up the good work!

Re: Haiku UI look patch

i am waiting for this in the main svn :) ancien, plis no later.
but remember, ever should be able the option to back to the classic style, for the people who want remeber beos or simply for the performance.
Thanks and congrats.

Re: Haiku UI look patch

This looks great! How do I apply the patch?

Re: Haiku UI look patch

but better use the mailing list for this

I would be happier not to have the mailing lists and only use the forums ... I hate mailing lists!

Re: Haiku UI look patch

bbjimmy wrote:

I would be happier not to have the mailing lists and only use the forums ... I hate mailing lists!

Unfortunately, when it comes to getting changes to the OS committed to the repository, I'm afraid you'd have little choice :)

It seems there's a bit of a divide where users want to use forums, and developers want to use mailing lists.

Re: Haiku UI look patch

[off topic]

Unfortunately, when it comes to getting changes to the OS committed to the repository, I'm afraid you'd have little choice :)

It seems there's a bit of a divide where users want to use forums, and developers want to use mailing lists.

Mailing lists are old technology. Forums are easy to navigate and find information. It seems like the devs like the lists because they seem more private than the forums. They forget that all the posts on the mailing lists make it to the archives and become quite public.

Joining a mailing list is just one more step one has to go through to be considered "part of the community." It is a step that I refuse to do. I guess I am an outsider then even though I have been using BeOS since r4.5.

[/off topic]

Re: Haiku UI look patch

[off topic] is well here too because not everybody have mailist suscrition, happens so much time for me on the mail list.[/off topic]

Re: Haiku UI look patch

Quote:

They forget that all the posts on the mailing lists make it to the archives and become quite public.

Why is that a bad thing? i think that's specifically *why* they love mailing lists... it's easy to find stuff that has been discussed.

In any case, it's not going to change... there was even a concerted effort to eliminate the forums at one point...

You'll only find part of the discussion happening here, the real meat of Haiku gets discussed on the mailing lists.

Re: Haiku UI look patch

i've been working on that same thing, but your looks much much better i think hehe :)
here is my "version" http://hitomi.pl/haiku/gui/

Re: Haiku UI look patch

Artur, that's just great. I like you new style very much. Rounded rects everywhere, and yellow checkboxes / radio buttons / buttons. Brilliant.

Re: Haiku UI look patch

I like Denis Washington's yellow tabs, checkboxs and radio buttons, but i don't like the terminal tabs, sorry. Too plain for me.

I like Artur Wyszynski's dropdown list desgin, checkboxes, buttons and slider bars, but i don't like the tabs (inside the windows) with the yellow line, and the strong yellow buttons. This is too hard for my eyes. And the gray window color is too greenish for me.
The rounded views looks like Dan0, or Y(z)eta, but i like it. I think Artur use too lot rounded corners on the GUI, this is too mouch.

I remember, long time ago i see somewhere an small patch for the yellow tab buttons, that looks like the BeOS buttons. Why it not included in the Haiku?

If these patches not require lot of CPU time, i can live with these changes.

Re: Haiku UI look patch

Wow! The update looks great. I will come back and complain soon enough when I find something you can improve in a certain way, but for now, I just think it's great. I am compiling Haiku with your patch right now!

Re: Haiku UI look patch

i've been working on that same thing, but your looks much much better i think hehe :)
here is my "version" http://hitomi.pl/haiku/gui/

is beautiful too, should make a compilation with the option to change the items because sometimes like this and sometimes the other and sometimes the old and classic. really good the 2 themes.
And at diference i like the tabs more in hitomi theme.
Another thing, i believe the 3 themes should be included in the Haiku Alpha version.

Re: Haiku UI look patch

I like check bottuns and radio one, but I don't like tabs.

We should definitely make Haiku themeable.

Re: Haiku UI look patch

I definitly like more the current work, but love the gradient buttons in the mockups

Re: Haiku UI look patch

What Haiku would need for a real slick look is some font smoothing in the menus (GUI). That would help alot overall.

Still your patch looks great, I'll be trying as soon as I get back to my haiku computer. Cheers.

Re: Haiku UI look patch

What do you mean? Haiku's fonts are antialiased by default. If you want, you can even compile it with subpixel font rendering endabled, making the fonts look even better.

Re: Haiku UI look patch

Denise Purple wrote:

What do you mean? Haiku's fonts are antialiased by default. If you want, you can even compile it with subpixel font rendering endabled, making the fonts look even better.

And you can even change the hinting to make them blurry like OS X - Haiku has it all!

Re: Haiku UI look patch

umccullough wrote:
Denise Purple wrote:

What do you mean? Haiku's fonts are antialiased by default. If you want, you can even compile it with subpixel font rendering endabled, making the fonts look even better.

And you can even change the hinting to make them blurry like OS X - Haiku has it all!

To this day, I still do not understand the claims that OS X font antialiasing is blurry. It looks crystal clear to me and always has... At any rate, OS X antialiasing is intended to make text look exactly how it would if it the screen you're currently looking at was printed on a sheet of paper. In other words, it's there to improve the WYSIWYG factor of every application on the system that's capable of printing. I personally think it feels a bit more natural than SmoothType and other font smoothing systems since reading webpages and long documents feels more like reading a book.

Re: Haiku UI look patch

Hey! Well I didn't know you could do all this with Haiku (even though the fonts are smoothed, but not like I was thinking). I'm totally new to the BE way of things and must admit it's been lots of adaptation. When I said font smoothing I meant like mac OS. So yes, that blurry way of smoothing fonts :)

I personally love the OS X interface, and I think a bit of blurryness to fonts gives a very clean look. Anyway, Haiku would really benefit from some sort of manual and lots of help (end-user). Coming from the Mac/Linux side, it's hard to find stuff intuitively. Is there any help Wiki or project going on. Like a total guide to BeOS/Haiku. If so, this should really be on the Desktop.

The current desktop help isn't really a guide to Haiku, and I can't access it anyway because firefox crashes, hehe.

All this is off topic, so I'll stop now. Just my 10 cents for today.

Socapex_2K

Re: Haiku UI look patch

I think I would make the gradient blue a bit darker, now that you've change the text to white (on mouse-over). It seems a bit hard to read with light text and light gradient.

edit: Are you planning on rounding the corners a bit? Just a tad maybe, or is it to much work?

Re: Haiku UI look patch

Socapex_2K wrote:

The current desktop help isn't really a guide to Haiku, and I can't access it anyway because firefox crashes, hehe.

Would you mind opening a new thread about what's still missing from the User Guide in your opinion? We'd like to improve it continuously and knowing what new users miss or expect would help a lot!

Also, I'll ask our web team if we could put the guide online. I think it's in a good enough condition to make it available for everyone outside of a Haiku installation.

Regards,
Humdinger

Re: Haiku UI look patch

Of course I will. It seems that there is a user guide manual written (reading the devel list on translation).

Cheers,
Socapex_2K

Re: Haiku UI look patch

themeable version of haiku soon?

Re: Haiku UI look patch

I think we will have to wait for a while.
Remember the first version of Haiku wasn't even released yet.

Re: Haiku UI look patch

At least the groundwork for theming seems to be laid, see http://www.haiku-os.org/blog/mmu_man/2008-01-25/the_bowels_of_the_theme_...

For everyone hating skinned applications like me, it doesn't mean that every app can draw every widget willy nilly. You are the one changing the look of the whole system. Or, like me, not.

Re: Haiku UI look patch

Very nice. May I suggest a few things?
I would:
Add dots like in the lower right resize handle on the scroll bar so that it looks more grabable.
Change blue colour in the menu selection and elsewhere to the blue which is in the default desktop background.
Gradients are nice but don't make things too round with it eg. going from light to dark yes but don't go back to light. The roundness doesn't look bad per se but not in combination with the R5 straight window borders and tab.
Change those menu arrows to something smoother like R5, it is not a button so it should have a more passive colour melting more with the background.

Well done, very subtle, very nice.

Re: Haiku UI look patch

Edit: actually now I look at the 1st screenshot I like the darker gray menu but if it also had the z-snake http://www.osnews.com/img/632/zsnake.png I'll die of happiness :-)

Yes, I do like the z-snake. Maybe I like its colour in the screenshot even more!

Edit: Also the brownish colour of the close and maximize buttons on the yellow tabs are very nice, they make the GUI appear so much warmer than the default. That's what I always liked about the BeOS GUI, warm, joyful colours and cleanliness, simplicity.

Re: Haiku UI look patch

Not at all. We don't use mailing lists for more privacy and we don't forget they are public through the archives.

You may be using forums to find information, but we use mailing lists to communicate. To use a forum for communication is an additional hassle. I and other devs don't have the time at all to go look if someone replied. So that rules out using forums directly. Instead, most forums will send notification *e-mail* when someone replied to a post. Note the inefficiency. You already get an e-mail, now you have to go see the actual communication. We have no time for this. We have barely the time to read all the e-mails, let alone go look in various forums or forum threads. So mailing lists it is. It has nothing to do with privacy, but all to do with efficient communication.

Re: Haiku UI look patch

Yes, I also like the warm colors in the tab buttons. Those are nice. There are some improvements possible on the zoom button. It has some strange slightly darker corners where the background should be.

Re: Haiku UI look patch

Hi Denis,

the UI with your updated patch looks very good, there are many aspects I like about it. Here are some things I would improve:

Window border:

* Especially the in-active window decor has a white line in the frame which I don't like, especially visible underneath the tab.

* The decorator zoom button has a slightly darker background where the regular tab background should be visible.

* I would completely switch back to the old resize knob look. You can apply a gradient, but I think the button should blend into the rest of the border, currently, there is a white separating line which I don't like at all.

* The single line decorator mode should be made darker again, there are problems with apps that rely on the color, like LaunchBox. This may affect menus, but I think it would be ok.

GUI:

* The selector in the menus could look better without darker border line. At least I don't like that the border is inset one pixel on the left and the right, it should fall on the same pixels as the window decor.

* Inactive buttons are not distinguishable. This should be much easier visible. Maybe this applies to other controls as well, have not checked.

* Active scrollbars should have a darker background (behind the thumb). Maybe put back the one pixel shadow line below/beside the thumb.

* The buttons in general don't look bad, but I am not 100% happy either. For one thing, there is a slightly too dark background inside the round corners. And the "default button" does not look slick. The double frame somehow does not convince me.

Otherwise, very nice and tasteful work! Looking forward to your improvements.

Best regards,
-Stephan

Re: Haiku UI look patch

I agree with most of what Stephan said, but I particularly don't like the buttons: the slightly rounded corners don't fit to any other UI element, making the whole appearance rather inconsistent. They should be either square, or all other elements should be rounded as well.

The space above the inactive tabs isn't ideal, but I don't have a good idea on how to improve upon it.

But anyway, I think you're on the right way, and I'm looking forward for further improvements.

Round vs rectangular Re: Haiku UI look patch

I agree with Axel, if you compare R5 and Dano screenshots you'll see well made consistent use of rectangular vs rounded. Zeta OTOH uses gradients in the menu bar which make it seem rounded and stand out with the old-R5-look which looks IMHO ugly.

One argument I have with the default Haiku look is that buttons are too flat and sometimes don't look like buttons at all.

Re: Round vs rectangular Re: Haiku UI look patch

I like Artur Wyszynski's concept very much, at least a few elements from that one should be used.

Re: Haiku UI look patch

Very good, I'd change the checkbox and radio buttons, they look as if disabled in this screenshot. I'd add those dots or something else you have on the resize handle on to the scrollbars to indicate that they are grabable and can be moved. The handle looks very 'flat' I'd change that too and I'd change those black arrow indicators, make them sharper.

Re: Haiku UI look patch

While the new version does look a little more consistent, will there be something for those of us who like roundness?

Re: Haiku UI look patch

I am tempted very much to incorporate the patch in a more generic way. I would like to introduce a (private for the time being) InterfaceKit class which would be used by all other controls to delegate theme related drawing. Then it can be changed all in one place, and would be plugin friendly for the future. I would like to implement it in such a way that third party applications can (once it's official) use this for their own custom controls to still achieve a themed look for things like "frames" and "background" and this class could also handle other stuff, like default spacings for controls or between list items and so on. No idea when I will get around to doing this though.

Re: Haiku UI look patch

Humm ... i like the idea of a theme-friendly Haiku, where i really don't like the idea that a software can have its own style. That's where i like the BeOS GUI consistance, and where i hate the way all sharewares can be totally different in Windows ! (Even all Microsoft softwares have no GUI guideline between each others !! :-X )

Re: Haiku UI look patch

Hi there! That looks way better than the usual look (Which looked good 10 years ago when it didn't have to compete with OS X, vista and X-managers.

A few things though: (IMO)
BRadiobutton looks like it's disabled with the same grey color as the disabled BCheckBox.

BButton still need a little work. Can't put my finger on it (still its better than the default/origin look).

BPopupmenu should be redone from the ground up. I never liked them. (OS X managed to make them look good though).

If you like to add more usability to Haiku/Beos why not add "Bread crumbs" to tracker?
http://en.wikipedia.org/wiki/Breadcrumb_(navigation)

I'm eager to see your work on my desktop in the future =)
Thanks

Re: Haiku UI look patch

If bread crumbs are to be added, then it must be done well! If you've ever used a GTK+ program, you should have noticed the incredibly annoying bread crumb navigation in the file dialogue. So, either make it very well, or make it optional.