Wednesday, April 24, 2013

The Touch Experience

A mobile device is unlike anything that we have experienced on a personal computer. For decades we have been using PCs and its use therefore has become almost second nature to most of us. A desktop computer has a file system, a windows explorer, a bunch of icons on the desktop, a wizard of windows for the installation of applications, a changeable hard drive and so on. The use of an application like the notepad on a Windows PC has ingrained in us the habit of a menu, a sub-menu, menu items like save and save-as etc. The same person when confronted with a touch device like the iPad feels completely out of place. The reason is that apart from a couple of things like the virtual keyboard and a bunch of icons, there is nothing familiar about the user experience.

Take for example a simple notes application. Apart from music and pictures, taking notes is the most frequent use on an electronic device, be it a tablet or a PC. After booting up the PC, which takes a while depending on the type of system you have, we fire up the notes application from a short-cut if we have one, or select from a long list of applications from the Programs menu. Then you type some text using the large keyboard and watching the monitor at the same time. You need to save the document from time to time, for a power outage, a program or system crash may suddenly wipe out all your hard work in a trice.

The saving is a two-step process: when the save dialog box opens you type in a title for your note and then select a drive and a folder to save your note in. You must remember where you have saved your note if you must avoid the agony of a desperate search of the entire system. The save operation is performed by a series of mouse clicks. The click interface is the cornerstone of a windows-based computer.

Now, let us take a look at a notes application, called app for short, on a touch device. The important difference at the very outside between a PC and a tablet, for example, is a touch interface as opposed to a click interface. Even the keyboard is minimal, prompts for text completion, provides access to other less used keys in an intuitive way and can be hidden while scrolling the page. There is to begin with the text that one is typing and nothing else - everything else is out of the way. No toolbar icons, no need to keep saving during typing, windows and menu bars cluttering the screen - nothing, but you and your text. This is a major difference and one that every app on the handheld device must and some do exploit to the fullest possible degree to provide ease of use and aid in productivity.

A full charged battery on a handheld device lasts as long as eight to hours of working, which is more than any laptop is likely to provide. Saving can be done automatically as you type, so there is no threat of data loss. A good notes app will provide a feature that allows a user to start typing as soon as the app opens. Even the virtual keyboard is open and ready to receive input. This is a feature that most mobile note taking apps lack. Riding on the traditional PC bandwagon, some apps even go so far as to ask you to type in a title, select a folder to save it in and even expects the user to touch the save button! This is a legacy that is to be entirely eschewed in the design of a notes app on a mobile device.

A truly useful app starts up ready for typing, uses the first line as title, auto-saves the text as you type, saves the document in a folder such as Inbox (any name would do for that matter - general, root, default etc.) and allows to pour out your thoughts as though they were nuggets of divine utterances awaiting consecration. A touch device is meant to be fast and minimal in startup.

The question of saving to a desired folder may be addressed by the user using gestures. Again, it is important to remember that a touch is significantly different from a mouse click. Compared to a touch gesture, the closest a mouse gesture can come to is drag-and-drop. Gestures by touch on the other hand could be numerous and simple, very intuitive and eminently satisfying from a user experience point of view. When the user has finished typing s/he might want to place it in a certain folder. This can be accomplished using touch gestures in the following way.

After the text is drafted, slide the finger on the screen to right. A menu opens on the left with a list of folders previously created. It also shows the folder Inbox where the current document is saved. In order to create a new folder, simply pull the left menu down. A new folder is added to the list with its name box empty and a cursor positioned in it ready for typing. The name box could also have a default name such as New Folder selected and ready to be typed over or left as is. An 'x' button in the box is available to erase the name. This gesture is fluid, nutritive, minimal and simple to use. No plus button or extra windows with their own set of buttons. A long press on the newly created folder may open up a link to Dropbox. Now to move our note from the Inbox to the new folder, say, My Notes.

Place a finger on the note and slide left so that the finger slides over the divide and continues on to the folder My Notes. This action triggers a 'move' operation. The note remains open on the screen, but behind the scene a stealth operation changed its location. Neat and simple. No clutter. Now is a good time to see what other files, this new document is sharing the folder with.

