Interactive design approach: Elements of user experience for tool-type products

Article Description: The design of a product is like building a house, to the strategic level of the basis of the first level up. For designers, no matter what type of product design, not only to the overall knowledge of the product, but also to be particularly familiar with the next level of content, in order to make the design to meet the requirements of the product. Every head of the hierarchy has the right and the duty to put forward the unreasonable place on the previous level .

What is a tool-type product?

Work This period of time, I mainly involved in some e-commerce products, interactive design, I found that this kind of product design ideas and portals, channels and other products have greater differences, they are more concerned about the completion of tasks and operations, rather than the classification and display of content. I used to call this kind of product a functional product. In the interactive design experience Day in Guangzhou last year, the exchange with other interactive designers, found that in the industry such products do not seem to have a fixed title, and some interaction designers called "tool-type Products", I think it is also very appropriate.

Why do you want to define it individually?

If you have seen the elements of the user experience, you must remember the five levels of the user experience. According to the different product strategy, designers need to adopt different design thinking. The left side of the diagram below represents a tool-type product (such as the payment portion of an E-commerce product), and the right side represents a content product (such as a portal, some channels, etc.). As can be seen from the graph, there are obvious differences between the left and right sides at different levels.

The difference between the tool-type product and the content-type product

Tool-Type products focus on tasks -all of the operations are incorporated into a process to think about how people can complete the process. Here, we look at the site as one or a set of tools that users use to accomplish one or more tasks.

Content Products Focus on information -what information the site should provide and what it means to the user. Here, we look at the site as a "user can travel through the information space."

The designer of a tool-type product sees every problem as The design Problem of "Application software", and consider the solution from the perspective of traditional desktop and client software. The designer of content-oriented products View the site in terms of information publishing and retrieval, and then consider the solution to the problem from the perspective of traditional publishing, media and information technology. differences at five levels:   schematic diagram of the structural layer:   the difference diagram of the presentation layer:——————————————————————————————————————————

What exactly is interactive design?

The answer to this question, I think a lot of professional interaction designers may not be able to say very clearly.

From the elements of the user experience, you can find where the interaction design is located. This is to define the concept of "interaction design" from an objective perspective.

As shown in the diagram, the structural layer of the tool-type product is "interactive design", and this part of the output is mainly the task flow chart. However, in fact there is no absolute tool-type product or absolute content product, at each level, these elements must interact to achieve the goal of this level. Therefore, the structural layer of the general product can also be considered as "interactive design". Then "interactive design" can be understood as: mainly through functional specifications (business logic) design task flow, and finally create a page prototype process .

Finding other, more agreeable explanations on the Web, this is gained from the experience of interactive design: helping users efficiently accomplish the tasks envisioned by the product, while at the same time making users feel happy and undisturbed . But how can you effectively accomplish the tasks that the product assumes? How can you make the user feel happy and undisturbed? How to measure and judge? is difficult to define.

Combining the two, we can get a more specific definition of interaction design: The so-called interactive design, is to analyze the user's psychological model, design task flow, the use of interactive knowledge, the business logic in the user can understand the way to express to the user, The process of ultimately achieving the product strategy (the best balance between company needs and user needs).

Four elements of interactive design

Several elements of interactive design can be extracted from the new definition:

• Business logic is the key point to consider all issues. To make a good design, you can't ignore the business logic at any level.

• On the basis of the correct business logic, as long as the task flow design is correct, generally speaking, the product is available; Ignoring the design of the task process (especially the large product), the product will be unavailable.

• The analysis of psychological models plays an important role in understanding business logic, optimizing task flow and enhancing user experience.

• Familiarize yourself with the interaction specification to avoid errors in the frame layer

Business logic, task flow, mental model and interaction specification play an important role in different stages of design. This means that it is not enough for an interactive designer to know only the interactive knowledge for the design of a product.

Application of four elements of interactive design

Example 1: NetEase po Payment process

When the balance is low, additional payment options are available below the balance to complement the balance.

1. Business logic: In addition to the balance can be combined with other ways, the remaining tab under the mode of payment are independent. But on the first tab, all payment methods are tied together, which obviously does not exactly correspond to the business logic.

2. Psychological model: If this is compared to do the user's wallet, then the user's wallet will never appear in addition to the balance of other payment methods of "ghosting."

3. Task process: No big problem (so it is still available to the user).

4. Interaction specification: Each tab should be different content, but there is a lot of duplication.

In summary can be judged NetEase treasure of the payment page is really a big problem (perhaps the user has little impact, but the burden of the Code, the development of poor). Then use these four elements to judge the design of Alipay, you will find a lot better (but not no problem).

Example 2: Alipay default Check Balance

When the balance is low, does the user use the balance? (and user psychology)

Psychological model: the balance can be compared to real-life cash, when the cash shortage, most people will choose to pay through the bank card, and so on, and will not choose all the cash plus the bank card way. Therefore, most users will not choose to use the balance payment when the balance is insufficient.

Example 3: Pay the Treasure red envelopes

1. Business logic: The payment priority of the red envelope is higher than the balance, just as the payment priority for the balance is higher than the net bank. But from the interface, the relationship between the red envelope and the balance is much closer than the balance and net silver.

2. Psychological model: And real life analogy, red envelopes like coupons, the balance is like cash. So if you let users classify coupons, cash, and net bank payments, it's clear that cash is one of the cards, and coupons are another category. So here the red envelopes and balances are not in line with the user's psychological model, the balance and net silver relationship should be more recent.

3. Task process: No big problem (available to users)

4. Interaction specification: There is an improper submission button with two equivalent components on the same interface; on this page, "Next" is for the submission of red envelopes and net silver information, so it should be on the outermost side, not from the area of the net silver.

——————————————————————————————————————————

Summarize:

The design of a product is like building a house, to the strategic level of the basis of the first level up. For designers, no matter what type of product design, not only to the overall knowledge of the product, but also to be particularly familiar with the next level of content, in order to make the design to meet the requirements of the product.   The head of each level has the right and duty to make comments and suggestions on the unreasonable points at the previous level. According to the different strategy of the product, we can divide the product into the tool product and the content product in theory, the design need to adopt different thinking and method. But the product has the cross, also needs the comprehensive consideration.

The interactive design is the process of analyzing the user's psychological model, designing task flow, using interactive knowledge, expressing the business logic to users in a way that users can understand, and finally realizing the product strategy (the best balance point between the company demand and the user's demand).

Business logic, mental model, task flow and interaction specification are four elements of interactive design, which can be used to quickly find out the problems in design.

——————————————————————————————————————————

Due to the limitation of space, we have to do a lot of pruning on the basis of the original text. If you are interested, please check out the "Design impressions of tool products" in the server.