Visual aids in the communication process. Visual communication

Send your good work in the knowledge base is simple. Use the form below

Students, graduate students, young scientists who use the knowledge base in their studies and work will be very grateful to you.

Visual content

Visual content is all visual information that accompanies text: photographs, drawings, diagrams, videos, graphic design, logos, and more. The active use of visualization tools is not only a tribute to the times (few people will read undiluted text today), it is also a real opportunity to attract and retain consumers.

Basic visualization tools

The visual content posted on a printed or web page attracts the attention of the reader in the first place. Image captions, headings, and subheadings are then scanned. And if all this could interest the reader, he will pay attention to the main text. Studies prove that our brain perceives visual information 60 times faster than text, and the duration of stay on a website page increases 10 times due to pictures and photographs. The advantage of visual content over text content is increasingly proven by social networks, in which users prioritize photos and videos. This fact is confirmed by the high popularity of Instagram and Pinterest projects.

Means of visual communication and the place of visual content in them.

Consider below what elements of visual communication can be used as visual content:

Photos, including collages.

Drawings.

Videos, animation, including presentations, flash animation and gif-animation (video sequence created by changing photos).

Infographics: tables, graphs, charts, maps and author's illustrations with the inclusion of text comments.

Page design, corporate identity.

Visualization tools include fonts and colors.

Each element of visual content has its own impact on the reader's perception, to the extent that the basic colors used create a mood for certain information and mood (for example, green corresponds to the theme of nature or finance).

Means and functions of visual content

Features of visual content in comparison with text

Easy assimilation of visual information and the requirements of the modern media market make visualization a necessary attribute of advertising and PR.

1) Photos, videos, infographics are easily and quickly copied, and accordingly are the most efficient in publication, which gives them advantages over texts, allows them to spread faster in the media.

2) The visual content is reproduced as best as possible by modern electronic devices (smartphones, tablets), it is more convenient for perception on a small screen than text. As an example, 75% of smartphone owners watch videos from these devices.

3) High-quality visual content, especially diagrams, infographics, greatly simplifies and accelerates the understanding of complex and extensive information.

5) Many companies have their own social media accounts, and the most visited profiles are distinguished by rich, but at the same time organic visual content that attracts users with aesthetics, usefulness, and originality. So, Starbucks (photo above), Fanta, Coca Cola, Corner Of Art design studio (Photo below) successfully designed their Facebook pages.

Photo tasks

Photographic images are the most common type of visual content in the media and on the Internet. In addition to the fact that a successful photo attracts the attention of the audience, and, accordingly, gives a better chance of reading your text, the photo also performs other tasks.

Product photos allow customers to better represent the company's products.

Photos of real company employees on its website additionally attract users to view the resource: people are interested in knowing the brand by sight.

In business, photographic images are rarely placed without processing: it allows you to pay attention to individual details (image enlargement), hide or, if necessary, highlight flaws.

Experts point out that when choosing a photo for text content, its information content is very important. The more useful information a photo contains for the audience, the more visitors will stay on your page.

The LPgenerator platform publishes the results of comparing the page traffic of two online stores - Pottery Barn and Amazon. On a larger page trading network- Amazon - fewer photo views than Pottery Barn. There are two reasons for this: an image of a TV provides less information than a photo of a bookcase; the photos in the Amazon store are more generalized, which makes it easier to work with a large mass of them, while the Pottery Barn has a smaller assortment and has the ability to post more detailed pictures.

Features of infographics

The main purpose of infographics is to simplify the presentation of complex material. If developers of visual content use enough imagination and ingenuity, then the data that could make up a complex and boring text will turn into a capacious picture with small verbal comments. With a successful implementation of the idea, your infographics are simply doomed to a lot of views and copies in media resources. In other words, "an image that tells the whole story is easier to copy than a full text article." According to some reports, users get acquainted with information transmitted in the form of infographics 30 times more often than with any other. Let's give an illustrative example. In 2012 American company WordStream compared the performance of Facebook and Google's Display Network as ad platforms. To draw attention to the results of their research, the company designed them in the form of infographics (Photo 6). A few days later, this infographic with reference to WordStream was published by several major American media: USA Today, CNN, Fast Company, The Economist and others. And a week after the infographic appeared on the company's website, the Google system found more than 13 thousand articles with the mention of WordStream, most of which had this infographic with a link to the original site.

The secret of video popularity

Video content is the most effective method transmission of information, since the combination of visual and auditory series is perceived faster and easier to assimilate. Not surprisingly, television and videos on the Internet remain at their height. By the way, 71.6% of users global network watch video content at least once a week. Other statistics show that users spend twice as much time on a site with a video. And those who watched a video about a product are 85% more likely to make a purchase from what they saw. And, of course, increasing the length of time users spend on your site increases its position in search engines.

