Haiku UI Mockup

For the web browser, I think instead of the UI implementing tabs, the Stack functionality of Stack and Tile should be finished up and implemented into mainline Haiku.

The end result would be modern and similar to how Google Chrome handles tabs on Windows, only more consistent and useful as it would be completely built into the OS.

For the web browser, I think instead of the UI implementing tabs, the Stack functionality of Stack and Tile should be finished up and implemented into mainline Haiku.
[/quote]

+10000000

I really hope to see this implemented.

That looks a lot better. But do you think widgets like the scrollbar could stand out more? I’ve always liked how macos 9 widgets were able to stand out even without all the fancy effects we have today.

[quote=halo]

For the web browser, I think instead of the UI implementing tabs, the Stack functionality of Stack and Tile should be finished up and implemented into mainline Haiku.

The end result would be modern and similar to how Google Chrome handles tabs on Windows, only more consistent and useful as it would be completely built into the OS.

[/quote]

At first I was resistant to this idea, but the more I think about it the more it makes sense. My only concern is some of the niceties present in web browser tab interfaces, such as favicons (at least in Chrome), right click menus, and just the general ability to customize such code. I could probably hack the app_server decorator code to allow for favicons and other customizing, but in general this will need to be experimented with a bit before I can say for sure it is a good idea. But I will definitely give it a try.

It also allows for “simulating” the Chrome multi-process tabs since it is easy to have windows in different applications, and the grouping would just happen because of the stacking.

We’ll see how this goes in a few weeks maybe.

Well, I recently posted some ideas in <a href=http://forum.syllable.org/viewtopic.php?t=1490>this 3ad @ Syllable forum.

I believe that an horizontal compact & clean upper dock could be an innovation for Haiku too.
Here’s an example: http://www.antagonism.eu/_priv/files/other/new_dock.png

It’s a <a href=http://www.skyos.org/?q=node/404>SkyOS, Litestep and <a href=http://www.sharpe-shell.org/e107_plugins/autogallery/autogallery.php?show=User%20Screenshots%2FcubeIX_white_theme_[by_captain_herisson].jpg&newwindow=1>SharpE ideas/graphics mixup.

There are also other interesting ideas about windows/colors in <a href=http://forum.syllable.org/viewtopic.php?t=1490&postdays=0&postorder=asc&start=20>this post.

Hope that inspires !

It seems that the black-filled arrows look much worse. Maybe light gray filling will be better?

Anyway, last mockup version looks very pretty and much better than current Haiku UI. I’ll vote for it! +1

UPD: [quote]1. Right-top menu corner no longer rounded[/quote]
How about context menu? It will be looks little bit strange.

Has anyone tried taking a look at Enlightenment? Not for global design adivce per se…but IMHO it has some of the best UI design out there. I could really see some awesome things happening with haiku if there was some sort of union with the EFL (Enlightenment Foundation Libraries) project.

[quote=Duv]That is something… rather nice. And hey, rounded drop-down menus… that is different. The colours are crisp. I would say that you might want to do something with the scroll bars, yet another thing that I see scream “Mac-like” to me.

But yes, not bad. I like it.[/quote]

I think you could rock out the NeXT style scroll bars which has the mac style button grouping at both ends.

I added some school-bus yellow to the scroll bars and arrows and put a drop shadow around the window. What do you think?

I quite like the school bus yellow because it adds interest to the window, but did you notice the original mock-up already had drop-shadow?

There is many people (including me) who think that OSX’s over-the-top style of drop shadow is ugly and gives the UI a very cheap feel. The only good thing about having that OSX style drop-shadow is to make the very flat style window “pop” so you can see the window easier as there is no titlebar to identify the location of Windows.

Keep the drop-shadow modest.

Man, this design is PERFECT. Kudos to you! How can I get this onto my Haiku install?

I also like the last mockup! Should be a R2 theme :slight_smile:

Personally I like the Mac OS X style drop shadow but that is just a personal preference. I did not notice the drop shadow in the original image.

Make the drop shadow gratuitous.

1 Like

The arrows weren’t quite right so I switched to more traditional style arrows with school-bus yellow background on the top and bottom of the scroll bar. Also added a more high-contrast scroll bar background. Comments?

Ship it

I personally like the modesty of the original design more. Call attention only when needed: to the active title bar. Also, is anyone else in favor of eliminating drop shadows altogether in the name of performance and minimalist design?

I miss the original BeOS knob marks on the scroll bar - see a screenshot here (knob style): http://www.guidebookgallery.org/pics/gui/settings/appearance/beos5-2-1.png.

I’m not so keen on the new scrollbar arrows-the BeOS ones were unique, and much less protruding. I feel that the yellow gradients are rendered too dark-it’s just a little grim.

I’ve made a few little edits, how do I attach them (sorry to sound stupid)?

No, there shouldn’t be any colored details other than the title tab. It will just be distracting for the user. It might look fine in the simple mockup above, but imagine your typical screen with 5, 10 or even 20 scrollbars, buttons and whatnot.

Colors should be used to attract attention to certain areas, like the blue hover-effect on menu entries, and the title tab on the active window.

Just use what’s already there :smiley: