In this article, the author will summarize the series of articles “APP design under special Circumstances” in the form of interactive walk up table. enjoy~

If you’re already designing, you’ve probably run into situations where development or QA can find something missing in a design review. The problem is not because of a lack of knowledge, but because sometimes there are so many things to consider that it is inevitable that there will be omissions. The establishment of an interactive walk-through table suitable for its own products will reduce the situation of omission as much as possible.

After the introduction of several previous articles on “APP design under special circumstances”, I have introduced the APP design points under special circumstances not related to the main business in APP design. If you have not seen it, you can systematically review it, hoping it can be useful to you. Today, I’ll summarize this series of articles in the form of an interactive walkup table.


Interactive walk – up table

1. The network is abnormal

The page has cached data

There are two cases to consider when a page has cached data:

When switching network environment (from WIFI to cellular data; From cellular data to WIFI), the solution is “pause play and dialog prompt”.

If the network is abnormal, there are two solutions: Toast prompt; The second is the resident list prompt.

The page has no cached data

In this case, it is necessary to have the function of clicking on the page to reload. Some apps provide the button for reloading, while some apps will trigger the reload by clicking on any area of the blank page. In addition, many apps will provide the entrance to set up WIFI.

2. The default page

When you have a page frame

Display page frame + placeholder;

When there is no page frame

Make the design as emotional as possible, and at the same time guide the user to the recommendations.

3. Load and refresh

The page has cached data

(1) Design loading;

(2) Considering the loading failure, the loading failure can be divided into network reasons and other reasons. The Toast prompt is usually used.

The page has no cached data

(1) Design loading;

(2) Considering the loading failure, the loading failure can be divided into network reasons and other reasons. They are designed to be emotional.

The drop-down refresh

Design a pull-down refresh animation, and each refresh can give Toast feedback. For example, on the homepage of Douban, each refresh will prompt you how many updates are made. If the current content is up to date, you can prompt the user that the content is up to date.

load

Because the client can’t load all the content at one time, it has to load in segments and specify how many pieces to load at a time, like Toutiao APP, which I remember correctly loads 60 pieces of data at a time.

Distribution of load

Consider distributed loading, loading text first, then loading images. If the page has a frame, the page frame will appear first, then the text and images will be displayed. Since the image takes a little longer to load, a default placeholder is used to fill the image position during loading.

Asynchronous loading

To reduce user wait time, consider whether asynchronous loading is necessary.

Intelligent load

According to the characteristics of the product, consider whether to load different content in different network environment. For example, zhihu APP can choose to load only text but not pictures in the cellular environment in the Settings to help users save traffic.

4. Other circumstances

Whether the tourist mode is supported

Design of APP launch page

Token fails

Server Exception

Different products need to be checked according to their own characteristics. For example, products involving multimedia playback and download need to be considered when the network environment is switched. Products that must be forced to log in do not need to consider the design of tourist patterns, and so on.

The List Revolution divides human mistakes into two categories. One is ignorance. The other is the fault of incompetence. The fault of ignorance lies in the lack of relevant knowledge, while the fault of incompetence lies not in the lack of correct knowledge, but in the failure to use it correctly. The creation of interactive walkthroughs (lists) reduces the probability that we make incompetent mistakes.

The above is similar to the content of APP page design, if you want to know about mobile marketing skills and mobile website SEO tutorial, you can directly click to view