Web Design the expression of status and action in user interface design


one, questions raise thinking,


discussed a small demand with his colleagues a while ago, he encountered a contradiction between buttons indicating "actions" and "status". Think of this problem, many years ago has begun to discuss, so here to sort out ideas, and share with you.



case is this: as shown above, the search function in the custom "enabled" and "stop" button, the end is that the "state" or "action"? Simply, above 1 indicates that the current is disabled, or click to stop the operation said the answer? It is not clear.

how can we clearly express the difference between them and reduce the misunderstanding of users? We should start with the definition of "action" and "state" and the relationship between them.

two, what is action, what is status,


action refers to the movement that has certain motive and purpose and points to a certain object.

The state of

refers to the shape of a person or thing.

In terms of

combination, action is a movement that causes a person or thing to change a state, and a state is the result of an action. Therefore, the two are often closely related, and sometimes even conditional.

for example, "operating the radio", I need to twist, knob, or press button to turn on the radio. When the action is finished, the radio is "turned on"". The "off" radio is the premise of a "open" state of the radio.


" sounds so complicated. "A lot of people would think so. Why do we face such a thing in our lives every day, but rarely do we feel that way?

, let’s take a look at the examples in life, and perhaps we can understand.

three, an example of life,

1, light switch


"figure 1",

single control switch, one of our most common switches, is very simple to design, press one side to open, and the other side is off. As for the other side, there are few people who will pay special attention to it. Because I try two times, always against the operation, there is almost no cost. People don’t feel bad about anything.

of course, there’s a better design right now.


"Figure 2",

2, Ipod HOLD


Leave a Reply

Your email address will not be published. Required fields are marked *