Product Interaction Design Example: The Beijing airport cigarette burner

Source: Internet
Author: User
Tags final interface

Article Description: Product Interaction Design Example: The airport cigarette smoke device.

The smoking room in the capital airport does not put a few fixed lighters like other airports, but cigarette smoke device, and car smoke device is basically the same: first press the heating, after heating, it will automatically bounce, pull out, the inside of the resistance wire is red, you can point to smoke.

On the image of the car cigarette smoke, and the airport, like the cigarette, the heating process is only pressed down, did not show progress, also can not image the expression of "heating" meaning.

I go to the near of the smoke device, press, let it heating, and then wait, wait for a while still no movement, I do not know is still heating or out of trouble. A lot of people in the smoking room, feel that they are looked at by others, will not use this thing is very awkward, simply do not wait for it to bounce directly out to see exactly, the original is really not yet fully heated, fortunately, can be used, on the smoke, hard pumping two, is lit smoke.
If the cigarette burner in the heating process can have a clearer hint will be better, such as: heating in a small red light flashing, the more perfect solution is to really show the progress of heating ...

Tencent's new building is beautiful, but many colleagues are scratching their heads at the elevator.

After pressing the DOWN arrow button next to the elevator door, you can only see the down button is bright, that is, the elevator knows you want to go downstairs. And do not know where the elevator is currently going, can not predict the arrival of the elevator time. Therefore, everyone can only look forward to looking at the elevator door, and scratching his head. The elevator door was littered with long, scratched hair, short hair, straight hair, curly hair, stubble (which I scratched) ...
The current state of the system does not appear to be directly linked to the use, but users can be aware of the current state of the system to estimate the elevator arrival time, thus making decisions, is sad to climb the stairs or continue to wait.

As the two experience, I recall the company campus recruitment when the interactive design of a written question:

What's wrong with this interface?
One obvious problem is the lack of a button that terminates the operation. Can't stop, just wait.

The above three examples are all about moving and changing systems. What are the essential elements of such a system that do not have the above problems?

The following are the elements required for a changing system:

Factor 1-Current progress (Describe current state)
The description of the state has two levels of generality and precision. A flashing small red light in the light of a cigarette burner is a general description that the system is currently working, similar to the Windows system's hourglass cursor. The current download to 54% is a precise description that not only indicates that the system is working, but also shows the specific progress that makes it possible for the user to anticipate the remaining time.

factor 2-the result that the system will eventually achieve (Describe current state)
For the elevator, the final result is the arrival of the elevator, for the download interface, the final download is complete. The description of the final arrival result is not necessarily a separate piece of information that can be perceived by the user.

factor 3-information to assist the user in estimating the completion time-rate of progress changes, etc. (Describe current state)
Download large file download software, a download task usually takes several hours to complete, the progress is relatively slow, only according to the progress of the changes, users do not have a good estimate of how long it will take to complete, the current download speed, such as information can assist the estimate.

Factor 4-Terminate Operation (provide operation)
Terminate the current changing state and revert to the state before the change began.

Factor 5-Other operations (provide operations)
In the current state of change, an operation other than the "terminate" operation. For example, minimize, hide to background run, reduce running speed ...

The first three points describe the current state of the system, and the latter two are provided operations.
These types of elements do not necessarily have to have, summed up the value of these elements is: to avoid considering the whole problem of design defects. There's no more "other operations" on your system. Of course, there's no need to make a mistake. Fill in the blanks of "other operations".

Next, let's focus on software, Web products.
With these elements in the design of a changing system, probably not a big problem. The next question is: are the elements that are summed up in the "system of Change" to be used more broadly? Spread to all mankind?
Let's take a step further and see the location of the "changing system" in this large collection of software products.
A software, Web site, was originally composed of a number of stable systems. For example: Network album home page, a single album list pages, photo details page ... The user does not do the operation, these states are unchanged. Through the user's operation, a website jumps from this stable system to another stable system:

In the course of these jumps, sometimes, an operation will produce a relatively complex behavior, it takes a long time, such as: In a network album, add photos, an empty album to become a photo album, need to upload a photo of the process, upload photos of the process is a "system of Change", This system will eventually automatically reach the stable state of the upload completed.

The stability of the system can also be summed up "elements" to avoid the design of ill-conceived:

Factor 1-Describe the current state
A description of the current state of the system.
For example: Receipt Confirmation, confirm payment, login ...

Factor 2-operation
Some of the actions that are currently available.

It is also "state" and "operation", but no further refinement is required. A stable system is much simpler than a changing system, and that's why we don't usually try to analyze the regular pages, preferring to analyze the design elements of the upload and download interfaces.

In a changing system, the "factor 2-the system will eventually achieve", which is not much value in the previous system that focuses on the change. Now put the changing system and the stable system together, to see the whole product, "the system will eventually achieve the results" is valuable. Because of the changing system, just an intermediate process, in the album list page to point to add photos, the user's expectation is to finally see the photos added to this list, in the upload photos page long waiting, need to tell users, here delayed a half-day, is to allow photos to add.

Combining the above two types of systems, you can use the following picture as a whole to indicate:

The above "stable system" and "system of Change" are all developed from the first few examples, a specific perspective, through this perspective to analyze the design. To solve the problem of usability in the design, specifically, "before the operation, the results are predictable; the operation can be undone." "The question.
Careful thinking you will find that it is not enough to summarize the elements of the system as a whole, and to make sure that "predictable" "undo" also needs to be analyzed separately for operations that are represented by the buttons in the previous illustration. The analysis of them alone, summed up the operation in the design of the necessary elements, and the system as a whole to combine the elements, in order to better guarantee the "predictable" "revocable." An analysis of operations.

In view of the above text is very difficult to read, then the operation of the analysis will read the same difficulty, I would like to be divided into two pieces, separate.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.