Highlights of a Revolution

Valuable design principles like symmetry, consistency, and simplicity are all part of the idea I am about to share with you. I will be talking about highlighting and selection graphics on the SUSE/KDE desktop. Why? Because this is a subject that not many have talked about and when it comes to designing this aspect of the GUI, many just follow what the precedent has done. I am not here, however, to tear down anyone's effort to make these graphics, but rather, give a personal explanation and solution based on the three design principles aforementioned.

I believe that as SUSE embraces a different idea about highlighting and selecting, they can leave a palpable trace in the world of GUIs. Yet another aspect that can make SUSE "highlight" itself as a very unique Linux distribution and a viable solution for anyone's computing needs. The KDE desktop does not seem to have a clear idea of what they want to do with selections, they rather take ideas from everywhere and put them on the desktop. There is lack of consistency and direction. It is time for a revolution.

But first things first. An analysis of the current design ideas on different desktops. Here are some examples from Windows, Mac and SUSE on the way they currently handle highlights and selections.

Although this is an extra settings, Windows can add a check mark box beside an item. At the same time, this image shows how there is a selection, and a hovered item. Selections have a darker tone of the same color family, in this case, blue.





This one comes from the redesigned windows panel and this image shows two different colors. The blue is the current hover/selection and the orange one is a different kind of selection, probably a new item or one that needs attention.







Mac OSX also has a few ideas on highlighting. I have to say that Windows and Mac have a lot in common when it comes to consistency about their highlights and selections. They have a very consistent coloring and color identification for the items used. But it seems to me that OSX has a reduced amount to highlight and selection options. A more concise concept.

I am sorry that I could not find a better example of this, but here is one. Icons in OSX on the desktop only get highlighted on the tittle name. Sometimes these icons have descriptions, like the one above, in which case anything other than the file name do not receive the highlighting.

In this piture, there is a multiple selection going on. The selection is pretty much the same in all the OS's that I have used. When you choose multiple items, with the mouse pointer, a rectangle appears which selects everything that it covers. In OSX you see 3 elements of selection/highlight: The selecting rectangle created by the mouse pointer, then the OSX file name highlighting, and finally the application icon highlight, a gray square over the selected icon and about the file name. Additionally, and this is present in Windows as well, there is a place selection on the right location menu.

openSUSE also follows a few ideas conceptualized by Windows and Mac OSX. Probably because Linux is an OS brought about after Windows and Macs had already set foot. This is not an accusation, by the way. From the 3 OS's in question, it seems that openSUSE has the most selection/highlight ideas on the desktop. Here are some, there could be more but I can't think of any other.

  
This is Dolphin's idea for last selection, an underline. Dolphin also features hovering just like Windows, a lighter shade of the selection color. In this case it is light blue.

The the next one is panel button highlighting. This is very similar to the latest Windows 7 panel highlighting. A glow or light that shows on hover for the selected icon.

Here is a window highlight for the current window present on the desktop. A blue band that tells you that you have this one window selected (personally, I do not like this because it is an extra visual idea that is already set forth by the sole presence of the window in the front of other windows. It must be because I am working with this window).

This is probably the one I like the least. A frame going around the hovered item. The frame does not change into a solid color as it happens in the folder selections within Dolphin.
The selection on the Folder View Widget, I think, is one of the most elegant of all the present on openSUSE. It is simple, very non-distracting, it does not divide selections with different colors like multiple selection does in OSX for example.
Menu items hovering in Dolphin, and just any other KDE 4 application, shows a fade out near the right end of the hovered item. This time, the selection coloring takes after the color set forth by the window. This is, I think, very consistent. It shows users in a simple way that they are working with something foreign to icons. The selection is done inside the menu and does not take the coloring from side to side like OSX does with its menus. KDE's does not touch the menu edges, neither does it touch menu item separators. Additionally, KDE's menus underline the first letter of each item on the menu. If you press the underlined letter, then you select such item.


I really don't like these two very much. On hover, you see the light blue but at the same time a popup image shows you the items contained inside that category. The highlight is good, but the popup gets to be annoying after a while. Can you see how it hides the rest of the System Settings items?

This one has to do with buttons and drop down menus. The button features a blue frame for hover and selection and the drop down menu item keeps that blue on it as it is hovered.

And here is the one created by the Plasma team. A similar idea to other items on KDE. Selections and hovering do not touch menu edges, it take over the whole area around the selected item.

The ideas that go around different OS's and the way the represent highlighted and selected items differs greatly. Not to say that this is a problem. I believe it is rather a strength. OS's dare to be different and they seem to be more interesting to work with. Simplicity is something that I value, I believe that openSUSE does not have this simplicity yet. The KDE desktop features a few ideas that can be used across the whole platform. I am not saying either that OSX and Windows treat this better.

A more centralized highlighting system should be in order to make sure that applications, menus and icons respond similarly to hovering, highlighting and selecting. Fewer options that mean selection would be better, in my opinion. The varied array that the SUSE/KDE desktop shows seems inconsistent. It comes across with the point but it could be reduced.
Next is the problem of selections and the number of selections made. Single items are the only ones that receive hovering, whereas multiple items do not receive any hovering, you can only select them. Then what is hovering for? Selection of multiple items is also done through key combinations such as using Control for multiple individual items and Shift to select all items within a range. However, I do find that I select more individual items than a range of items. I spend most of my time selecting with Ctrl key rather than Shift and if I need a range of items then I selected with the mouse pointer or simply do Ctrl + A to select everything. Then, if I want to take items out of the selection range I press Ctrl and click on the few that I do not need to work with.

Finally, there is the concept of symmetry. Symetry gives the impression of order, good organization and tidiness. But Dolphin File Manager got this symmetry very well in the beginning, but it ended up creating this optical illusion when many icons were selected. http://www.michaelbach.de/ot/lum_herGrid/index.html#

So, KDE guys decided to change the selections a little bit and came up with this:

 

Perfectly fine, right? The optical illusion is gone because of the spacing. Look at what happens when the icons are smaller than tittle ans icons.
Symmetry in Dolphin is lost.

Possibilities
Here are some of my ideas about what selections could be like. Here is the revolutionary treatment for selections. These are not perfect, help me make them better. Your support is important.

Enter a selection mode. Whenever you are working with many items the file manager can show you, among other things, a "Selection Mode" where you can click on each possible selection method and work freely with your items.


 
Selection with helper icons upon hover. I would actually do away with highlights. let the mouse pointer have extra power and it will seem more natural to just locate the mouse. Provided that the pointer has within it the ability to alter elements underneath it. Another suggestion would be to do away with popups. Elements in the desktop can be worked a little extra and would be able to become self explanatory through the use of explanatory labels for example. Or even better, if the user seems to take less time hovering and just clicks items, make KDE realize that the user already "knows" what the icon or elements do, therefore popups can be done away with after a while. Also, avoid underlining, it really looks out of place. Again, empower the mouse pointer.
Finally, take ideas from the Plasma desktop and place them on the applications. Highlight with glows, they seem natural and can be worked to be very beautiful.

About buttons, follow daily-life examples. They can be quite elegant. For example, elevators. Here are some pics:







5 comments: