UX people can't help but understand the design ideas and principles of interactive levels

What interaction hierarchy design ideas and principles do UX people need to know? This article summarizes the relevant content and hopes to help you.

Last time, I shared "Want to get started with UX design, just read this article!", I believe you have a basic understanding of UX design after reading it. This article shares what you have learned in the book "This is UX Design", takes you to further understand the ideas and principles of UX design at the interactive level, and answers the following questions:

• What is the difference between usability and ease of use, and how do you define the boundaries?
• How do I design for errors?
• How to design for effective feedback?

1. Experience level and design

There are three levels of interaction between people and the external world – the instinctive level, the behavioral level, and the reflective level. Different levels of interaction produce corresponding levels of experience, and they also require corresponding levels of design. People's intuitive perception of things comes from instinct, and the manipulation of them produces behaviors, which in turn affect people's emotions and (deep) cognitions, and bring about reflection.

Second, the ten design ideas of the interactive level

UX design principles mainly involve two levels: the interaction principle of the behavior layer and the deep experience principle of the reflection layer. This article mainly shares the top 10 design ideas of the interaction/behavior layer.

1. Usability by design

The usability design idea is to not let users encounter difficulties when using the product, and aims to remove all the obstacles that users may encounter when using the product. How to understand obstacles? It can be understood from the following three points:

1. Barriers are places where users feel confused, awkward, or even uncomfortable when interacting with a product;
2. Impediments do not make the product unusable (an issue at the "usable" level), but can disrupt or even interrupt the user's task flow;
3. The negative emotions generated by obstacles are usually not fatal, but when a large number of usability issues accumulate and can create the impression that the product is difficult to use, it can seriously detract from the product experience.

Regarding usability design, the more classic theoretical guidance is the "Nielsen Ten Usability Principles", and the following figure summarizes the meaning and basic ideas of each principle.

2. Designed for ease of use

Ease of use is designed to be efficient, smooth, and comfortable for users. Ease of use means "easy to use" rather than "easier to use", which is a relative concept.

Ease of use can be better understood by the following formula:

• Ease of use refers to a very low "physical load", providing an optimal path to solving a problem, and also includes a better way to deliver instructions (information), such as using gestures to zoom in on an image than clicking a "zoom" button in the corner.
• Intelligibility refers to a very low "cognitive load" that allows users to easily understand a product with little to no brain.
• Comfort refers to the feeling of physical comfort and enjoyment, which is supported by subjective evaluation, and is usually the domain of industrial design.
• Aesthetics means that attractive products are better to use. Aesthetics is a value-added factor, and the coefficient is very important, but the basis of value-added must not be ignored. If the "content in parentheses" is not done well, it is useless to look good.

Ease of learning is one of the five dimensions of a product's ease of use (the others include product efficiency, memory difficulty, fault tolerance, and satisfaction), which describes how difficult it is for users to complete an interface operation for the first time, and the time cost to master the operation.

Ease of learning can be broken down into three dimensions: ease of learning at first use, learning rate Xi and efficiency saturation point. As shown in the figure below:

The high ease of learning leads to a fast system bootstrap process and low training costs. In addition, products that are easy to learn can make users feel confident and improve user satisfaction, which in turn will encourage users to be more willing to use the product. For B-end products, ease of learning is extremely important, which will affect the trust and payment behavior of users at different stages.

To improve the ease of learning of products, you can start from the following five dimensions:

1. Easy to understand information: Refers to the interface terminology that can be understood by users at different levels, such as novices and advanced users.
2. Clear and reasonable guidance: It refers to the fact that when the user uses the product for the first time or the product has a new function online, the user can quickly understand and use the product through the novice guidance, and help the user learn the Xi easily.
3. Neat and reasonable typesetting: It means that the interface design of B-end products needs to be hierarchical and focused, so that users can quickly find the key points, guide users to operate, and ensure that users complete tasks efficiently.
4. In line with the user's mind: refers to the design of the B-end product interface, try to retain the user's Xi, do not cause the user to use the product for the sake of innovation.
5. Reasonable and friendly feedback: It means that the system can verify and feedback prompts in time during the input process, reducing the user's memory burden and getting started with B-end products faster.

