Without Thinking in GUI Design

It was my first time to come across the concept of “without thinking” when I read a blog entitled “NaotoFukasawa: ‘Core of Consciousness’” in which some examples were listed to specify the author’s viewpoint.

There is an iron railing in the photo. Why is the milk packet put on it?

When tired after long walking, why would we like to sit down on a bare smooth slabstone for a rest?

When we read or play games on the subway, why do we lean back unconsciously against the compartment wall?

……

Why are there so many cases like these and why are there so many “without thinkings”?

Because the square end of the railing resembles the shape of the milk packet;

Because a slabstone is smooth, even and clean, looking so much like a chair in our daily life;

Because people are all instinctively afraid of attacks from behind and they feel safe when they lean against “something”.

……

In the design industry, Donald Norman put forward a theory—excellent designs do not need user manuals! If any user blames himself/herself for being unable to use the product or unable to understand the user manual, all the blame should be put on the designer for being too inconsiderate!!!

Desk lamp with a tray. This type of desk lamp is designed by Naoto Fukasawa, aiming to end the phenomenon that people put their keys and mobile phones randomly on entering their houses and will forget all about the whereabouts of these gadgets when going out. By observing people’s daily behavior, the designer has found out that the first thing most people do when going back home at night is turn on the light. So he studies and makes use of this habit and uses a tray as the stand of a desk lamp. On turning on the light, users of this type of desk lamp will subconsciously put their keys into the tray. When turning off the light on going out, they will surely notice and take their keys with them. It is so natural. No user manual or any notice tells the users to put their gadgets in the tray, however they will automatically follow the designer’s intentions.

The above example is a case of application of exterior shape in real product. The GUI design in Internet and mobile terminal is equally excellent though it is also distinctive. The following are some areas I can think of to serve as a prelude to golden ideas.

Color

Let’s take the you-see-every-day traffic lights as an example. The concept of “Red for stop, green for go and yellow for wait” is already deeply rooted in people’s minds, so implanting the special meaning of the different colors of the traffic lights in the GUI design is just a case in point and users can utilize them readily and instinctively. In the following interface of an Apple software, the red button means closing down, comparable to stop in traffic regulations; the green button denotes amplification, something similar to go in traffic rules; the yellow button means minimizing to status bar, similar to setting aside for use. Besides, the green button is for dialing a number while the red one is for stopping a call. All these are excellent cases of color use.

Shape

Users have built up many concept models in their daily life. They can use correctly without thinking once the designer succeeds in applying these concepts seamlessly into GUI design practice.

Let’s take a look at the following GUI design of WP7 . Every screen, once completely unfolded, resembles an ancient horizontal scroll of painting. But how can it be possible for a first-time user to know all this and unfold the screen horizontally without thinking? Do the green boxes in the following screens resemble our commonly seen labels after you take a close look at them? Do you feel any impulse deep in your heart to take them out and see what they really are? If you do, it is just what the design is meant for. 

The second example is more direct, clear and natural. The picture does not need any explanation and it speaks all for itself.

Position

In my view, position is another platform for wisdom. As in the following picture, we will date the letter and sign our name at the bottom once we finish writing it. Ok, that’s it! The GUI design stipulates that when we open a window or log onto an interface as we commonly do, we always fill with our relevant information first, then check for any error, before finally clicking “Log in” ,”Submit” ”Finish” or ”Next” buttons. This shows that the users’ mental models have been unconsciously influenced by the concept of position.

Afterword

Products can be so well designed that they can be used without user manuals. I think GUI design can also reach the stage where users can understand everything without learning from a handbook. For designers like us, all we need to do is scrutinize, experience and learn from every bit of life so that we, through different designs of color, shape and position, will enable users, first-time users in particular, to know and use the products at will and without thinking.

Peopeo GUI Designer ——Weixu