Design of forms for mobile devices

The form design of mobile devices is much more restrictive than the desktop: small screen, slow network, difficult to enter, and so on. Therefore, when designing mobile applications and Web sites, you should minimize the number of forms. At the same time, if some places really need to http://www.aliyun.com/zixun/aggregation/18678.html "> user input, should try to let them click to select, such as multiple options, check box, select menu, list, etc. A text box that replaces poor usability.

Restrictions often bring innovation, and mobile forms are no exception. The limitations of mobile devices have prompted developers and designers to find better ways to provide fast and easy-to-use input. Innovations in these areas have been reversed and applied to the desktop Internet, and to a wider range of areas.

Here are some successful innovations:

1. Enlarge the input box

Problem: Since the screen of mobile devices is too small, it is difficult for users to see and correct errors in the input process in time

Solution: When the user selects the form's input box, the system enlarges the form's input box to the entire screen, to facilitate the user to see the input content

When you enlarge the input box, note that the labels are aligned to the top of each input box and the labels should be as brief as possible. Example: Google's registration form using the label left-aligned, enlarge the input box, we only see the input box, the label is hidden.

2. Hide Password

Many forms involve entering passwords, and in order to prevent other people from peeping, form design usually automatically converts the password entered into a * number. This design is ostensibly secure, but has a usability problem: if your line of sight is accidentally removed when you enter a password, you will have to re-enter it.

iphone Design: When you enter a password, do not immediately change to the * number, but stay 1, 2 seconds, so you can see the input content.

BTW: about this widely adopted design, usability guru Nielsen seems to disagree, the master said:

Providing timely feedback and current status indicators are basic usability guidelines, and the design of hidden passwords makes it easier for users to make mistakes

3. Pop-up Menu control

The Drop-down box is one of the more difficult types of input, and first you have to click on the menu to open it--to find the target through a long list--move the cursor to the target--click it.

The solution on the Web is: When you browse the list item in the Drop-down box, the cursor follows, and the Drop-down box closes when the cursor leaves. Even experienced internet users often lose their goals and start again. This is more of a challenge for mobile device interaction, and we need to find new ways.

Look at the iphone design: After users click on the menu, the screen appears under the list, you can touch the operation of the drag, flick, push, control the speed of the scrolling list, to find the target, for easy Click, the goal is also designed a lot.

4. Compound Menu

The pop-up menu control can also be applied to a composite menu. For example, when choosing a year, month, or day, we can combine 3 drop-down menus to complete one area.

Google's Android system also uses a composite menu, unlike the iphone's based on touch, which uses visible interface elements, through "+" "-" positioning.

5. Native input Control

In addition to the composite menus, the various operating systems provide developers with other custom input controls, and sliders, ratings, and alignment buttons make it easier for users to enter.

6. Rotating interface

In real life, people use mobile phones, can be vertical, can also be horizontal, mobile forms can also be based on screen space for different adjustments. Google's Android operating system is designed to send mail:

When vertical, the screen displays 3 input boxes, and some action buttons. Horizontally, the email input box is magnified, and the screen leaves only a button on the right, maximizing the use of space.

7. Voice input

Google's Nexus One mobile phone is more advanced, it allows users to use voice input anywhere, users can through the built-in virtual keyboard switching input mode, thoroughly solve the handheld device input problem.

Here is a demo video, Google's support for Chinese voice is already strong:

Popout

Next

The mobile market is growing at a rapid pace, and as more developers and designers enter the field, it is to be seen that there will be more innovation in the design of mobile forms.

Source Address: http://www.mobilefocus.net/?p=211