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

I thought that in the short term, polishing the current fixed theme is the better solution. But for the future, real theme-ing would be cool indeed.

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 have now sent a mail to the mailing list.

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 have continued the work on the patch. A new look for checkboxes, radio buttons and tabs are now implemented, and a few other small things changed (for instance the window title buttons, which were criticized of being to dark in some comments). The (intermediate) result can be seen in the following images:



I hope you like the changes. The updated patch can be found here (this is the same link as in the initial post; I replaced the first patch).

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

@Jim Saxton: Copy the patch to your Haiku directory and run from there on the command-line:

patch -p0 < haiku-refreshed-ui.patch

The recompile. Be warned, the patch is still rough around the edges, you might see some visual glitches at places. If you want to remove the patch again, type:

svn revert

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

Sorry I haven't shown any further progress yet, I'm currently pretty busy with other things. I promise, though, that I will get back to this as soon as possible.

@Artur Wyszynski: Maybe we should collaborate in creating the theme ;)

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.