Interactive Design Practical Guide Series (12)-Avoid errors

How to understand the content of this article:

An example of "simple" and "complex"

When I and the developers communicate a project requirements, they often sigh with regret mockup design considerations of the details, many programs to implement the pre-and "non-basic function points" so that developers are reluctant to implement. Compared with designers in order to allow users to avoid mistakes and racked their brains to imagine and consider, developers are more inclined to give a direct to allow the operation of the action, the other illegal request all the error: "The program is rigorous, he was wrong, I error, quo." Isn't it easy? "Programmers even smile:" Considering their experience so much, we develop the experience is really bad, please, we can not make things so complicated.

In this example, the programmer seems to consider the various situations that users may have in the process of interacting with the system, looking for the most obvious, easiest, and most user-error design that is inefficient and time-consuming. Designers do this by complicating simple things. OK, now there is a question, what is "wrong"? Is the user really "making a mistake" whenever the program wants to handle the wrong request?

1, question one, whose fault is it?

When I used a website's photo album feature one day, I encountered this situation (pictured below):

"Normal upload" is the current selected state, and the button to upload "Cancel" is the same style. Because the selected state has a "positive, OK" potential hint, so the negative operation and positive operation of the state is completely confused, users in the upload process is prone to the wrong point "Cancel" button as a confirmation of the completion of the upload task error operation.

If this is really happening (there should be a few, like I happened in the local very difficult to choose a good picture delayed like "Confirm" function "Cancel" and do not work hard situation), yes, the user made a mistake, but the responsibility is not in the user? "I didn't make mistakes, it was your design that made me wrong, or at least increased my chances of making mistakes," he said. "Similar to such errors, the system may or may not, but the real should be reviewed is the system itself, namely: User understanding of the interface and its own system intent error, system design ambiguity and other inherent defects resulting in user error." The reason why users frequently hit the wall and create frustration is not the stupidity of the user, but the stupidity of the design.

2, question two, is this a mistake?

The 2nd of the interpretation of the word "error" is mainly aimed at the user's behavior layer of the system, that is, the user's misoperation in the Man-machine interface interaction, the system fails to reduce and avoid the loss caused by the user's misoperation through better design.

Take "Upload photos" For example (pictured below):

A modal warning box, impressively tells you, you want to upload photos here, should not use in addition to IE browser! In addition to not planning to inform you in advance, but also did not discuss, because I did not give you other alternative options and other options.

Can imagine, users want to use this upload photo function, already need to go through a lot of steps, such as to open their own albums stored online address, to successfully login into the management background, to find the upload photos of the functional modules, etc., has paid a considerable part of the operating costs. But the system is cruel to let the user all work white, not only that, but also very barbaric way to tell users: you from the beginning of the wrong! In this case, there is no error in the user's understanding of the system, but there is a serious frustration in the process of interaction. But is this really a user error and a responsibility that needs to be borne? I don't think so: "Strictly speaking, I'm not making a mistake, I'm just not sure what I can do and how to do it." ”

From the above two cases, I think that can be a preliminary answer to the programmer classmate's question: "Yes, simplicity is always good, but in the process of interaction, the event is always complex, the possibility of what may happen is always so much, not you think for him more, let him simple; More complex, worse experience. "

3, question three, how to do:

Three realms of fault tolerant design:

1, to ensure that it is not our own fault: shielding will cause ambiguity in the design, its unreasonable design, do not let users because of the system design defects caused by mistakes.

2, the simple left to the user, the complex to leave themselves: through the system of good design constraints and guide the user's operation, the possibility of the error to minimize.

3, reduce the cost of error, to help users do the right: when the user or made a mistake, through the design to guide the user to the right direction.

For interaction designers, the first is the bottom line of design that should be adhered to, and 232 is the design Guide to be followed at design time. The third article, about how to help and guide the user to do after the error, Changxuan students will then write a special article to explore this issue, here is not to repeat, the following mainly on the second article to talk about some views:

Second, how to avoid user error: 1, give users the appropriate behavior constraints--for users to close off the wrong road

This is the Gmail mail processing area.

The figure above shows that when no email is selected, the operation items are dimmed and cannot be selected. In this way, while effectively avoiding misoperation, the content of all functions provided in "more operations" is shown and predicted when the operation requirements are met.

The following figure is the case when a message is already selected, when the action item is all activated to a usable state. Compared to the previous picture is not activated state, you can note that in addition to the activation of the state difference, and the "star marking" function in the initial activation is only a raise and hide the deletion function, fully considered the add and remove functions of the mutex to be hidden.

Through the user's use state, through the Selective setting function item activation, to activate the state, as well as the function item display, hides the state, is the effective avoids the user misoperation the commonly used method. This thoughtful design has largely prevented the user from operating errors.

2, give users the necessary pre-judgment error tip-tell the user that this may be wrong

This is the MSN login interface.

When the cursor is positioned in the password input area, if the lock on the keyboard is accidentally opened, the interface prompts the user that the Caps Lock is enabled at this time, and the password input error is likely to occur.

This process is much more friendly and effective than the user's input to complete the click Submission and then prompts the user to come up with a lot of friendliness and effectiveness, rather than just blindly criticizing the user "you're wrong" from beginning to end without telling the user what the situation is.

When a user's behavior is likely to trigger a predictive error, the sooner the user is prompted and the feasibility of the proposal, the more easily the error can be accepted and corrected, the less the user's loss.

3, tell the user the status of the operation and the correct mode of operation-tell the user how to go to the

Flickr Media upload page.

For what users need to do on this page, what can be done there is a clear division, the current need to do, currently in the operating phase to be highlighted to attract people to operate; for the operating phase has not yet been introduced in advance, it is clear to introduce the complete task flow.

Let users know in a process, what they have done, what to do, what not to do and what to do to make the task successful, is to avoid the user error is a very positive way of coping.

Let us abandon as a designer of the advanced user perspective, in-depth mining user behavior habits and mental models, really from the user's point of view to analyze the use of may have problems, through the design of the system to try to avoid the occurrence of errors-"to leave the simple to the user, the complexity for themselves." About face3.0 the 25th chapter, "Errors, warnings and confirmations," speaks of an important design principle: making mistakes impossible. It's beautiful. With this and you design Tongren mutual encouragement.

Source: ued.taobao.com/blog/2010/04/09/qiancheng1/

Extended reading:

Interactive Design Practical Guide Series (1) – "effective" "operational entry Clear"

Interactive Design Practical Guide Series (2) – "Availability"

Interactive Design Practical Guide Series (3)-"effective" "timely help"

Interactive Design Practical Guide Series (4)-"effectiveness" of "concise and clear, naturally understandable"

Interactive Design Practical Guide Series (5)-Highlight the focus, at a glance

Interactive Design Practical Guide Series (6) – Label clear and effective

Interactive Design Practical Guide Series (7) – Avoid getting lost

Interactive Design Practical Guide Series (8)-Deep breadth balance

Interactive Design Practical Guide Series (9)-click once

Interactive Design Practical Guide Series (10)-Don't make me think.

Interactive Design Practical Guide Series (11)-Reducing memory burden