Revolutionary: Compubutton Can Now Be Pressed

Compubutton can now be pressed. After considerable engineering, the latest version of EarthBucks’ computational button supports an interaction that other buttons have enjoyed for some time: clicking on it.

You may need a moment to process this announcement. Please take one. The button will wait.

A bold return to the button

Compubutton began with a different idea. Instead of pressing a rectangle and watching a spinner appear somewhere else, you slide a puck into a goal. The button then performs its computation and shows whether it succeeded or failed. The interaction, the work and the result belong to the same control.

I like that. Moving something into place gives the action a physical quality. You are doing something, and then the machine does something. There is a little ceremony to it.

There is also a reasonable objection: sometimes you just want to press the button.

After carefully considering this radical position, I have decided to support it.

You click. It swipes.

Click or tap the puck, the label, the track or the goal. The puck moves across the track and hits the goal for you. Then the computation starts, followed by the existing success or error state.

The travel takes 300 milliseconds, with another 100 milliseconds for the impact. The action starts after the puck arrives. It does not secretly begin while the button is still acting out its introduction.

This preserves the part of Compubutton I wanted to keep: a visible connection between your action and the work it starts. You can still swipe the puck yourself. Clicking provides another way to perform the same action, with the same visual sequence once the puck reaches its destination.

Enter and Space work too. The keyboard has been invited to participate in this historic expansion of button functionality.

The hard part of making something obvious

Adding a click handler would have been easy. Making clicking and swiping agree about what just happened required more care.

Suppose you grab the puck, drag it away, change your mind and return it to where you started. That should be an abandoned drag. It should not become a click just because the pointer ended up close to its starting position.

Or suppose you click several times while the puck is moving. You probably do not intend to start several copies of the operation. The control must commit to one activation and ignore the extra attempts while it is busy.

A canceled gesture must not activate it. Disabling the button during its travel must not let a delayed action slip through. Removing the component before arrival must not leave a computation waiting to start after the button has disappeared.

Swiping still needs to feel direct: the puck follows your movement, tilts as you drag, and springs home if you let go before reaching the goal.

These are the sorts of details that make an interface feel obvious when they work. When they fail, you discover that the button has developed its own interpretation of your intentions. I prefer to keep that responsibility with the person pressing it.

Progress you do not have to watch

The latest work also adds an invisible status region for screen readers. Compubutton exposes its computing, success and error messages through that region, using the full configured text even when the visible label is shortened.

EarthBucks’ forms coordinate their feedback with the button so they do not both announce the same generic status. Validation errors, recovery instructions and other useful details still belong to the form. The visual design stays the same.

Automated browser checks cover these updates, including duplicate messages and unchanged appearance. Actual VoiceOver testing is still pending, so I am not calling the screen-reader work fully qualified yet.

A smaller demand on the user

The click-and-swipe behavior has passed its browser tests and my visual review. The point of the change is simple: you should not have to learn a gesture just to begin an operation. People who enjoy swiping can keep swiping. Everyone else can press the button.

Compubutton still brings together the action, computation and result. It now asks less of you to get started.

We have made the button more button-like. I consider this progress.