Guide the user's visual flow design: The simplest way to interpret visual information

Article Description: find the simplest and most straightforward way to read incomplete visual information.

If your first impression of a design is very deep, or if you instinctively feel that a design is very strong, then it is very likely that you will be "Gestalt"!

Many design preferences currently apply one or more Gestalt psychology principles. This move will not only make the design more smart feeling, but also easier than the general design to retain the appreciation of the eyes.

The gestalt is the transliteration of German gestalt, which is often translated into form (form) or shape, so the starting point of Gestalt psychology is "shape". But the shape is not just the form or shape of the general meaning, but also the whole of experience organized by perceptual activity, and the Chinese translation of "Gestalt". It considers the nature of the overall decision part, and partly in conformity with the whole.

The core of Gestalt psychology: Finding the simplest and direct way to interpret incomplete visual information.

In addition to design, Gestalt psychology plays its part in the daily life of communication: for example, a smiley face in an email or message: D, it simply adds a letter to a symbol, and people express the meaning of laughter through them. "Symbolic expression" is also the Gestalt psychology is playing a role.

One of the most classic cases in Gestalt psychology

Therefore, Gestalt psychology in the interactive design of Web pages or applications can instruct designers how to convey richer information to users in a limited space. Flexible use of gestalt psychology can help designers to design an architecture or a subordinate relationship within a page, and use these principles to design elements of the page that are particularly important to the user's attention, and to create a balance and solidity that is profoundly influential. These designs can make it easier for users to interpret our interface.

We've got some idea of gestalt psychology, so how do we use Gestalt psychology to make our design more influential?
Now, let's take a look at the Five Principles of Gestalt psychology:

• The Law of similarity: The subconscious mind of a person is automatically integrated into a set or a whole in terms of shape, color, size, brightness, and other similar elements in sight.

We compare the following two pictures, the left side of the picture is black dot, will make us feel that they are a whole. At this point, if we change some of these black dots into red dots (the right one), according to our subconscious classification, we automatically set the black dots together, and the red dots are grouped together, each of which becomes a grouping. So the original unitary whole was cut into five groups. Following

According to the principle of similarity, it is easy to assemble the elements belonging to the same kind of purpose. For example, the image below is a screenshot of the contents of a system folder, and usually the same type of file appears in the folder with the same icon, so even if the files are fragmented, we subconsciously group the files below.

In the other case, when I circle a part of the file, the selected and unselected files become visually different in both sets of content.

So the similarity rule can be applied in the following form design, even if the input frame is far away from the main content, but the user will still link their two one by one corresponding.

• The law of proximity: in consciousness, we often tend to integrate the elements of space or time into a set or a whole.

Continue to take the previous point for example, the dots at this point, although red and black are arranged in a piece, but we will at this time the distance of the red and black points into a group.

This principle is the most common form of page content in a Web page, and the page content is grouped by leaving white (whitespace or native space).
For example, the bottom of this Baidu paste directory local design. By placing the contents of the same directory slightly closer to one another, and separated from the other directory a relatively large distance. In visual reading, users will naturally agree that the following content is divided into two themes.

[1] [2] Next page