Tutorial on Creating a Mobile Interaction Design Checklist

For mobile applications, mobile scenarios are very complex and devices are also diverse. So after designing and before design review, are the details considered in your interactive draft complete? Are there any omissions in the description of special states? How do you find some problems in advance and fill in the gaps? To solve this problem, our team has established an interactive design self-checklist, and iterates synchronously during the version iteration process to supplement new abnormal points. This table sorts out various abnormal situations when users complete specific tasks. It does not show all the details of the interaction, but it can provide a comprehensive perspective of user experience for specific goals. This goal may be high-level, for example: how to display when there is no network for a certain operation; how to deal with poor network, etc. In this process, the solutions may be different due to special usage scenarios, but this table will remind you to think deeply about a solution. The following are some of my small experiences in summarizing these abnormal situations.

1. How to build a self-examination form for interactive design

Usually in QA testing, the user's tasks are the main line, that is, the product is analyzed and summarized, and a task list is output to check one by one, marking the module, preconditions, use case titles, execution steps, expected results, and some important notes. If the interaction colleagues also use this method, we need to spend a lot of energy to write and sort out use cases for each version, which is contrary to our original intention of spending less time to quickly check for omissions. What's more, the user task check is taken into account in the design process, and what is often missed are some abnormal situations.

Therefore, when doing self-examination, interaction designers can try a different approach: First of all, of course, whether the actual functions of the product can meet the needs of users. This is the most basic premise, which is the "feasibility" in the usability goal. Then think about the core usage scenarios and core influencing factors of users when using this product, classify these influencing factors according to the blocks they are in, understand their impact on your user experience goals, list them one by one, classify them and form a table. In subsequent versions, you can continue to use this table. If there are new abnormal points, add them according to this idea.

We can divide this process into the following four steps:

Figure 1. Four steps to create a self-checklist

In order to better consider the impact of factors such as people, machines, equipment, and usage scenarios on the design, I classified these influencing factors according to the modules they are in, which can be roughly divided into the following categories:

1) Software and hardware characteristics: equipment, system, compatibility between old and new versions, etc.;

Figure 2. Software and hardware feature correlation

The diversity of mobile phone hardware and platforms brings both opportunities and challenges to design. In addition to the above, there are many other points we need to consider, such as the screen is getting bigger and bigger. When in a shaking car, the large screen meets one-handed operation, we need to consider how to make the design more natural and smooth for users.

2) Network characteristics;

Figure 3. Network characteristics

Due to the particularity of mobile application usage scenarios, there are many cases where data loading is slow or there is no network. At this time, the long wait for data loading will drive users crazy. At this time, handling the loading in the interface interaction well, ensuring that users do not feel a long wait, and have clear expectations for the content after loading, can provide users with a better user experience. Therefore, in all modules involving network interaction, the above-listed points must be considered, and when necessary, the cache should be used reasonably to improve the response speed of the interface.

3) The intermediate state from A to B;

Figure 4. Intermediate state from A to B

Even if your product works well 90% of the time, if you ignore your users when they need help, they will never forget it. - Getting real

When users complete a task, they are actually telling a story with the user as the protagonist, so it must include the beginning, the middle, and the end. The middle part is the main part, showing all the places the user has to go through to get from the starting point to the end point. On the one hand, we need to solve the problem of how to give users a smooth and unimpeded feeling when everything goes smoothly, which is what motion effects can do for us; on the other hand, if a task takes a long time and the user doesn’t want to play anymore, can we provide an appropriate entrance so that he and the application will “see each other later” instead of having to kill the background program and leave angrily?

4) Content display related: such as books and information sources;

Figure 5: Content display related

For content, most of the abnormal concerns are about a large number of empty states, extreme values, expired network data, etc. Different apps have completely different contents to consider depending on their types.

5) User personal attributes

Figure 6. User personal attribute correlation

In most applications, each user has his or her own unique ID, and the permissions a user can enjoy are different depending on whether he or she is logged in. Therefore, it is particularly necessary to consider every possible state of the user and the impact of switching between states on the design.

6) Status in special situations;

Figure 7. Status in special situations

Special states refer to a mode that exists to meet certain specific needs of users. These modes are often forgotten during the design process because they are not particularly exposed in normal times. However, if they are not taken into account, the results will be abrupt and inexplicable. Therefore, it is necessary to sort out this type of state separately.

2. How to use the self-check form

Repeated "design-self-examination" will be more comprehensive and thorough, and will eventually find and solve most problems. Interaction designers use feedback to revise their ideas, and after several repetitions, they can refine them and form specifications. This is especially important when designing new products. This iteration is inevitable because many times we cannot find a particularly complete and correct solution at once.

Conclusion

Different mobile applications will extract specific influencing factors based on their own unique scenarios, and these factors will have a greater impact on the design. Mobile scenarios are very complex. In addition to software and hardware characteristics, network characteristics, intermediate states, content, user personal attributes, and some special scenarios, there are many other influencing factors. Correctly analyzing and recording various influencing factors, handling them well and applying them to the design can improve the product experience, and in this process of improvement, we can standardize them. When each iteration version adds new functions, we can review the impact of these factors on the design in this period, and add the newly added influencing factors, leaving them for subsequent interaction design self-examination. In this way, we will accumulate more and more abnormal points that we have considered in advance, and thus we will consider them more and more perfectly, which can reduce the loss of blood in the subsequent follow-up development process~ We have medicine! It can be cured!