After the move operation, pinch the note to close. It is replaced by a list of files in that folder. Select any one file from the list to open it. No hassle. Now, one might like to reorder the files in the folder. For each list item, there is a title and on the same line to the right, there is an icon with three horizontal bars. To re-position a file in the list, hold this icon and drag the file to the desired location. What you can see between the title and the reorder icon is a row of icons that make things more interesting. The list of files may also be seen as thumbnails in a grid view - something that can accomplished as a toggle between the two views.

The row of icons provide such functionality as Open-in other apps, email the file, rename the file, delete the file and so on. Can it get simpler and more intuitive? The icons are designed to be self-explanatory - there can be no tooltips, because one cannot hover over an icon or a link on a touch device. The demise of hovering, however, is not that great a loss compared to the numerous benefits reaped from simple gesturing. A good app is equipped with a graphical help file to quickly bring the user up to speed with the app usage; gone also are the massive help pages and manuals for learning the operation of an application.

More interesting things happen on an open note. Note here - pun intended - that the words note, document and file are used interchangeably in this article. Let us therefore not split our hairs over semantics.

A slide from the right to left beginning from the rightmost end of the note opens a new note. No plus button again. It feels like turning a page in a physical notebook. All new notes are created in the same folder where the current note exists. As soon as the note is created, one can start typing because the user is presented with a keyboard as soon as the note is created. Now slide left to right and the left menu opens with the current folder highlighted. A number on the right of the folder indicates the number of files in the folder till date (when a file is deleted the counter is decremented). A slide on a folder prompts for deletion. A slide started from the leftmost position on the screen allows app-wide settings such as sort order (up and down arrows), font selection (font icon), feedback on the app, set feedback policy (auto shoot email to developer when app crashes) and so on. A slide in either direction navigates between notes in the same folder.

Let us now return to the note again. In order to view the note stats like word and character count, reading level etc., simply pull down from the top of the app. The notes background maybe set with a faintly visible ruled lines as default and allow the user to set from here. More export options may be provided at the bottom to be made visible only when the note is pulled up. What is more important for a writer is the features that the app provides while writing.

While the keyboard may be augmented by an additional row of keys on the keyboard, it is also very intuitive to use context menu, similar to the features offered in a desktop application where right mouse-click pops open an additional feature set. A long tap on the note could provide features such as formatting text (style, bullets, etc.), mark begin and end selection by taps, share selected text with social media apps without sacrificing the usual operations such as cut, copy & paste operations, define word, suggest word, spell-check etc.

Cursor movement is something that can be designed in ways that are very simple, yet effective in use. Leaving left and right margins provide ample space for cursor operations and page movement; at the same time, margins provide an elegant look to the note. The right margin can be used to provide page scroller, as already mentioned earlier. Tapping on the margin, left or right, will move the cursor by one letter accordingly. Long tap jumps the cursor by word. This mechanism also does not conflict with the in-built touch gestures provided by the device.

Search and replace functions are by far the most sought after features in a note-taking app on a tablet device. App-wide search box may be provided on top of the left menu. The result is a list of files containing the text; the display cuts across folder boundaries. No replace function is provided here - not necessary. On the level of a note, however, both search and replace functions can be provided. Long press on a note opens the context menu to launch the search interface. When the search word is clicked in the context menu, a search box is revealed over the virtual keyboard: it replaces the extended keys. Enter the search term and get a display of number of occurrences, which can be reached by left and right arrows on the search interface. A replace link appears on the search bar, clicking which provides the interface to replace word by word or all occurrences. A Done button dismisses the search interface. Cool, right?

Text selection can be used for other purposes too. Selected text may also be marked as a task with its own interface to set a reminder and so on. A note is written for several purposes - to record meeting points, to set an agenda for a meeting, to put down thoughts, to list items to do, for review, assign tasks to people, write an article, a long story and so on. With a few extra bells and whistles, the notes app can encompass the most comprehensive feature set ever to be found on a handheld device.

It is important to remember to provide defaults where possible so that the user may start using the app with default settings that are best suited to the eye and the look of the words on the page and its background. Even with a plethora of features such as outlined above, the note is still amenable to instant use without distractions, since all the features are hidden, but easily accessible. This will go a long way in enhancing the user experience on a touch device.

3 comments:

  1. Which mobile device are you using?
    Rajeev Rumale

    ReplyDelete
  2. There are some words left out and some words like 'nutritive' which I never intended got into the article. This is something that happens due to the autocorrection feature on the device. This feature is both a boon and a bane, if the text is left unedited and proofread at the end of writing it.

    ReplyDelete