How to use "visual expression" to establish the information hierarchy of webpages _Shang ping China focuses on high quality website construction

Website construction company Shangpin China, Whether there is a theoretical basis behind these methods is the theme of this paper.

First, look at the following two pictures. The left picture shows the effect of the camera, and the right picture shows the effect when the human eye does not move. It can be found that the information acquisition by the human eye is not done at once. It can not produce multiple focuses at the same time to stay in more places. What designers need to consider is that users can obtain information in a certain order by moving their eyes, The process of helping to acquire and understand is efficient and natural.

The left picture shows the effect taken by the camera, and the right picture shows the effect seen when the human eye is not moving

This design method mainly aims to solve two problems:

1. Professionalism of designers

Designers consciously analyze the priority of information, understand which visual expression techniques can establish the information hierarchy and the theoretical basis behind each method, and not only design by feeling.

2. Efficiency of users' access to and understanding of information

The establishment of a good information hierarchy can enable users to quickly acquire and understand useful and interesting information in a limited time, and generate the next action;

1、 Early understanding&analysis

Before starting the design, in addition to understanding the background goals of the project itself, the visual designer also needs to know some content for specific pages to help guide the later design, including page positioning, atmosphere creation, information priority and user core behavior.

1.1. Page positioning is the premise to help analyze page information priority and core behavior

Usually:

Who is the user

Where the user comes from, i.e. from what channel

Page content positioning, what to provide and what not to provide

Page function

for instance:

When designing and purchasing directly to the new home page of the market, we determine that the core target user of the home page is the new buyer through interactive analysis of the familiarity of the users of the page with the service; The content orientation of the page is to show the value of the market, and the data generated by the user enables new buyers to recognize the brand of direct purchase;

We are on the new home page of design purchase direct to the market

1.2. Understanding the atmosphere that the page needs to create can help us judge which elements can help us achieve the goal. The atmosphere can be the content itself, or it can be created through the design of visual elements, but it must be noted that the atmosphere creation should not be stronger than the content itself that users pay attention to

The atmosphere may include:

New Year theme promotion

Low discount

Fresh information

Active users, etc

The following is the official page of the promotion activity. The left figure continues the atmosphere of the carnival in the warm-up period, but the atmosphere is no longer the focus at the beginning of the activity. Users are more concerned about the commodities and discounts themselves. The right figure is the combination of atmosphere creation and category pictures after adjustment, which well solves the relationship between atmosphere and content.

The following is the official page of the event, and the left picture continues the atmosphere of the carnival in the warm-up period

1.3 Analysis information priority

1) First level information attracts users: assuming that users will only stay on this page for 3-5 seconds, the core selling point of the page is the most attractive, which is the first level information. It must be small and refined, and should be highlighted in design

2) Secondary information helps to understand: with the attraction of primary information, users may stay for 3-5 minutes to further understand the content. At this time, secondary information, namely, refined essence, is displayed to help users understand the information in the shortest possible time

3) Detailed understanding of the third level information: the first two types of information can basically help users to obtain enough information. If users continue to stay longer to learn more, the amount of this information will be more, and the visual hierarchy will be backward in design, or display and provide access jump through interactive ways

Detailed understanding of Level III information

How to Use "Visual Expression" to Establish the Information Hierarchy of Web Pages

Date：2015-02-28 Source: Shangpin China Type: website encyclopedia
Word Size： small medium big

+86 10-60259772