3. Boundaries between usability and ease of use

If it takes a long 100 steps to complete a task and the user doesn't run into any problems completing it, then it's usable, but it's not easy to use. Unblocked doesn't mean it's fast and effective, that's the difference between usable and easy to use.

Specifically, the core differences are as follows:

• Usability often stems from a problem, by finding the user's problems when using the product, eliminating the user's use of the hindrance, is a functional, bottom-up approach, ease of use is usually from the global perspective to reorganize the user's use of the product, so that the user can achieve the purpose faster and better, is a experience-based, top-down approach.
• Businesses that focus on usability will ask, "Do users have any problems with using?", and businesses that focus on ease of use will ask, "Is there a more natural and effective way to solve this problem for users?".
• Usable means "it's okay to use, but it's not easy to use", and easy to use means "feel easy to use".
• Usability is concerned with "whether the barriers are removed"; ease of use is concerned with "whether there is a better way to solve the problem".
• Usable reduces "bad"; ease of use increases "good".
• Usability ensures that the necessary information is available and clear, and ease of use ensures that information is conveyed in the best possible way.
• Usability is more functional and technical, and ease of use is more experiential and artistic.

4. Minimalist design

Minimalist design is divided into five steps: policy ➡️ deletion ➡️ to transfer organization hide, that is, to be clear about what you want to do, to remove unnecessary, to transfer ➡️ the assigned one, to provide the organization ➡️ to provide, and to hide what is not important.

• At the policy layer, the two steps of "policy" and "delete" are responsible for eliminating unnecessary complexity;
• At the mechanism level, "transfer" is responsible for eliminating transferable complexity;
• At the information layer, "organization" and "hidden" are responsible for eliminating the complexity that can be ordered.

The focus here is on strategy and concealment.

Strategy refers to the product strategy, including corporate strategy, brand, taste, aesthetics, user problems to be solved, etc. Before doing subtraction, you need to consider the strategy comprehensively and decide which ones are unnecessarily complicated.

Hiding adds a barrier between the element and the user, and you have to choose what you want to hide carefully; The hidden space is not a recycle bin for storing "elements that are considered for deletion", and the unwanted content should be deleted decisively at the deletion stage, instead of piling up in the hidden space.

It is a good way to hide some expert functions under one or some buttons, and the user can expand the gradual display of the hidden interface according to their needs, and the automatic customization of automatically showing and hiding certain functions according to the user's common actions will break the user's Xi and is a kind of behavior that adds confusion to the user.

"Completely hide + appear at the right time" is a clever way to hide, such as popping up a link to a word note when the user wants to copy a new word from a web page to the dictionary, which is much better than directly displaying the word in a link style or providing a hidden glossary, and it also brings a sense of intimacy.

Not all icons that are not commonly used should be hidden. There are features that are not commonly used, but are basic in the user's mind (in the category of "core"), and such functions should not be hidden. "Not commonly used in terms of data" cannot simply be equated with "not important to users". For example, the main function of SMS is to receive information (such as receiving verification code), sending messages is no longer a common function, but for users, sending and receiving are the two basic functions of SMS, and hiding the "send message" button does not conform to the user's mental model, once you need to send a message, the user will be confused.

5. Error design

The basic idea of error design is that a great product should be designed to minimize the likelihood of users making mistakes and serious consequences, rather than blaming them. It is important to note that any mistakes are unnecessary, and designers should minimize the possibility of errors before considering how to deal with them.

Errors are mainly divided into two categories: errors are errors caused by incorrect goals or plans, and are subdivided into memory errors, comprehension errors, and knowledge errors.

• Memory errors are when you make the wrong plan because you forget information, such as forgetting that you should put salt in a stir-fry;
• Miscomprehension refers to the incorrect understanding of the external world and the formulation of wrong plans, which can be subdivided into misunderstood situation, wrong understanding of rules and wrong evaluation of results.
• Knowledge error is when a wrong plan is made due to a lack of necessary knowledge, such as a foul due to ignorance of the rules of the game, or a reckless operation when something is wrong in the system.

