Speeding up data entry through pickers and custom keyboards

Data entry is arguably the most mundane and uninteresting aspect of interface design. Regardless as to how you frame it, there is nothing sexy about users entering significant amounts of data.

That being said, exceptional implementation of data entry can be one of the most influential components in successful application design. While mobile computing has grown leaps and bounds in several short years, we still haven't overcome the difficulty that comes along with typing on a 3.5 inch screen.

While we can't increase the size of the keyboard, we can go about implementing pickers and alternative keyboards in order to help make data entry easier on our users. For this recipe, we'll go about discussing several data entry opportunities for our application.

Getting ready

For this recipe, we should prepare by taking note of the various types of data entry we plan to require from the user. We should also have the latest version documentation on custom keyboards from the iOS Developer Center, as this document changes frequently with iOS version upgrades.

How to do it...

There are two important data entry aides that we should include inside of our application whenever applicable: custom keyboards and Picker Views.

Custom keyboards

We should incorporate iOS's custom keyboard views in appropriate data entry scenarios where such views can help expedite the time it takes for users to quickly key in digits or characters.

For example, Apple offers multiple text keyboard types to help optimize input depending on the text entered. Normally, the iOS keyboard contains a long space bar and characters such as a period or at-sign. However, we can implement the custom Email keyboard when we're composing a message.

Likewise, we can give our web browsing users the custom Web URL keyboard with easy access to a "forward slash" and ".com" button. If our user is entering numerical data, the small digits of the standard keyboard can be difficult to press, so we can increase user productivity and implement the Phone keyboard to help the process.

Custom keyboards

Apple offers a variety of custom keyboards, and consistently adds new types of keyboard views as they release new versions of iOS. As shown above, Apple provides a variety of keyboards that each serve a unique purpose depending upon our application type. No matter what type of data we're looking to have the user type, there should be an appropriate keyboard to help. If need be, we could also go about creating our own application keyboard type as well if we're adventurous.

Picker Views

Pickers can be set up to help perform a variety of tasks. Apple has created a standard Date and Time Picker that helps with entries in applications such as Calendar or Alarm Clock. If we need a specific day or hour from our user, this is probably the preferable method of entry for the user.

A generic Picker allows for any variety of data entry, and can be customized to help out any data entry scenario where we can limit the user to a set number of choices.

In applications like Lose It, a Picker View is used to help the user quickly track food intake. In this Picker View screenshot, the user can select a whole number or a fraction, as well as a unit for the food item. It's a quick and painless process, and the user can quickly continue about their business.

How it works...

Custom keyboards are an ideal solution on a touch screen device, because we can create our keyboard in software and give it essentially any functionality we'd like. The same piece of screen real estate reserved for a traditional QWERTY keyboard can quickly be modified to a number pad or special character keyboard.

They're fairly self-explanatory in the sense that they're specially developed keyboards that help the user at entering data for a specific task. While QWERTY keyboards have long been standard these focus on a different task such as number entry or with foreign text characters.

Such specialized views are one significant advantage of a completely touch based mobile interface. Devices with physical keyboards provide tactile feedback, but can't adapt quickly to application needs like a custom view.

Keyboard will always work well with text; it will just depend upon which one we use based on what type of data we expect the user to most commonly enter. If we expect to web surf, it may be best to include a ".com" button. If we plan on entering in a variety of numbers, a keypad may be best. Feel free to experiment with Apple's latest keyboard options to determine what is best given any app interface.

Much like custom keyboards, a Picker View can also greatly benefit our app. A little less obvious but equally valuable, these views help greatly expedite the amount of time it takes to enter in dates, times, or one of the several different choices. The Picker focuses on one specific entry, which is the selected value. Other values are then selectable by swiping a finger up or down on the picker, helping to display previously hidden values.

How it works...

In the previous screenshot, we don't want to force the user to type in 11:00 P.M. on their keyboard every time they try to schedule an event, so we help speed up this process through the Picker. A quick flick and the user can set the time they desire to place a calendar event.

Likewise, the Picker View is an ingenious solution whose simplicity highlights the revolutionary iOS interface. Through graphical appearance, we can simulate a flickable wheel that contains all necessary choices for a particular data problem.

Picker Views are great when we can minimize the number of inputs that the user will be inserting into any given field, as we can only allow for specific entries to be placed. If we want to know what day of the week is best for a reminder, it doesn't make sense to make the user type out each letter to Friday when we can just have them quickly select it from a Picker list.

Data entry on a mobile phone has always been a difficult design problem. It's difficult, if not nearly impossible, to make entry easy on such a small screen. We're never going to completely solve the problem, but we can definitely use methods such as a Picker View or custom keyboard to help alleviate our user's pain.

Apple's inclusion of these custom components inside of iOS helps create the "magical" interface that draws users to the platform. It's easy for developers to include such elements into our own applications. Because the elements are easy to implement, designers can spend less time focusing on data entry, and more on eye candy and the important attributes of our application's design.

There's more...

Keyboards are a key component to any interface, as they're the mechanism for transferring user text-based commands to the application. Here are a few ways that we can go about making our application more applicable for international users or web users.

Foreign languages can work too

Apple's not just included native keyboard support for English, but for a variety of languages as well. Specifically, they've included strong keyboard support for Chinese and Japanese inside of the operating system.

If we're planning an application with strong international appeal, we may want to guarantee that our application works optimally with multiple device languages as well, as we don't want international users to have a disappointing experience.

Keyboards on the Web

In this recipe, we discuss customizing keyboards for native applications, but what about if we want to customize the displayed keyboard inside of a web app?

The HTML and requirements for doing so require a good bit of web programming, but it's definitely possible with a bit of work. Apple's offered up a guide on how to do so, along with the links to other relevant HTML coding guides, available in the Safari Developer Center at http://developer.apple.com/library/safari/#codinghowtos/Mobile/UserExperience/_index.html.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset