Invisible interface

Original author: Francis Tseng
  • Transfer

Today, everyone is fascinated by the new modes of (digital) interaction. There are many interesting and fresh ideas regarding what might become the dominant medium for future interactions. Touch? Gesture? Vote? Eye tracking?

Although these methods seem to be what the interaction design is headed for, I want to recall the extremely effective and almost the most underestimated way - to some extent the sibling of these new interaction modes - which has been around for ages: shortcut keys.

In discussions about interaction design, I rarely, if ever, see a mention of keyboard shortcuts. (Starting here, I will talk about the desktop web, since it uses a hardware keyboard). This became possible because the interaction design, by and large, seems focused on web design, and the keyboard shortcuts were classified as desktop software [1] (I don’t know why they weren’t completely transferred). However, where they are, they are usually used - I'm sure interaction designers use them all the time when they use Illustrator, Photoshop, Omnigraffle, etc. Ironically, hotkeys always seem like an afterthought in the designs created by these programs (if they are even thought of).

Perhaps they do not think about hot keys, because the design is focused on immediate intuitiveness and user friendliness. And, frankly, nothing is inherent in keyboard shortcuts (well, at first). There is almost always a learning curve for them, and their use is often associated only with advanced or “strong” users. This is a fair conclusion - you want to attract new users to use your product and do without a frightening or hidden interface. But this will not necessarily be so, especially if you apply the agreement on establishing the degree of predictability when accessing one of these interfaces. But in general, I urge the use of hot keys not as a replacement, but as an addition to the existing interface, especially for products that people can use for several hours a day or every day.

Physical metaphorical interfaces

Recently, I was captivated by the idea of invisible interfaces - interfaces that do not require mandatory visual elements. Why are they good? What makes keyboard shortcuts so awesome? Well, most of the interface design is still based on a physical metaphor. You have to move your mouse cursor (or stylus) to the button that you then click, and then something happens. This is quite intuitive, since in the real world we also interact with things: I have to make a purposeful movement in order to manage something.

In the interaction of man and computer, Fitts lawdescribes the feedback between speed and accuracy with this type of interface. It will take longer to “achieve” smaller or more distant goals, and trying to do it faster means sacrificing accuracy.

In the picture on the left, D is the distance from the cursor to the target, and W is the target width. Fitts's law is usually written as T = a + (b * log2 (1 + 2D / W)), where a and b are constants for the mouse, stylus, etc., and T is the time to reach the goal. On the right is a keystroke - this is a much more direct means to action.

But in the digital world, we have the advantage of much more direct routes between intention and action. I can press a key combination and the action is immediately executed. There is no need to drag my cursor through space and time to finish the job. The gap between intention and action shrinks sharply, and we can effectively circumvent the limitations of the Fitts law.

And besides, the interface no longer has to take up some space. He is "invisible"; it exists in the user's muscle memory and actions can be performed impulsively.

Keyboard Expressions

There is, however, something even more powerful than keyboard shortcuts: keyboard expressions.

Certain keys or their combinations correspond to certain actions that can be joined together, like words in a sentence, and you can perform more complex actions with a few keystrokes.

Vim is probably the highest manifestation of this approach. Vim is a text editor preferred by programmers [2] for its highest efficiency, and notorious difficulty in learning. His learning curve may be discouraging, but once you study it, the amount of time and effort that he saves you will endlessly look.

In Vim, certain keys are configured for certain actions, and you can perform complex chains of actions with just a few keystrokes. In truth, there is only a handful of keys and a little syntax you need to know, but their combination power can be very powerful. These expressions make Vim one of the most elegant and poetic instruments I have ever used.

Let's take a slightly contrived example: when you edit a document somewhere in the middle, you want to delete the first line, and then return to the line you are on.

