Our Displays Are 2D Not 1D: GUIs Need to Exploit This

Many applications do not take advantage of the fact that our displays can be arbitrarily wide. Almost all of them only extend their GUI in the vertical direction.

Of course, GUIs are shown in 2D. In 1D they would have a width of 0 and hence be invisible to the human eye. But the core of their design doesn’t take advantage of the horizontal dimension properly. Here are some examples.

Image
Here Google uses only 1 column regardless of how wide your monitor is. It’s insane. The number of columns should increase just as the number of rows increases as the height of your monitor increases. Bing has the correct solution.

Image

As you increase the width of your browser the number of videos per row increases unlike Google. This concept can be applied to other programs such as chat ones. Here’s what chat current looks like

Image
Here’s how it could look.

There are two columns of text instead of one. The scroll bar would control both the left and the right windows. The left window is just an extension of the one on the right. If you were to scroll upwards 1 line of text, m would be at the top of the right panel and l would be at the bottom of the left panel.

The advantage of this is that the amount of information visible to the user is proportional to the area of the screen available rather than just proportional to the height of the screen. This is a fundamental improvement over the previous. One downside to having more columns of text is that the user may confuse the two but this is easily remedied by having a large space between columns and a border separating them.

This design could be applied to any list of text like Google’s search results. Though for that there is a better solution. Take a look at the website of Digg.

Image

Digg does have multiple column but the numbers of columns is not dynamic. There are always three columns regardless of how wide your monitor is. They need to learn from Bing. This layout with a dynamic number of columns would be ideal for a site like Google. The top search result would be at the top left, the 2nd best would be on the next column in row 1. It would not be below it. This is because we read from left to right, top to bottom. Not top to bottom, left to right. It’s key that the items would be ordered correctly.

Advertisements