Mistakes are failures to complete actions as planned, and are subdivided into memory errors and action errors.

• Memory errors are subdivided into state pattern errors and process memory errors.
• Operational errors are subdivided into capture errors, description similarity errors, and control errors.

Extractive errors arise from the brain's unconscious memory of the sequence of actions, for example, if you often do A → B, then when A appears, the brain will automatically prepare B, at this time, if you want to do A → C, and the idea of C is not stronger than the spontaneity of B, there will be a pick-up error. The root cause of the mistake of descriptive similarity is that people's memory of things is often vague, usually as long as they can identify things from the environment, and there is no need for precise descriptions, such as when you want to take a soy sauce bottle when stir-frying, you end up taking a vinegar bottle.

Error design is divided into three stages: error avoidance, error interception and error remediation: error avoidance refers to eliminating errors or reducing the probability of errors as much as possible through design, common methods include systematic design and user testing, and the corresponding avoidance methods for different error types are as follows:

Error interception refers to intercepting as much as possible when a (negative) error occurs. Common methods include operation confirmation, plausibility checks, checklists, and mandatory functions:

• Operation confirmation: in the form of a prompt or pop-up box.
• Checklist: The system checks whether all work items have been completed based on the checklist.
• Reasonableness check: The system checks whether the user's operation is reasonable, and reminds when there may be mistakes, for example, if the user enters "100000" in the transfer amount, the system will prompt "Do you confirm that you want to transfer 100,000 yuan".
• Enforcement Function: Initiates mechanisms to prevent the spread of faulty behavior, including interlocking, self-locking, and anti-locking, when it occurs.

Interlocks require actions to be performed in the correct order, such as designing a microwave oven to only activate when the door is closed, effectively preventing the user from starting the microwave oven when the door is open. Self-locking is to keep the system in a certain state to prevent the user from exiting prematurely, and the operation confirmation mentioned above is actually a kind of self-locking that prevents the user from closing the software in an unsaved state. The anti-lock prevents the user from entering the dangerous area or carrying out improper operation, such as the safety pin of the fire extinguisher must be unplugged before use, so as to avoid the usual misoperation. The interception mechanism is effective for mistakes, but not for mistakes, because the user planned to do so at the time, for example, if the user mistakenly thinks that a file is useless and clicks delete, the pop-up action confirmation will not change his choice.

Error remediation refers to providing remedial measures to minimize or reduce losses if interception fails, and common methods include revocation and recovery, error prompts and help.

6. Micro-interaction design - effective feedback design

A micro-interaction is a small set of actions performed to achieve a small goal, embodying only one function and accomplishing one thing. The idea of micro-interaction is to treat the entire product as a collection of a series of micro-interactions, and to achieve a high-quality product experience by carefully polishing each micro-interaction.

Micro-interactions can be broken down into four parts: triggers, rules, feedback, loops, and patterns.

The focus here is on effective feedback design. To provide users with "effective feedback", two problems need to be addressed – what to give feedback (what to feedback to) and how to give feedback (how to give feedback).

Feedback is essentially the transmission of information, so first of all, we need to think about what the information is, we can first ask ourselves two questions:

1. Question 1: What should current users know? "What should be known" refers to things that are important to users, such as dangerous alerts, critical information about product operation, etc.
2. Question 2: What do the current users want to know? "What they want to know" comes from the user's expectations, which may not necessarily affect the effect of the interaction, but can subjectively give the user a sense of control and security, such as the current running state of the system.

By addressing these two issues, the need for feedback is also clarified. Then you need to think about how you want to give feedback, and then you need to think about "what do you want the user to feel, what do you want the user to feel, how do you create that feeling".

After the design of the feedback method is completed, it is also necessary to check the real-time, reachability, and understandability of the feedback.

The above is the sharing content of this issue, and the follow-up will share the exploration of B-side user experience design, so stay tuned~

This article was originally published by @Problemer on Everyone is a Product Manager. Reproduction without permission is prohibited

The title image is from Unsplash and is licensed under CC0

The views in this article only represent the author's own, everyone is a product manager, and the platform only provides information storage space services.