Skip to main content

User interfaces are getting worse

gps watch

When I'm not in front of computer, I like to spend my time outside and moving. While I do some biking, I run enough to keep making the mistake of signing up for long distance races. Now, I would like to take advantage of wearable fitness tech for training. I have this GPS watch which has a beautiful form factor. It is the size of normal watch and fits well on my wrist.

The main problem is the touch-screen. Since the launch of the iPhone, industrial design has seemed to skew strongly towards touch screens. A touch screen that is roughly 1 1/4" by 3/4", on a device that is designed to be operated while moving and with sweaty hands, should be an outlier of bad design when everyone is talking about UX. Unfortunately, prettiness seems to be winning out over usability everywhere.

What happened to the Big Red Button?

...don't ever, ever touch the red button! - Agent Kay, Men in Black

table saw switch

So on this GPS watch with less than one square inch of screen, there are two physical buttons. Intuitively, if the watch were to ask the user a "yes" or "no" question, assigning one button to "yes" and one to "no" would be the way to go. Instead, it puts "yes" and "no" button on the touch screen, each about 3 / 16th's of an inch tall, and right next to each other. When I press one, my finger covers the other, and I just have to hope the touch screen detects the center of my finger correctly.

Another good example of this UI design failure, is the start menu in Windows Server 2008. If you are logged into the server and want to log off, the button one pixel away from "Log Out" is "Restart". This is kind of like keeping the rat poison next to the aspirin. Table saws and other large power tools, will have buttons that not only very clearly show what they do both in words and colors, but are hard to accidentally turn on, and easy to stop. Industrial designers should be admiring designs by companies like DeWalt, not Apple.

It also makes no sense to place things at the edge of a touch interface. While there was the argument for doing this on a mouse interface, where the mouse would hit the edge of the screen and stop. This is not true for a finger. If it is a hand held touch screen like a phone or tablet, there is a good chance the user's finger will be over the edge of the screen while gripping the device. This is increasingly likely as device makers keep trying to expand the screen edge-to-edge. Buttons should be big, high-contrast, far apart, and in places that are hard to accidentally hit.

Glyphs are not intuitive

Buttons labeled with text have fallen out of favor in GUIs. Instead, we are seeing the rise the hamburger menu, horizontal dots, and vertical dots. At best, these symbols convey to the user that "there is a menu here". What is in this menu? What is the difference between horizontal dots and vertical dots? It is like naming a variable integer, which no self-respecting developer would stand for, so why should they stand for semantically null GUI components?

hamburger menuhorizontal dots menuvertical dots menumagnifying glassplus symbol

The magnifying glass icon is certainly better than these cryptic symbols, as it has a real life analog. But there still is an ambiguity. Does it mean "find"/"search" or "magnify"/"zoom"? Using a magnifying glass for "magnify"/"zoom", is nice and direct. A magnifying glass, as its name implies, is used to magnify things.

Using a magnifying glass for "find"/"search" is a metaphor for Sherlock Holmes searching for clues. While at this point, the icon is ubiquitous enough in modern applications, that most users can figure it out, it is still a poor UI icon for "search"/"find". Relying on people being familiar with a literary character, while good for scavenger hunts, is a bad way to design a UI.

A plus icon for "new" or "add", is an little bit more clear than a magnifying glass for "search", but it still has issues. A plus symbol may mean "add", "positive", "plus", "increase", and while not likely to be the case in many apps, is sometimes used to represent Christianity.

Pictures are good for illustration, not communication, and a GUI is way for a human to communicate with a computer, and vice versa. Words are currently the most effective form of communication, written or spoken.

No one uses just one piece of software

On the desktop applications have started using their own custom window dressings. Chrome, which would otherwise be a fine browser, does not use a window manager's borders and buttons. At first glance this might not seem like a big deal, since you still get the standard minimize, maximize, and close buttons in the top right. But unlike with the dressing of my window manager, I loose the draggable resize points on the bottom when its maximized. So Google's effort to make the browser look pretty, they have impeded its functionality.

gimp window decorationA Gimp window which uses standard window manager decoration. chrome window decorationA Chrome window which uses its own custom window decoration. evince window decorationAn Evince window with client side decoration.

Linux users know Google is not alone in this. GTK3 started client side decoration. This was done in the name of "reclaiming" pixels used by the title bar in window managers. But for users this means each window may behave differently. It also disables any features a window manager exposes through the title bar. Fluxbox for example, allows for adjusting transparency, reducing the window to just a title bar, and sending it to different workspaces. A number of years ago, Martin Gräßlin detailed why client side decoration is bad for KDE.

If you use keyboard shortcuts to interact with your web browser or desktop, you will find many Google sites use keyboard bindings by default. This breaks these normal keyboard shortcuts for the browser or desktop, which is an exceptionally bad user experience. As a developer, it is easy to think about how a user interacts with your application/website, and nothing else. Developers of web, desktop, tablet, and phone applications should remember theirs will be just one of many applications the user interacts with.

The User is the most important part of UI and UX

Recently, the iOS 11 calculator put fancy animations before working correctly. A $700 iPhone from 2017 cannot process input as fast as a Sharp EL-8 from 1971. For the iOS calculator to work correctly (until the patch is released), you have to pause and wait between button presses, and are given no indication that your input is incorrect if you do not.

trackpad

Track pads with physical buttons and marked scroll areas are now a thing of the past. Product designers decided a featureless trackpad was more aesthetically pleasing, and users of it are left simply hoping the computer will interpret their finger movements and positions as "left click", "right click", and "scroll".

It is bad enough when products are designed to look pretty first, and be easy to use second. But a perhaps a worse sin is products that are designed to demo well, above usability. Gestures are the flag ship UI feature for this usability failure. No one possibly thought that a scroll wheel or pressing ALT+TAB was too difficult, and that instead it would be easier to make some arcane finger movements on a trackpad in order to interact with windows. Pretending you are Harry Potter when interacting with your computer certainly looks cool if you are on a stage. Not so cool when you are actually trying to use your computer.