Selection, cut and paste with Eloquent menu and gestures

For Google, we help with the redesign and prototyping of text editing. With Eloquent, text editing is easier, faster and more consistent. Users can now edit text in a single continuous touch gesture. Eloquent functionalities can be used alongside legacy Android text editing, allowing existing Android users to gradually learn new functionalities.

Cursor placement
Android editing: multiple taps and unwanted menu trigger while deleting an extra space
With Eloquent, the cursor is always draggable

On legacy Android, the cursor appears temporarily, while tapping the handle opens a menu. This results in unwanted behavior when adjusting cursor position repeatedly, often hitting the cursor handle and opening the menu instead of adjusting cursor position. In Eloquent, the cursor is alway visible. A tap places the cursor, moving the cursor can also be done by dragging the handle or anywhere on the display, which results in the handle being moved to appear under the user’s finger. ADD LENS

Starting a selection by pausing

With Eloquent, a selection is started by pausing or pressing on the display. Both input methods also end a selection. Lifting the finger at the end of a selection behaves as in legacy Android text editing, ie end of selection and menu pops up. Eloquent provides feed-forward by mapping the timeout countdown to the height of the highlight.

From Menu to Gestures
The menu has four quadrants containing common editing commands

The menu has four quadrants, which include the commands used while editing: cut, copy, paste and undo. To avoid hierarchy, the menu can be scrolled to uncover additional items. The menu appears when lifting the finger after a selection, as it does in legacy Android text editing. Novice users can tap on the command label to select it, as they would in legacy text editing.

Selecting the cut command with the menu cursor

The menu also appears when pausing or pressing on the screen at the end of a selection. In this case, a small blue cursor is displayed on top of the menu. Sliding the finger in either direction moves the cursor relative to its start position. Releasing the finger invokes the selected command. As a result, the menu enables users to pursue the editing task after selection without lifting the finger off the display.

Cutting with a flick with and without menu

Intermediate users notice can accelerate selection of the four main command up to a flick in the general direction of the four main commands. An expert user can perform these gestures without invoking the menu, once she learned the mapping between gesture and command.

Faster text editing
Selecting the word “horizontally” with force press
Fast copy/pasting using gestures

Pressing on the display, or “force press”, is sensed by reading the barometric sensor within the phone. This enables to accelerate pausing to start and end a selection. Using force press and gestures reduces text selection and command invocation to a single fast gesture.

Additional material

Demo APK (Latest test on Pixel 4, Android 12)
Scott Jenson and Olivier Bau. Eloquent: Improving Text Editing for Mobile. ACM UIST Demo, 2021

Team and Credits

Client: Google Android UX teams
Design: Olivier Bau and Scott Jenson (Google)
Prototyping: Olivier Bau, Jean-David Hsu