Haiku GUI - just mucking around
It's a bit rough, blatantly rips off other OS but it's not really finished. Let me know what you think.

http://img208.imageshack.us/my.php?image=haikuexcc1.png
I didn't do the icons btw - they're a mix of famfamfam and kde crystal icons.
Justin

Comments
Re: Let eyecandy be, improve upon R5!
Apple seems to think the same thing:
Encourage your users to discover functionality by providing cues about how to use user interface elements. If an element is clickable, for example, it must appear that way, or a user may never try clicking it. Be sure to use Aqua controls properly and avoid making controls invisible to inexperienced users.
Aqua buttons, for example, appear three-dimensional, enhancing their resemblance to buttons users see on physical devices. Well-designed toolbar icons make the commands they portray recognizable to users. This familiarity gives users the confidence to explore the functionality of a new application.
Don’t discourage discovery by making actions difficult to reverse or recover from. For more information on this, see “Forgiveness.”
http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGuidelines/XHIGHIDesign/chapter_5_section_2.html
Re: Haiku GUI - just mucking around
I think the nice thing about the tabs is that we can jazz up the UI completely and haiku still pretty much keeps its identity.
Re: tabs ala Firefox solves a different problem
You need those icons with the title. I find that if I only had the icon I might not get the title. If I have part of the title (result of truncation), I might not get the title. But if I have the icon and part of the title then I can usually make out the link.
Another thing to point out is that we have workspaces so we now have 3 levels to deal with; workspaces, windows and tabs. What I would propose is a vertical tree and the ability to name these workspaces.
So you would have a widget that displays everything that's on your system:
Workspace #1 Internet
>Firefox
>>Gmail
>>Haiku Project
>IRC client
>>efnet
>>freenode
>>>#haiku
Workspace #2 Games
etc
I think that makes a lot more sense than the graphical workspaces app
Re: tabs ala Firefox solves a different problem
You mean something similar like the entries in the DeskBar but tree-like?
That could be handy IMHO, being able to sort according to workspace. I like the graphical workspaces app, you can drag windows to and from workspaces within the app, I don't know any other util (in linux) which can do that. Very handy IMO.
Re: tabs ala Firefox solves a different problem
well you could still drag and drop with my idea. just drag something over the entry like you would in Tracker or Explorer or any other tree widget.
You're not getting much information about the individual windows in the workspaces app and this is even true with Apple's Spaces which tries to show you what is inside the window, but smaller. That only works if you deal with images. It sure is a cool way to show off their UI technology but is it the best solution for users?
Images or Not?
I'd say that most users don't need an image to know what's in a window, but I could be wrong. Is it possible to have the users choose for themselves on a per-system or per-application basis? If I'm working in something like GIMP, I don't like having to click through a bunch of windows to find the right image. A program like that is already using a large amount of RAM, so the small addition to that load wouldn't bother me much. Some people may be a lot more RAM-limited than me, however.
I have been thinking a bit about the best placement of a menu on a screen. If it is placed at the top left, it will automatically distract and deflect the user's travel across the screen, which could potentially be bad for the user. I can see breaking the user's flow each time they re-center focus and scan the computer screen causing some major problems. I'm not in any way educated on the deep psychological effects of such things, but having something like that happen every time you looked at your computer could end up being disastrous. Breaking a normal flow like that (especially so early) is bad.
On the other hand, putting the menu out of the area that a person scans could create problems for the user as well. It would take more time to "find" the menu on the screen each time they want to access it. So, to get it as close to the front of a user's vision path without disrupting flow is the problem in a nutshell.
The top left of the screen is a good place to stay for a menu if it can be managed, so I propose having the menu floating on the left side of the screen, with the top about 1/8 of the way down the screen. The polar opposite side of the screen (1/8 of the way up the screen for the bottom of the menu) would be okay for less commonly clicked objects or a taskbar or something. As long as a point of interest is placed NW of the diagonal tracking line of the eye, the menu on the right could be nearly invisible from an at-a-glance point of view. Going back to the main menu bar, it could still be at the very top left, as long as it blends well (but not too well!). On second thought, the menu on the right could be for the active program, while the menu on the left could be programs or whatever. (Context-sensitive menus like some video games have??? I guess it could work for common computing. What do you all think?)
I need to get some sleep before work tomorrow, but I'll see if I can get some images up of what I'm talking about.
Re: Haiku GUI - just mucking around
Interesting GUI-science. I have my DeskBar on the upper left side of the screen, Trash lower right, Workspaces upper right (if I start it), mounted volumes under the Desk bar in the middle then icons grouped together in clusters when they have similarities (music apps eg.) or not if they are 'single'.
Re: Haiku GUI - just mucking around
Re: Haiku GUI - just mucking around
Hey all,
Had an urge to do another mock-up:
Not much to look at - based on a screenshot from http://arstechnica.com/news.media/haikuos3.png
Re: Haiku GUI - just mucking around
Hi,
I thought I'll comment on the posts submitted by Justin McCormack on Tue, 2008-09-23 20:31 and by Timothy Titus Hilton on Sun, 2008-04-06 21:50.
Starting with Justin McCormack, I think it really doesn't make sense to do a horizontal bar anymore. Back in the days it made sense. We all had small 4:3 displays and writing things underneath of each other would have taken lots of the limited horizontal space on the display. We would have lost lots of valuable working space.
Today 16:10 got very famous and almost took over the market. Are there still people who buy 4:3? On 16:10 displays (especially if you have a notebook and no 30" display) the vertical space is very limited. When reading a text or a web page I would like to have every tiny little bit of vertical space for the content. I surely do not want to do more scrolling than I need to.
As I'm writing this I have a browser window with lots of lost space. There is a big white area beside this text box and I still got lots of desktop showing on both sides of the window. Anyway I am not using the task bar at the bottom that is taking away space from what was written before my comment. In my opinion the Windows way is bad on new displays, the macOSX and Gnome way (even two horizontal bars) is worse, BeOS, with the tracker at the left or right side, expanding vertically uses the space that I don't need. Lets not put work in changing that and laugh at others who will start changing that in the future? :-p
Another thing that I don't like is the window border. If it's too small you can't grab it anymore to pull the window somewhere else. I love that feature... .
For me the colors on the last mockup are not so nice... the black just doesn't fit to the rest. I think that dominating black parts have to have other very dark regions to support them. But I am not an expert on colors, that is just my personal feeling. Everyone should be able to change the colors to make it look good for them.
I think the split bars in the mockup submitted by Timothy Titus Hilton on Sun, 2008-04-06 21:50 are a bad Idea. The problem is not that they take away too much space, but they have the OS in main focus.
In my opinion it clutters the OS over the screen. I think the left (main) side should be reserved for programs. The right side is for the OS. This is how BeOS did it by default, but my reason is that programs have tools you work with very often. If we start a project, do a layout, etc. we always start on the left side. For that reason we want our tools to be on the left side to avoid far ways and to avoid dragging icons over things we might want to see.
This is one thing that a user should always be able to customize though, I for my part prefer it just the way BeOS showed with the tracker. What is defiantly missing is the possibility to scale it (resolutions got a lot bigger what made the icons a lot smaller, we don't want to copy the bad things from MacOSX). Yellow-Tab started to make their Tracker scalable, but never finished it.
@Timothy Titus Hilton what do you mean by "Context-sensitive menus"? If the context changes depending of the state your program is in, it always has a big usability issue. People remember there was this one special option and it was exactly at that spot, the problem is it isn't there right now, when they want to use it. These menus are great if done well, but they have lots of potential to hide functionality and get users confused.
Sorry if I sound like I hate everything you made, I do appreciate the work you put in it and I do not want to make you feel bad... . It's just some of the things I think BeOS did very right and I miss them badly on any other OS yet. I just want to point these things out and I don't want to miss them on Haiku :-(
Thomas
Re: Haiku GUI - just mucking around
No offense taken. This is an open discussion, so we should all be able to maintain our opinions without any worries.
Uhh... Looking back at my post, I meant that one of those menus would contain the menu for whichever program you had selected, so you don't go looking for the menu bar. I know that in some programs I've used, the menu is in some crazy place and I spend half of my time in that program trying to remember where they put it. Forcing the menu bar to a certain place on the screen would let users concentrate more on what they're doing as it takes one potential uncertainty out. A program could even consider a certain part of itself another place and have a different menu, but as you said that could get confusing.
Another context sensitive thing that could be interesting is having the OS keep track of how often two programs are used together, so when you open one, it automatically adds that program's partners to a "quick launch" (an in Windows) bar. Preferably, this would not appear out of nowhere, but link itself to the OS menu, keeping it consistent.
I mostly said that the top left should have OS tasks because it's the first place somebody looks when they break flow to look for something else. As often as not in my usage, that something else is a new program. I use hotkeys enough in my main programs that I rarely open the top left menu, but some people are different. I know people who still don't get the little icons under the title menu in MS Word. Customization would probably be the best compromise, allowing people to choose which menu contains what tasks, as well as some other nifty features.
My argument to the focus being the OS is that it wouldn't be as soon as you opened a program. I'm a bit biased against desktops though. To be honest, I'd prefer it if my background could be a window for file navigation. The only icons I have on the desktop are the file browsing related ones. Again, everybody's different, but I would like to at least have the option to kill what I consider dead space.
Most of the suggestions are just pointing out weak spots (as I see them) in current OSes interfaces, and suggesting the first solution that comes to mind. I'd like to hear other peoples' takes on these issues, as this forum is a good place for brainstorming. Well, I'd keep blathering on, but I'm finally seeing Batman tonight. :P
Re: Haiku GUI - just mucking around
Talking of window broders, I like how they work in Windows, where you can resize the window in every direction.
Menus and toolbars should stay inside their application, to not "take over" the rest of the system like it happens in MacOS. Actually I like the "ribbons" that appeared in Office 2007 and are going to be all over in Windows 7, but there's some patent on the way.
Leave the Deskbar on the right by default, but let the user move it. I like where it is now, anyway :-)
Re: Haiku GUI - just mucking around
It looks beautiful... I would love to see a vmware build with this type of theme... the icons are bleh, but we already have those, right?
Re: tabs ala Firefox solves a different problem
The problem with multiple documents or tabs in one window is that with current implementations you can't see the title of each tab, worse, you get to see the title of the current selected tab in the main window.
...
Don't get me wrong though; I do find a method of grouping windows to be neccessary but windows inside windows is just making things tidier but more obfuscated in the beginning and even more obfuscated when you open a lot of documents / sites again because you don't see any title or reference in say the deskbar or any other taskbar or grouping of (minimized) windows.
I also don't like the grouping in the Windows taskbar; Deskbar in the corners is much better IMO because it gives you a vertical list of windows.
I like the way goBe productive is handling tabs. One office application and multiple tabs no matters what subapplications are used.
Shot: http://freenet-homepage.de/le_prOSy/screen5.png
Also the Deskbar, as mentioned, the BeOS-way still kicks ass. But, the 'ZETA' Deskbar (screenshot) is able to show bigger icons as the BeOS Deskbar. Very useful for resolutions > 1600x1200.
Hard to find a way between the straight BeOS UI and these modern vistaish or macOSish while keep it simple, fast and intuitive...
Hit me or not, i also like the 'decent' move of the developers from the R5 to the ZETA UI...
Modern UI or not, first of all i am looking forward to the first HAIKU alpha.
Thank you to all HAIKU developers!
;)
greets
Edit:
What i forget to mention. In case of Justins Mockups:
From this one:
http://img207.imageshack.us/my.php?image=haiku2fd2.png
I like very, very much the Deskbar, altough *i* would prefer to switch the colors, the 'HAIKU-Start-Button' should be blueish and the entries of the Deskbar which are representing the started applications should be grayish.
Also the text inside the Tab is very nice, looks like a relief which makes it 'plastic'.
From this one:
http://img254.imageshack.us/my.php?image=9exwz9.png
Also the tabs are good and the way the Tracker shows the files (the grid), but the scrollbars are to big (my opinion).
This one:
http://img213.imageshack.us/my.php?image=haikublackma7.png
Also nice but i'd prefer the yellow tabs from the picture
http://img254.imageshack.us/my.php?image=9exwz9.png
for that.
Anyway, thanks Justin for your work on this.
Nice day!
Re: Haiku GUI - just mucking around
Another context sensitive thing that could be interesting is having the OS keep track of how often two programs are used together, so when you open one, it automatically adds that program's partners to a "quick launch" (an in Windows) bar. Preferably, this would not appear out of nowhere, but link itself to the OS menu, keeping it consistent.
I really do like this idea, an extra quick start bar for that would be a very cool idea!
To be honest, I'd prefer it if my background could be a window for file navigation. The only icons I have on the desktop are the file browsing related ones.
Did you try the folder on desktop thing from KDE 4.1? You can put a window on the desktop which shows a specific folder you choose. You can copy files into this folder or start programs etc. If you go down to another folder in this window the file browser will start and take you there. It is an interesting concept. You can't copy files to the desktop anymore by drag&droping them onto the desktop what might keep it more clean. I don't know how useful it is for me yet, because I just started trying it on PC-BSD7 and it took me a while to get my dualscreen setup right... .
For me the desktop has a major downside. Things on the desktop are always covered when you need them or you lose your focus when you use them. I do use it randomly, but usually I enjoy the background picture (or video/screen saver put onto the desktop) :-s
Talking of window borders, I like how they work in Windows, where you can resize the window in every direction.
I like the BeOS way better, but I'm sure everyone has different opinions on that :-)
Actually I like the "ribbons" that appeared in Office 2007 and are going to be all over in Windows 7
I agree with you here, I really like how Microsoft did that in Office 2007. It is great for people who use it for the first time and grouping similar tasks and color coding them is great too. It's just annoying if you used to know where your buttons where hidden ;-)
I like the way goBe productive is handling tabs. One office application and multiple tabs no matters what subapplications are used.
Shot: http://freenet-homepage.de/le_prOSy/screen5.png
I don't know if it was possible in GoBe Productive, but it would be great if you could unhook and hook the tabs to "tab or window" the content back and forth. Sometimes you just need the content of a tab in a new window to compare stuff or just have a better reading experience. I do that a lot with Opera tabs.
But, the 'ZETA' Deskbar (screenshot) is able to show bigger icons as the BeOS Deskbar. Very useful for resolutions > 1600x1200.
That's what I ment was not finished. It's great that you can show bigger icons, but the width of the deskbar has to increase too so the names behind the icons are still readable (and the text should scale too of course). To cut it short you need a full scalable Deskbar :-)
Hit me or not, i also like the 'decent' move of the developers from the R5 to the ZETA UI...
I won't hit you for liking the Zeta looks, I think yellowTAB did a good job on it. The ZSnake thing was cool too (not sure where that came from) and I did like the Settings Program, even though it had some glitches.
I didn't like the "bulbs" in the newest Zeta Deskbar http://www.bebug.be/images/MM.jpg, the old "boxes" http://www.bebug.be/images/apps/Zenverter.png for the runing applications looked a lot better to me. Don't ask me why, I can live with both :-)
I do see the "bulbs" look more modern, but somehow they don't look right... maybe they should be more like a button style?
I don't know why I didn't see this screen shot
http://img213.imageshack.us/my.php?image=haikublackma7.png
I actually like it. I only think it's useless to pull the deskbar to the bottom if it's empty. That just wastes space. In my eyes it is a lot better to let it expand with new entrys.
The Black and yellow theme is nice, but it is a bit Vistaish since Microsoft just recently started black. Apple is following already, does Haiku have to follow too? ;-)
Have a great day,
Thomas
Re: Haiku GUI - just mucking around
I think that the tabs in beos were great. I loved how you could slide the tab around. the only thing that would make it better is if you could use a keypress to make all the windows automatically shift their position/tab position so they all line up neatly. So say a user has 5 windows open, and he/she hits, let's say, the f5 key, all the windows line so that their tabs are presented in a nice tabbed interface. then when the windows are grouped together like that, you could shift+drag an apps tab left or right, and it would reposition itself inside the group of tabs. you should be able to seperate a window from the group of tabs by just dragging it out. maybe have a 'sticky' area around the tabs, so the user would have to drag the tab 5px or something before the window will seperate from the group...just so you dont accidently move one and get the tabs all messy looking.
Re: Haiku GUI - just mucking around
Talking of window broders, I like how they work in Windows, where you can resize the window in every direction.
Hmm I think it could be handy to be able to grab windows anywhere and be able to move them, with KDE it is possbible to do a 'alt-mouse-grab-the-window-anywhere-to-move-it'. This way borders can be really thin (and yellow!) and you can resize the window by clicking the border. I can imagine resizing being hard to do with small borders but I usually move windows more often then that I resize them.
Therefore I believe an approach with holding a modifier key and clicking and dragging the mouse anywhere inside the window could resize it quickly without too much focus and strain.
Take a look at KDEs's window behaviour options.
Re: Haiku GUI - just mucking around
I agree, I saw a lot of posts about a window grouping feature like you describe. My version would be that I can stick windows together this way and they stay sticked together but it doesn't have to be all the windows per se.
Maybe this way tabs inside windows, won't be necessary.
Re: Haiku GUI - just mucking around
Window grouping features sound really great.
I agree that if we could group windows to tab groups, we might be able to do without tabs inside windows. I do think the groups should be represented as groups in Deskbar though, so you could quick hide them, if you needed space on the screen.
Talking about window behavior, what I'd really like to see is scrolling with a hand like in acrobat reader when pressing the middle mouse button. I think the first OS I saw that in was BeOS and I think it is a lot better than mouse wheels. Especially on long pages the mouse wheel isn't the best choice and you can't move from left to right. I did love the mouse wheel when I had a "ball mouse". Back than the mouse sometimes wouldn't move nicely, but the mouse wheel would always allow sooth scrolling. Today I don't think we need that anymore.
(oops, sorry, that is a bit off topic)
Thomas
Re: Haiku GUI - just mucking around
There are lots of good ideas floating around..
I do feel the best one would be to create an option to enable navigation in a single window instead of opening a window for each folder step. I think the original mock-up by Justin had a VERY clean and simple way to address this... maybe opentracker could implement something like this? (less glossy, to match existing "original" look)
Re: Haiku GUI - just mucking around
There are lots of good ideas floating around..
I do feel the best one would be to create an option to enable navigation in a single window instead of opening a window for each folder step. I think the original mock-up by Justin had a VERY clean and simple way to address this... maybe opentracker could implement something like this? (less glossy, to match existing "original" look)
OpenTracker already has a single window mode, but it's just not the default. The other neat things in tracker are the folder tree menus (right click in a window), and click on the "x items" in the bottom left of the window to get the parent folders. These aren't obvious functions though, and could probably be placed more intuitively. They definitely need a mention in the "welcome guide" for new users.
Simon
Re: Haiku GUI - just mucking around
I do think the groups should be represented as groups in Deskbar though, so you could quick hide them, if you needed space on the screen.
Talking about window behavior, what I'd really like to see is scrolling with a hand like in acrobat reader when pressing the middle mouse button. I think the first OS I saw that in was BeOS and I think it is a lot better than mouse wheels. Especially on long pages the mouse wheel isn't the best choice and you can't move from left to right.
Thomas
That are 2 very good ideas! When I last saw all those multi touch tech demos on youtube I realized how I find working with the mouse to be too precise, many GUI objects are small. If you could just grab a window anywhere or grab the inner parts and moving that, like the Gobe Productive objects, (try 'the Widget' sample document for a feel), that would be much more hands-on and playful.
Re: Haiku GUI - just mucking around
I wonder how windows with a wood or bamboo texture would look like. I'm really bad in doing mock ups but maybe someone else could try? :-)
Someone already made a KDE theme that looks like this:
http://www.kde-look.org/content/preview.php?preview=2&id=75804&file1=758...
It might look good if it was consistent and used for the whole GUI, but I think I would prefer brighter wood flavors... . That might be a way to get away from this Vista/MacOSX look. What other materials might look good? What do you think?
----------------
@nutela multi touch would be great. At the same time I would love to be able to plug a second mouse into the pc and get a second pointer. That would mean I could have two programs in focus at the same time. I could check my mails while my wife is playing Mahjongg on the same computer at the same time without complaints (if my screen is big enough).
Too bad implementing that will probably be pretty hard (What happens to a program when two buttons are pressed at the same time?) and I never have the time to get a close look at it :-(((
Even worse that I feel like the only one who would want something like that :-)
Have a nice day,
Thomas
Re: Haiku GUI - just mucking around
that kde thing look absolute ugly ;)
Re: Haiku GUI - just mucking around
I think the texture must by high resolution and large (ie. not repeat too often) to look pretty.. or maybe a vector image. It will be slower for sure.
The problem with more input devices is that even if more windows could have focus at the same time is that which input device (read keyboard) will interact with which window? How do you differentiate (active window colour) each active window.
Mouse pointers you can differentiate because you see the cursor on screen but not keyboards.
Two buttons are never pressed at the same time because they are scanned after each other not at the same time I believe.
Re: Haiku GUI - just mucking around
Wood? Why wood? In the film "Hackers" (from - uh - 12 years ago?), they were using windows with moving fire as border. Now THAT would be cool!
Re: Haiku GUI - just mucking around
I think the texture must by high resolution and large (ie. not repeat too often) to look pretty.. or maybe a vector image. It will be slower for sure.
I thought the simple shiny stuff needs resources too so it would equal out. Anyway it was just a thought on how to make things look new and unique.
Wood? Why wood? In the film "Hackers" (from - uh - 12 years ago?), they were using windows with moving fire as border. Now THAT would be cool!
LOL that was the movie where they had a "rabbit" in their system, eating it... right? ;-)
I don't like blinking stuff on my desktop it distracts me. If I want blinking I could deactivate my flash blocker ;-)
@nutela You're right on my multi input idea two keyboards would be a bit hard. It could be solved if the system remembers the order the keyboards and mice were plugged in and glues the focus together. But I don't care about the second keyboard that much. I think two mice would do for a start. The active window color could get a shine of the colour the corresponding mouse cursor has. If you only allow multiple mice the active window colour shouldn't be too much of a problem. You know into what window you just clicked.
If Haiku allows grouping windows it would be nice if there were different options to rearrange them. Beside minimizing and maximizing windows one could be "Tabbed view" and puts the windows behind each other, one could put them beside each other and one could keep the previous active window big while ordering the others around that window. Maybe someone has even more ideas. I think that would be cool.
And yes that wood thing is a bit ugly, but it has potential :-p
Re: Haiku GUI - just mucking around
I very much enjoyed the original post with the exception of the rounded corners, here is my dream layout (its an edit with square corners):
Image: http://i266.photobucket.com/albums/ii248/stkarnivor/edit.jpg
Okay, maybe its a little nit-picky but that's just me :)
Otherwise, great stuff.
....and yes i do like the "glassy" look :p
Re: Haiku GUI - just mucking around
http://img213.imageshack.us/my.php?image=haikublackma7.png
it may be a bit too dark!
I like the shape and structure though I might add, one problem with the title/window widgets is that they don't stand out so much.
Re: Haiku GUI - just mucking around
In another thread we discussed the problems of a natural look (paper, wood, stone, etc). You really need a very high DPI monitor to get in all those tiny details otherwise it looks fake and hard on the eye. It also can't be a repeating simple pattern -you need fractals to make the grain look real and inviting.
it's important to have a UI that doesn't make you sick after looking at it for more than 2 minutes.
Re: Haiku GUI - just mucking around
Very nice, smooth without going over board on the gloss. A little too 'Human' through, so I see where some are getting the relation to Linux (Ub in particular). I personally enjoy the fact that this design seem to keep out of the way like Gnome/GTK use to.
With the buttons on the second layout, I am not too sure. It something that does annoys me with most of the GTK engines when they round buttons (like the one in your tab), they just can't help coming out as Mac OS 9/OS X derived... the curve is too forgive, maybe I would like to see someone try a smaller curve, see how it looks on button. If anything, avoid the squared look... it something a little jarring for the layout, distracts from the work at hand and I am not sure you want to do that to the user. (Or if square it something that you want to do, avoid the two-tone gloss colours... something to make it look different from the Vista/Mac-look without being distracting)
Re: tabs ala Firefox solves a different problem
I see all the gripes, I don't care.
This is an AWESOME GUI someone plsplspls implement it :D
keep up the awesome work :D