"Information is beautiful" is the translation of the TED talk by David McCandles, who is convinced that visual information and data is the future:

We are sure that we have given enough examples to convince our readers of the high efficiency of visual content in the preparation of various kinds of PR and information messages. We emphasize once again that visualization is the most prompt, capacious and effective way of delivering the necessary data to the audience, as well as the most popular.

Definition 1

Visual communication is a type of interaction in which information is transmitted using sign systems, images, infographics, images.

The main difference between this type of communicative interaction is the fact that communication, in whole or in part, relies on sight.

In modern society, visual communications are at the stage of their intensive development, realizing several urgent tasks. The over-intensification of the rate of development of this type of interaction is due to the active introduction into social reality of modern information and communication technologies that facilitate the transfer of visual images. Visual communication today is an integral part of the activities of the media, social media, etc.

Approaches to understanding the essence of the definition of visual communication in the framework of social psychology

Visual communications are one of the fundamental categories of social psychology. Within the framework of the stated direction of scientific knowledge, this type of interaction is interpersonal communication based on visual, optical interaction. Instruments non-verbal communication signals of movements appear - gestures, facial expressions, postures, eye contact, gait, as well as physiognomy - the structure of the body, the structure of the face, skull. These means of interaction organically complement the verbal signals, help to clarify and correct the meaning of what was said.

Visual communication functions

Visual communication tools successfully implement a number of relevant functions, including the following:

informational - the function of transmitting information messages;
expressive - the ability not only to convey meaning, but also to subjectively evaluate the meaning of a message;
pragmatic - the ability to translate communicative attitudes that have a certain impact on the recipient.

Optical-kinetic subsystem of visual communications

The implementation of visual communication interaction largely depends on appearance the interlocutor, his facial expressions, facial expressions, gestures, postures, body movements, etc., forming the optical-kinetic subsystem of communication.

Definition 2

In modern scientific literature, kinetic gestures are understood as a set of movements of the hands, head, and other parts of the body that accompany the speech of a person, emphasizing the meaning of what was said.

There are more than a million bodily signals, signs that can be used by a person in the process of interaction. Gestures can emphasize the meaning of what has been said, enhance the expressiveness of the information message. At the same time, inappropriate use of gestures can betray confusion, uncertainty of the communicant, and possible lies contained in the words. Indirect evidence that a person is not telling the truth is such gestures as licking lips, rubbing eyelids, avoiding a direct look, protecting the mouth with a hand, an expressionless voice, etc.

There are a number of gestures that indicate the openness or closeness of a person for communication. Open, unclosed palms are evidence that a person is inclined towards frank, sincere communication. On the contrary, interlocking fingers tend to act as a negative signal that betrays disappointment, a desire to suppress emotions. Grabbing the wrist with a hand can signal a person's nervousness, insecurity. Crossed arms betray a negative or defensive position of one of the interaction actors. Interlaced fingers can signal disappointment, dislike, nervous tension.

Thus, visual communication in social psychology is an integral component of interpersonal communication, organically complementing, clarifying the meaning of a verbal message, and in some cases completely refuting it.

Andrey Baturin, July 27, 2017

Andrey Baturin

It's not the first time to say that a site should not wander around the endless expanses of the web because it just is. It has its own tasks and goals, which can be achieved through communication with the user. Obviously, he cannot sit quietly in the kitchen over a cup of tea with his visitor. But he has his own ways of communication, which are no worse, and in some ways even better than conversation.

Today, visual communication is extremely developed and is designed to perform several tasks at once. In web design, they play an important role: thanks to their competent use, the user performs targeted actions, can navigate well in the spaces of the site and interact with it.

Visual communication is a type of communication in which the transmission of information relies partly or entirely on sight.

Color

In many areas, color plays a big role. With regard to communication, the perception of colors is similar for all of us, and therefore they easily convey their message to huge audiences.

Red- emotionally this color is perceived as important, confident and domineering. It attracts our attention more than other colors and, as a result, is used for warnings and important announcements. In website design, color can convey the following emotional messages: passion, energy, importance, strength, blood, etc. You need to use it wisely, otherwise there is a risk of scaring off the audience, which seeks to leave the “dangerous” zone as soon as possible, full of an aggressive shade.

Orange- a cheerful and cheerful neighbor of red in the spectrum. Color is associated with energy, youth, movement and cheerfulness.

