Interactive design of the Internet

What is the interaction design?

Some friends and colleagues are asking whether interactive design is logic, the most interactive internet is to do is click and jump, which sounds like right. But does interactive design make logic? Interaction is to click, jump, Pure reason high logic of the job?

Give the Force accelerator as an example:

The accelerator's first edition is to speed up a game (WOW). Approximate process: Login > Open Interface > Direct acceleration > Run game. Later, after many revisions, there are many game options, choose to speed up a game. The requirement is probably the user can choose the game/Zone service > Start acceleration > Run the game, where the user is divided into used and accelerated the game and the first use of the game has not accelerated.

A rough flow chart

Low-fidelity wireframe Sketch

Meng a look, feel a simple and clear process, the user should not have doubts about it, but this seems to have no flaw in the process is only my personal thinking logic, the user may not be a complete collection.

For targeted users, the linear design efficiency is high, but for the target is not clear to him to see a recommendation, perhaps because like to choose.

The information architecture divides users into three categories:

A clear goal is also determined by the name of something

I have a goal, but I'm not sure what it is.

Third, casual browsing of users

The first category of users, they identify what to look for, but also determine the name of what is called, search can meet their needs.

The second category of users, who know what to look for, but not sure what to call the user, sometimes need to give him some advice. Common category navigation and search tips

The third category of browsing users. Referrals or hot information are more attractive to their eyeballs.

Thunder look home basically meet three kinds of users at the same time

The red part of the search area is designed for the first user who has a clear purpose and who knows what to call, and the green area's class is designed to target but not be sure what to call the user, to guide them to classify, and the blue area to be recommended for no purpose, browsing users.

Summary: Interactive design is through the design of interface and operation Behavior, and pay attention to design rationality, improve product usability. (which also includes details of the information architecture and interactions)

Second, the details of the interactive design

The instinct of the user = The instinct of the interactive design

1, understand your users:

To regard users as advocating simple, picky, slow, very busy: can be less typing less input, can less click on less clicks, can think less and less thinking.

2, fully understand, guide the user's behavior flow

On the one hand, to understand the user's possible click Process, on the other hand, the product should have a good information structure, operation Guide to High logic, but better understanding (the entire operation of the completion of the guide to explain, let users know where they are completed, what to do, in addition to this also to facilitate the return of users, back, regret, back to the beginning)

3, easy to understand the expression

Comprehensible expressions include not only vision and text, but also transparency in interactive operations (feedback principles)

Subjective feelings are unreliable.

In fact, sometimes do interactive design or product design. You think the user will follow your way of thinking, in fact, not really.

After a high logic, clear understanding of the design of products, look back at your products, to join the behavior of different users to feel.

Sometimes you have to talk to the data!

Results predictable (including user habits) prior to Operation

Action has feedback on the operation

Operation recognizable

The operation can be undone after the operation

Let users know where they are

Modal window is demon

Use of icons

Introduce some principles of page expression

Primary and secondary principles

Best practice: More content, less space, the main content first show, the secondary content in the "more".

Note: What is placed depends on what we want to focus on and the combination of the content through the data analysis.

Best practice: When faced with several operations, we also need to distinguish between primary and secondary, distinguish what we advocate user action, which we do not advocate user action, at the same time, for the promotion of user action to further creating priorities.

Direct principle

Best practice: Editing a single field is recommended to be done directly on the current page, do not set a single floating layer, even if the floating layer is set, as far as possible to allow the floating layer can be dragged. In general, the current page completes the operation as far as possible on the current page.

Uniform Principles

Best practice: The best way to maintain unity after the style is determined, to reduce the user's cognitive difficulty, that is, do not appear in several different styles.

Fewer rules.

Best practice: Grasp the user's psychological anticipation as accurately as possible, try to figure out the user's mental model, and then realize the user's psychological expectation.

Feedback principle

Best practices: As much as possible for each operation can be human-computer interaction feedback, so that users clearly know the current state, reduce confusion.

Iii. Introduction to Interactive design books

Article Source: Thunder User Experience Design Center