Data Entry I: Clicking

Guidelines | Numerical Keypads | Date Entry | Alpha(numerical) Keypads | Selecting Single Values

Guidelines

Key arrangement for text entry: Alphabetic keyboards on the screen may have a different order that usual typewriter keyboards. Make the keyboard layout switchable or even customizable. Reason:
- Users may not be proficient typist and are not familiar to the typewriter keyboard layout. A different ordering, e.g. alphabetic, may be better suited for them. Use the standard layout only when people are used to it and find the keys faster with this layout.
Minimize text entry: The conventional keyboard layout is not optimal for 10-finger typing. Alternative layouts have been proposed, but are not widely used. Both, the alternative and the standard layout are used for multiple-finger entry. This is not the case with touchscreens. Here people use just one finger, which slows down text entry considerably. Therefore, keep text entry to a minimum or better even avoid it totally on touchscreens.
Key arrangement for number entry: Conventionally, a 3*3 layout is used for number entry. However, there are two layouts used, the:
- Telephone layout (digit 1 located upper left)
- Keypad layout (digit 1 located lower left)
Use the telephone layout for untrained users, because they find the numbers easier with this sorting order, and they may be used to telephones.
Use the keypad layout only for people who are used to it, who prefer it, and who might get into conflicts with the telephone layout. Note that the keypad layout on keyboards is for multiple-finger entry. On touchscreens, however, numbers are entered with one finger only and sequentially.
Minimize number entry: Number entry is very fast on numerical keypads where several fingers of one hand may be used. On touchscreens only one finger may be used which slows down number entry. Therefore do not use touchscreens for heavy use with number entry.

Numerical Keypads

Telephone Layout

A simple numerical keypad with telephone layout.

Grouping is provided by:

Shape
Foreground color
Background color

Function keys are separated by shape and background color. The central number is highlighted by background color to act as target of the finger movement.

Keypad Layout

The same keypad with keypad layout. This layout is better suited to users that are comfortable with keyboards (typewriters, computers).

Ideally, an application should allow users to choose their keypad preferred layout.

Date Entry

A simple control for date entry. It uses a variant of spin buttons for incrementing or decrementing values. It should be supplemented by a text field which displays the date (for feedback).

Through simple clicking the day, week, month, and year can be incremented or decremented.

Categories that are not needed (year, ...) can be omitted.

Alpha(numerical) Keypads

keypad for letter entry

Linear Layout (Three Rows)

This keypad for letter entry uses an alphabetical ordering instead of the typical typewriter.

A linear layout is better suited to novices and people who are not used to type-writing.

keypad for letter inout

Tight Layout (6 Rows)

This keypad for letter inout also uses an alphabetical ordering. However, the keys form the shape of nearly a circle.

Scanning for letters may be harder with this layout.

Selecting Single Values

A control for setting discrete values (from Kai Krause's "Convolver 1.0"). The curve maybe well suited to do the adjustment with a finger.

Uses a lot of screen space!

top