Form follows function. That simple and elegant sentence has been the credo the Bauhaus designed their building and objects, as did Braun their electronic devices from the 50th. And though there is a distinct beauty in its simplicity this sentence goes beyond making some look pretty but always put functionality first. Something we in the tech industry failed miserably at for the last few decades by giving every feature its button and not cutting down features. But the latest trend to go for beautiful web designs also doesn’t cut it. Because a great design goes beyond beauty and often actually against it.
The most obvious case of creating something beautiful but totally unsuable is the Alessi Juicy Salif lemon squeezer. Though it looks beautiful it totally unsable in the kitchen. Not only is it to big to be used it also completely messy when used and even breaks most of the squeezers. Having to look into productivity, especially todo-list apps, I found this trend to be happening there as well. Many, many tools and systems showing up lately focus on a beautiful layout and by that totally missing the point.
And that lies in the fact how beauty is perceived. It is known that humans consider harmony and symmetrically beautiful. A face you could mirror on central axis is what we consider the most beautiful and the closer you get to it, the prettier it looks to our eyes. But if you go for productivity that is actually the wrong approach. Because symmetrically and harmony also put things on the same level, flatten hierarchies and levels of access. And that actually makes it less accessible and therefore less usable.
My most famous example is this cd-disk-radio-player my parents have in their bathroom. It is totally evened out, the centre is the cd-disk, some play, pause, skip buttons right on it, to its left and right on the bottom we have all the other buttons like tune the frequency, the number buttons for the preset station selection and the volume buttons. For the eye everything is consistent and looks good, everything is evened out, leveled and in harmony. But usability wise it is completely and utterly broken and useless.
Every time there is a good song in the radio and I do want to pump up the volume I have to look for the button because it is everything but obvious. You won’t believe how often I accidentally switched to another station or started the cd player instead. And I am everything from a tech novice. But putting these buttons on the same accessibility level as the volume is simply wrong. One I use a lot (the volume), the others are used more rarely (switching stations), many I do not use more than once in the life time of the device (programming stations). Why should they ever be on the same level?
They shouldn’t. That is bad design. Cluttering this accessibility level with not-used functionality is wrong. The volume buttons have to stand out. They need to be obvious and fat. But then they wouldn’t blend into the design anymore and it would look less pretty. At least in this case. But I’d argue that this argument actually is invalid. Like braun showed in the 50th, it is merely you being unable to make it not only pretty but actually usable. So, please, stop making web apps just look pretty by adding nice background graphics and focus on putting the buttons and actions at the right place on the right accessibility level.