In a regular text editor, you would move the mouse to this line, select everything, then click delete, then move the mouse back to the line you were on. To position the cursor on the desired line, you will need a certain degree of accuracy, especially if you are moving fast (if you look carefully, when returning to the original line, I first accidentally selected the line below). Here we have to worry about Fitts law .

In Vim, all you have to do is type: ggdd`` .

gg - jump to the top of the document, dd - delete the line where you will be, and `` jump to where you were before. The discreteness of key strokes — that is, it is either pressed or not — means that we cannot accidentally select the wrong line [3] . Here, the command `` will decisively and irrevocably return you to the last line on which you were; the computer cannot accidentally jump to the next line.

It may not seem like a significant difference, but it is just what lies on the surface of Vim, and if you do a lot of this, it will save you a lot of time and headache.

The real strength of Vim is that these keyboard shortcuts are language. You “say” what you want to do. Want to delete the next 10 lines of text? You can simply type: 10dd .

Let’s figure out what you are saying:
10 = “10 times”
dd = “execute the delete line command”

Invisible Interface

Here is a more realistic example.

Think of some office software, say, a presentation application. It will have a rather complicated interface already because of the huge number of actions available - you have certain actions for characters, such as changing the font size, italics, underline and other formatting options, and then certain actions for the form, such as coloring, size, position, stroke size and so on. To reduce this onslaught of functions, the menus are filled with actions, and some of them act as keyboard shortcuts.

What if this application had an invisible interface like Vim? Let's say I'm on slide 10 and I want to move the name of this slide, “Space and Times,” to slide 22. In the traditional interface, I would visually check the name, then move the cursor to select it. Then I pressed CTRL + X to cut out the name, then I would move the cursor to the side panel that lists all the slides, possibly scrolling down the panel until I see slide 22. Then I selected slide 22, then inserted the title on it.

In the expressive language of the keys, I could do the same just by pressing: / Spacxxg22gpp

Let's parse this:
/ = “start searching for the object, starting with the text ...”
Spac = “Spac” (corresponds to the text of the object containing “Space and Times ")
Enter= (press Enter) “selects a matching object”
xx = “cuts it out”
g = “then go to the slide ...”
22 = “22”
g = (confirm the move)
pp = “then paste”

This may look like a complex nonsense, but in practice it is very flexible and it is difficult to return to physical and metaphorical interfaces after that.

Outside the keyboard

These ideas can also be extended beyond input from the hardware keyboard to other input methods. In simple terms, the general idea here is that with a set of different limited input methods, you can create an “interaction language” expressed through meaningful combinations of input values, greatly expanding the capabilities of several input methods. This can reduce the dependence of input on visual elements that are often specialized (i.e. you press a button and one specific action is performed). Gesture interfaces, in addition to other trending interfaces, can fall into this classification.

Does this approach make sense for all interfaces? Not necessary. There are concerns, for example, with reasonable sufficiency.when users tend to choose near-optimal behavior with a low penalty, preferring to settle for the worst, because the best requires an investment of time and effort. Of course, if your interactions with a particular system are short and rare, such a strategy makes sense. But even in the case of interfaces with which they interact regularly and for a long time, people, as a rule, continue to “be content with little”. The initial investment of time and effort is repulsive, and people are cruel in evaluating long-term returns versus short-term costs . For example, even if the Dvorak keyboard layout is much more efficient and less harmful than the QWERTY layout (a rudimentary template from typewriters), almost no one uses it because it is damn inconvenient to relearn.

But I believe that it is important, at a minimum, to consider this option. Within these interfaces there is the potential for much more flexible and efficient, and even pleasant (Vim is really interesting to use) interaction. And it’s interesting to move away from dependence on visual digital interfaces and begin to study the one that we carry with us, the one that exists in muscle memory.


1. One of the few exceptions is Google Docs, which has an extensive set of hotkeys and is possibly modeled directly on desktop software.
2. There is also Emacs.
3. This does not mean that you cannot make any mistakes in Vim - you, of course, can still press the wrong key!

Also popular now: