User Experience analysis: Interaction Design of Information Product reading list

List, which is defined as a form of loading text or charts using tables as containers. Depending on the product type, most of them have their own style list, some become the product subject, and some are the assistance of other pages. The main purpose of the List design is to allow users to quickly browse and scan and select the content they want to "laborious" Click and "time-consuming" to read carefully.

Compared with the traditional reading platform, the reading list is like a directory in a real book. The Directory of the novel is concise: Title + page number; the directory of the magazine is relatively rich: title, subtitle, picture, abstract, page number, exquisite layout, and some even include advertisements. Each type of content has a list suitable for its display. The reading list of information products should be considered as follows:

　1. visual center of gravity

Highlight what users want to see in the product, and guide users to read the key recommended content.

When reading information, it is often affected by text and images, which is not so smooth. According to the human visual psychology, there are several features that are easy to guide or interfere with the direction of vision movement.

1) line of sight Guidance

A. Generally, warm colors are cooler than cold colors and brighter than dim ones, making it easier to attract sight.

Generally, the line of sight is from left to right from top to bottom, but the color guide will change the line of sight sequence. Rational use can focus on the list. Otherwise, it will damage users' psychological expectations, cause reading burden, and affect cognitive efficiency.

　　

 

B. images are more attractive than texts.

Images help text in visual communication, help understanding, and make the layout more three-dimensional and authentic.

　　

 

Most information lists contain thumbnails of the document layout. The positions of thumbnails vary according to product positioning.

It is more focused on products with relatively stable information, and tends to put thumbnails behind the news title. The image quality of such information content is usually average. At the same time, users can read each title in a stable manner and choose their favorite content, the image is only expected to play a secondary title.

For entertaining and fragmented information products, thumbnails are placed before the title, which can more intuitively convey the meaning of the content, thus shortening the time for users to understand the text title, allows users to quickly browse down the image on the right to quickly screen the image.

　　

 

C. loops can converge the line of sight

　　

 

D. The line of sight will move with arrows, numbers, or numbers.

Regular arrows or numbers are arranged, which may lead to excessive page size on one side or a strong reminder. Pay attention to the stability of the page.

　　

 

2) Highlight

If you need an article that you think users will be interested in, or the part that has spent a lot of effort designing really attracts their attention, you need to find a way to "highlight" these parts.

The simplest way is to use a bright style or change the background color of the item. You can also find a location for this article that can highlight other layers, such as placing a thumbnail before the title. However, we also need to consider the overall visual effect of the page. One principle is that "too much emphasis equals no focus ".

　　

 

3) Feedback

Give visual feedback to the content you have read and use interaction methods that are different from "highlighted" content. For example, if you have used dots of different colors to differentiate the focus or common content, do not use dots to indicate that the content has been read. The same style implies the same content in people's minds, while unread and read are two States of the same content.

　2. Do Not Disturb

1) Long list

If you can effectively view the browser, a long list is not a hassle, at least it can make the browser do not have to pay much effort and cost.

There is no need to use standard page numbers in the long list of information categories for the following reasons:

A. From a world of reading content to a world of navigation.

Every time a user chooses a page number to view more content, he needs to drag himself out of the world of reading content and put him in a world of navigation. Users no longer think about what they want to read, but how to find more things to see. Choosing a page number increases the natural pause time and gives users the opportunity to assess whether they want to continue reading or leave directly.

B. In addition, the page number does not have an essential meaning.

The user selects by page number to help them find the content they want to read on page 2nd or earlier. Give him a better method, such as filtering by week, month, year, category, tag and other attributes, far more effective than the page number. There are also many mobile terminals that use the paging indicator control, but it is a good way to remove the number of page numbers.

2) Advertisement

The focus of reading is on content. users do not care about seeing content-related ads or list browsing ads.

Users who often use browsers or free apps should be familiar with the existence of advertisements and understand the meaning of advertisements in products, as long as they do not disturb their normal reading.

A. Do not pretend that an advertisement is an interesting content.

Although this can increase the ad clicks, users will also get angry because they are "cheated" and bring a poor experience.

B. Provide relevant advertisements for the content.

Data shows that users are willing to click ads related to cars. When a user looks at a vehicle model, the corresponding store recommendations provide him with a channel to buy, or even price comparison, of course, the user is happy to go.

C. easy to ignore.

Sometimes, in order to keep the list neat and beautiful, the advertisement is inserted in the list room and pretended to be a project in the list. However, we should try to reduce the visual effect of advertisements to make them look inconspicuous, so that they can be easily skipped without being realized.

Some products that place advertisements on the top of the page have obvious positions, but they can be closed by clicking the button or only shown in the drop-down list.

　　

 

　3. Reading Speed

The neat and repetitive format and the product's policy of grasping the "First screen" make it easy for the process of filtering the reading list to produce a blocking effect similar to "white noise. Good things will produce "Aesthetic Fatigue". After reading for a long time, users will often feel that the content is relatively dull and left the list.

Weibo, as a media of reading, has the advantage of its occasional highlights, keeping reading pace and surprises.

Keeping pace breathing can make the exercise more persistent, and keeping the rhythm of the content will continue reading for a long time. The interaction between fun and fun is repeated, giving users a break and a new interval of interest, plus expectations for the next small surprise, resulting in a comfortable overall product experience, instead of a lot of interesting values and a lot of boring average values.

　　

 

　4. items in the list

Most products include the following items: title, abstract, release date, and operation (click to read more and view more );

Common items: classification, thumbnails, comments, images, and authors.

This article is from the Sohu MUED blog. Please indicate the source when Reprinting

Original article: http://mued.sohu.com/2012/07/list-interaction/