Yellow- cheerful, juicy and sunny color. Its use and meaning depends on the selected shade. So, for example, bright yellow carries positive energy, and its darker shades, such as gold, send us back to the noble and wise antiquity.

Green- a transitional color from yellow to blue, from warm to cold, which combines the characteristics of both colors and is on the verge of relaxing and invigorating. The result is a balanced and stable color. Depending on the shade, it is used for different purposes: brighter colors symbolize freshness, environmental friendliness, and darker ones - abundance and luxury.

Blue- a cool color, the meaning of which also depends on the shade used. Lighter shades carry the meaning of safety, openness and friendliness. This is especially noticeable in the world social networks, where every second developer chooses exactly on them. Darker tones evoke in us associations with reliability and inspire confidence, as a result of which they are in great demand among corporate sites.

Violet- historically, we associate purple as truly royal, with a hint of luxury. Again, to the difference in shades: if light ones, such as lilac, evoke feelings of romance and lightness, then dark shades are the embodiment of rich chic.

Black is the strongest of the neutral colors, and is used on almost every site. Its meaning depends on the colors used with it in the palette. As a primary color, it can be associated with evil and aggression, however, for most sites, black is used to create a sense of sophistication. To achieve an elegant effect, black is used together with white.

White- White in Western culture is associated with kindness and innocence. Most often on websites, it is used as a background for minimalist designs. The abundance of white creates a feeling of lightness and purity.

Brown- the color is natural: it surrounds us in nature and is inseparable from it. Brown conveys warmth, integrity and honesty. Lighter shades are associated with comfort and coziness, while darker shades bear signs of conservatism and are more often considered masculine.

Pictorgamma

A pictogram is a sign that denotes an object or phenomenon, using its most important recognizable characteristics.

It is usually presented rather schematically. The image of a shopping basket in the corner of an online store page is a pictogram, a question mark at the word "Help" is a pictogram, a gear for the settings menu is a pictogram. The site communicates with us using these icons, ergonomically using the space of the page blocks. The principle of their work is based on associations that evoke in us images: if a lightning is drawn here, then there is electricity, and electricity hits painfully, and you can die ... so I probably won't go into this transformer box.

Banners

Banners are a graphic image of an advertising nature.

It can be either a static picture or a sticky interactive element. Usually banners contain a link to the site of the advertised product.

There are several types of banners:

Static images- a common, well-known and gradually disappearing banner-picture.

