Interactive Design Research: the use of visual attention in design

The physical world exists objectively, while the human "visual imaging" is the "idealism" reconstruction of the current world. This reconstruction is based on personal "experience", "perception" and "collective consciousness". At first, scientists believed that human beings created a personal Visual database by visually passively acquiring all the image information of the world around them, and that nearly 10 years of research have shown that capturing "all image information" is a myth, which was created by psychologists Daniel T. Levin and Daniel J. Simons. The real world "objectively illustrates the fact that the brain uses 1/10 seconds of eyeball speed to get important information that will serve the core tasks in progress." For example, your brain sends instructions to the eyeball to read the text and lets you ignore other information about the navigation on the right side of the article.

The picture on the left is the effect of the camera shooting, the right picture is the human visual attention

Because of this characteristic, the study of "visual attention" has become particularly important. How to make it easier for users to find our products? How to make the business more effective advertising? How to make our web page and software more easy to touch users, more Meng point? ... Understand three concepts first before delving into the problem.

　

Visual Information Processing process

There are 14 billion-16 billion neurons in the cerebral cortex, of which less than 1/10 are commonly used, and five have fewer neurons, so it is necessary to make organic screening when you open your eyes and have a lot of visual information input, which is also a long evolutionary optimization result. Some medical writings have mentioned that visual information processing requires more than 24 processes, and Colin ware it into three stages, roughly: first, basic information extraction, parallel processing of several characteristics; Secondly, according to the purpose of the need to screen the focus of the content; third, to save the key objectives, Lenovo related description. (See Visual Thinking for design in detail)

　

Passive attention and active attention

"Passive attention" is also referred to as "stimulus triggered", according to the three-order model of Colin Ware, it can be understood that the most basic visual elements, color, position, order and contour form-> filter redundant information, construct complex images in order, shape three-dimensional models, and so on-> confirm information objects, and from "experience" Get more information to describe the object. can refer to schematic diagram:

For example, the bottom right corner of the pop-up ads, our eyes first saw the bottom right corner of a box, a lot of colors in the beat, and then see clearly is a person in the dance, the last is to confirm the original is * * Company ads. Visual information is a kind of biological current pulse signal, which is transmitted to the brain by the brain, which actively confirms the event, and forms a cyclic process. But the "attention" event is not necessarily a matter of eyeball initiation, the "active attention" initiated by the brain, also known as "concept Initiation". For example, to open the download page, we look for "download button", is "active attention" of the typical example.

　

There are a lot of such concepts, and interested friends can find some medical works or visual theory to study themselves, and I do not swim a fish. Let's go back to the subject, how to make the design easier to attract people? Or what are the factors that affect visual attention and cause visual disturbances?

　

Let's take a look at the three stages that have just been summed up: "The most basic visual elements, color, position, order, contour and other interwoven form-> filter redundant information, orderly construction of complex images, modeling three-dimensional model, such as-> recognition information objects, and from ' experience ' to get more information to describe the (The active concern is the reverse line). A problem can be found when the first phase gets less information, the faster the second phase of filtering and building events, the faster the "concept" is reached in the third phase, and the assumption that a 1/10-second gain of information can be repeated 10 times in a second, which means you can get a better impression of the goal. Let me give you two examples. Muji's design advocates simple and practical, simple and full of creativity, unified visual standards and no decoration instead makes it easier for users to remember the brand. Bus Station light Box advertising is also the case, from the bus stop to leave often only dozens of seconds, in the car I have no time to read all the information, then the simple design more advantages.

Muji design (Pictures from Muji website)

So what if the first stage has to have more information? At present, our design does encounter such a problem, there is a lot of information need to focus on a small picture, then disorderly piling information is fatal. Let's take a look at this picture:

Apple design (image from Apple website)

It's also a lot of information, but there's no clutter that can quickly find what I'm focusing on, and non-critical elements don't distract me too much. How did you do that? Please read the ladder diagram again.

　

Yes, the brain picks the basics from the start, so there are only two ways to optimize the design: first, reduce the underlying element information, and help the "user" brain organize the underlying element information first. When the amount of information is too high, "passive attention" users will often have "escape" mentality (really see-_-), this time was "designed" the basic information will attract users to continue to focus on or guide users to focus on specific information, in order to achieve business promotion or we want users to further operate the purpose. More easily, when a lot of information is available, you can emphasize key information by color, composition, light and shade, flashing, symbol-oriented, contrast-enhanced, and so on (the detailed approach can refer to other CDC colleagues ' articles). Perhaps you will also ask: "Active attention" of the user does not exist distraction problem?? Not too! Think back to the university class scene, we in the "active attention" teacher sharing knowledge, in the mind is not often thinking about the next class of her (he) ... The reality is that "active attention" users are more difficult to serve than "passive attention" users. The specific analysis has to wait for a later time to continue to write.

　

Finally, thanks to Colin Ware, his "Visual Thinking for design" triggers my motivation to write this article. Also thank you for patience to adhere to read this article, hope that the basis of visual theory for everyone to help.