Dry Goods: App user illustration design

The rational application of illustrations can help the user to understand your product and realize the differentiated design. The author hopes this article will give you some help in the future illustration design.

In the early stage of Internet products, the app for users more means a tool, interface design pay attention to "professional", user requirements are not too high, understand can use on the line. But as the contact between the mobile phone and the user becomes more and more close, now we wake up in the morning, the first thing we do is to turn on the phone, and at night we often sleep with the phone. Mobile phone is not just a tool, it begins to become part of our body, or an extension of the body.

User requirements for the app also rise, for the new era of users, the app is not only a collection of functions, but also to meet their emotional needs. The site also faces the same challenge. How to make products meet the emotional needs of users and then establish a connection with it began to become a common theme of designers. The rational application of illustrations may help us.

humanized Handling

Users of the traditional Internet products a big spit groove is too "mechanical sense", the designers of the product has been humanized treatment. Take the Google Calendar example, the General Calendar class application interface can be done very simple, directly to the user to show a "calendar" on the line, the user can also read. But Google Calendar is very clever use of illustrations, and every one months will be replaced, which can be a good way to close the distance between the user and the product.

Similarly, we can see Ningbo Bank Direct Bank, its icon every quarter will be replaced. Regular replacement of the icon/illustration break the traditional static, more can get the user's favor.

Google Calendar's preference for illustrations is more than that, and we find that in the user's personal agenda, such as when you add an event schedule "8 o'clock and a colleague Jimmy for coffee", the event will be a playful and cute coffee illustration. Users ' moods can be mobilized, especially for the low-age and female users, who love this interesting illustration.

Efficient communication of information

In addition, users are far more aware of figurative elements (illustrations, icons, images, or photographic drawings, etc.) than words. So the same schedule, the use of illustrations, users can understand in a very short time, this is a colleague's coffee date, that is to go to the dentist's doctor.

According to a Nielsen statistic, the average user reads only 28% of the text content per page. This means that, in the face of large pieces of text, users rarely read, they are more "scan".

In intercom, for example, almost every page of the site is equipped with Quentin Vijoux illustrations. Its eclectic, whimsical style is fascinating. Of course, the illustrations here are not just for good looks, but each illustration is associated with its page content. The user does not even have to look at the text, through the illustrations depicted on the scene can know the general content of the page. Illustrations here can be said to replace the traditional meaning of the "title" role, but this "title" more efficient.

The application of illustration in intercom can help its brand to establish the image. At present, there are a lot of similar products in the market and similar design, the end user chooses which product may be because he thought there is a page of the giraffe illustrations very good.

Increase product Interest

Know Lupus is a website designed to help people with the disease of lupus. We all know that medical knowledge is more obscure and difficult to understand, so the learning process is rather dull. To change this dilemma, the designers made a card quiz game of the learning process. Entertaining, and the introduction of illustrations and dynamic effects, so that the whole learning process is full of fun.

Illustration or image

The figurative elements can not only better communicate the information, but also attract the user's attention. So what can an illustrator do with a picture (Photo map)? It's not entirely possible.

This is a university Student Employment website page, on the left is some important employment information, on the right is a picture of two college students. The small blue dots represent the areas where the user's attention is distributed, and the study shows that the image is easily overlooked by the user as a decorative object if there is more important content or the image itself does not have any meaning.

Of course this does not mean that we need to delete all the images in the page, the image is still an important design element, we have to learn how to use the correct.

In the following page, the user can see the team member information, we find that the user's attention will be focused on the member's avatar. Why the same image, the treatment is so much worse? Because the image here is meaningful and functional, not a decorative object. Users can quickly and accurately know the identity of the group through the Avatar, which is much faster than the names of the group members, so users will focus more on the image.

In the above example, the image becomes the carrier of the message, which is no longer just the ornament of the content, which is itself the content.

In addition, illustrations are more widely used than images because illustrations are more practical in UI design. Because both illustrations and images are intended to allow users to better accept the content of the page, and now the content of the page is becoming more and more abstract, the image is difficult to directly express.

Dropbox Carousel is an app that manages photos and videos for Dropbox users. Even though the app is mostly designed for photography, designers are abandoning the picture when it comes to UI design. Because they think, users see a picture, as long as the protagonist is not himself, they are difficult to create a sense of relevance. Compared to the birthday scene, the use of illustrations here will give us a very warm feeling. It would weaken if it was a real person, because it wasn't me. Compared to the picture, the user has a sense of the generation of illustrations.

In addition, one of the reasons I mentioned earlier about the Konw Lupus Web site is that if you show a person a picture of a real-life lupus patient directly, it may cause discomfort. Illustrations can be cartoon treatment of patients, here also deliberately omitted the patient's facial expression.

Summarize

We always say that we want to give the user a good experience, but what is a good experience? I think a good experience should exceed user expectations and give users some sense. I believe that the rational use of illustrations can be very good to help users understand your products, to achieve differentiated design. I hope this article will give you some help in the future illustration design.

Article Source: http://www.haitaoit.com/

Dry Goods: App user illustration design