Animated images- banners that can shine and shimmer, tell whole stories and generally be quite sticky. Due to the animation, they attract more attention than the previous type, and as a result, they are more effective. But the main thing is not to overdo it, otherwise the abundance of animation will bring users to epilepsy, and there will be no one to perform targeted actions :(

Richtext- Literally “text-rich” banners are text blocks. They are the most ordinary-looking of all types, but you should not remove them from the arsenal. There are times when colorful ads are simply inappropriate.

Interactive- the block most beloved by users, in which there is an opportunity to have a little fun by feeding, for example, a cat on a Whiskas advertising banner, or to play a real mini-game within advertising campaign... Such banners rarely go unnoticed.

Banners have several tasks:

The task of selling a product is to attract, interest and push a potential client to the target action (going to the site, ordering a product or service, etc.).

Branding challenge or image challenge is to increase brand awareness and the formation of emotional associations.

Have you ever looked up at the sky and noticed an oddly shaped cloud that resembles an animal or a familiar object? Have you ever wondered why and how you make this association just by looking at a gas clot? This is all because of the way your brain!

Your brain is always trying to understand the world by comparing previous experiences or visual patterns and connecting the dots... He has his own "strange" way of perceiving shapes and forms, grouping information, filling in gaps in order to paint the big picture.

Understanding How Your Brain Works Will Help You become a wiser designer; a master manipulator of visual communication. This can help you determine which visual elements are most effective in a specific situation, so you can use them to influence perception, direct attention, and induce behavioral changes. This is especially useful when it comes to goal orientation, problem solving, intuitive design; user interface design.

“Great designers understand the powerful role that psychology plays in visual perception. What happens when someone's eye looks at your design creations? How does their mind react to the message your product conveys?
- Laura Boucher, Brand Content Strategist at Autodesk

It is already clear that the visual design and psychology are related and can influence each other. Gestalt principles can help us understand and control these connections.

What is Gestalt?

Gestalt ("form" in German) is a group of principles of visual perception developed by German psychologists in the 1920s. It is based on the theory that "an organized whole is perceived as more than the sum of its parts."

"The whole is not the same as the sum of the parts."
- Kurt Koffka

The principles of Gestalt psychology attempt to describe how people perceive visual elements when applied certain conditions. They are based on four key ideas:

Revealing

People tend to identify elements in a general form first. Our brains recognize a simple, well-defined object faster than a detailed one.

Reification

People can recognize objects even if parts of them are missing. Our brains match what we see with familiar patterns in our memory and fill in the blanks.

Multi-stability

People often interpret ambiguous objects in more than one way. Our brains will bounce back and forth between alternatives, looking for certainty. As a result, one point of view will become dominant, while the other will become difficult to see.

Constancy

Humans can recognize simple objects regardless of their rotation, scale, or displacement. Our brains can perceive objects from different angles, despite their different appearance.

Here are gestalt principles that can provide interesting information about modern interface design.

Proximity

Elements that are close together are perceived as more connected than those that are farther apart. Thus, the various elements are viewed primarily as a group and not as separate elements.

How to apply the principle of proximity to interface design?

We can use the principle of proximity in interface design to group similar information, organize content, and organize structure. Its correct use will have a positive impact on visual communication and user experience.

As the principle states, elements that are related to each other should remain close to each other, while unrelated elements should remain separate. Space is vital here as it creates contrast by guiding users' eyes in the right direction. White space can enhance visual hierarchy and information flow, making layouts easier to read and view. This will help users reach their goals faster and delve deeper into content.

We can apply proximity to almost everything from navigation, cards, galleries and banners to lists, body copy, and pagination.

General area

Similar to the principle of proximity, items located in the same area are perceived as grouped.

How to apply the principle general area to interface design?

The common area principle is especially useful. It can help group information and organize content, but it can also provide content separation or act as a focal point. This improves hierarchy, scannability and helps in promoting information.

The common area principle can contain many different elements, grouping them into larger groups. We can achieve this using lines, colors, shapes and shadows. It can often be used to bring items to the front, indicating interaction or importance.

A good example of a common area would be an interface map template; a well-defined rectangular space with different blocks of information presented as a whole. Good examples also banners and tables.

Similarity

Items that have similar visual characteristics are perceived to be more related than those that do not have similar characteristics.

How to apply the principle of similarity to interface design?

We tend to perceive similar elements as grouped or as a pattern. We may also think that they serve the same purpose. Similarity can help us organize and classify objects within a group and associate them with a specific value or function.

Exists different ways make elements perceived as similar and therefore related. These include similarities in color, size, shape, texture, angle, and orientation; some of them are more sociable than others (for example, color> size> shape). When similarity arises, the object can be distinguished by being different from the rest; this is called "Anomaly" and can be used to create contrast or visual weight. This can draw the user's attention to a specific piece of content (focal point), helping to find the desired element.

We can use the principle of similarity in navigation, links, buttons, headings, calls to action, and more.

Completion of the image (isolation)

A group of elements is often perceived as one recognizable shape or figure. Completion of the image also occurs when the object is incomplete, or its parts are not closed.

How to apply the principle of isolation to interface design?

As the principle of closure says, when presenting the right amount of information, our brain will draw conclusions, filling in the gaps and creating a single whole. In this way, we can reduce the number of elements required to convey information, reduce complexity, and create more attractive designs. Closure can help us minimize visual noise and convey a message, reinforcing a concept in a fairly small space.

We can use the principle of isolation to create icons, where simplicity helps convey meaning quickly and clearly.

Symmetry

Symmetrical elements tend to be perceived as belonging to each other regardless of their distance, giving us a sense of solidity and order.

How to apply the principle of symmetry in interface design?

Symmetrical elements are simple, harmonious and visually pleasing. Our eyes seek these attributes along with order and stability in order to understand the world. For this reason, symmetry is a useful tool for communicating information quickly and efficiently. Symmetry helps us focus on what's important.

Symmetrical compositions are satisfying, but they can also get a little dull and static. Visual symmetry tends to be more dynamic and interesting. Adding an asymmetrical element to a symmetrical design can help grab attention. For example, this can be used for calls to action. Symmetry along with healthy asymmetry is important in any design.

It's good to use symmetry for galleries, product display, listings, navigation, banners, and any content-heavy page.

Continuity (Continued)

Elements that are in a line or soft curve are perceived to be more connected than random or hard lines.

How to apply the principle of continuity in interface design?

Items following the continuous line are perceived as grouped. The softer the line segments, the more we see them as a single shape; our mind prefers the path of least resistance.

Continuity helps us interpret direction and movement in a composition. This happens when the elements are aligned, and it can help our eyes move smoothly across the page, improving the legibility of content. The principle of continuity enhances the perception of grouped information, creates order and guides users through different segments of content. A discontinuity can signal the end of a section by drawing attention to a new piece of content.