Labels placed inside form fields are widely used in mobile apps. The primary use of these labels is to display the field context. However, Inline labeling is also, at times, used for efficient onscreen space management.
Inline labeling is an optimum web development practice. The placeholders are always beneficial for the end-user and UI/UX developers to assess the need for a certain field in a mobile app form. These labels come in handy when the mobile app has fewer forms such as login and search. The usage of these inline labels allows the users to identify the purpose of the form and the input types that are acceptable.
Top Align the labels
In case labels are left aligned in a field, there is a chance that lesser space will be available to display the user input. At times when inputs are expectedly large, the best practice is to top-align the label in order to create more space for user input. With more input details available to a user in a field, it will be lesser prone to errors. The only drawback of this practice is large vertical space occupancy. With top –aligned labels and placeholders, users might need to scroll more in an app.
Break forms into multiple screens
Another optimal practice while using inline labels within mobile app is to break the forms down into multiple screens. This practice is valid for apps that require more user information. Classically, a form will have all the fields on a single screen. However, the display restrictions of a mobile app constraints the amount of data that can be displayed on a single screen. Slicing the form on multiple screens and drafting it in a wizard-mode is definitely helpful for app users.
Use Pickers for known input
When designing an app, it is necessary for the developer to get acquainted with “pickers” – choice in a form. The “pickers” technique in mobile apps help users to quickly identify a value the form requires. Some examples of pickers are states, pre-set app values etc. In case your targeted audience requires access to larger data, then using tables is recommended instead of “picker” technique.
Normally, all smart phones now come without a physical keyboard. And while developing an app, it is recommended to echo keyboard function as soon as there is a form that requires input. The recommended practice is to call an appropriate keyboard whenever there is need. For instance, if the form input needs to be numerical, then only a numeric keyboard should be shown.
The bottom line in mobile app form design is to enrich the user experience with clutter removal and a simplistic interface. Most of the mobile apps require users to input values in a form, so the best practices for creating and developing these forms should be applied. The application of these practices helps you achieve better user satisfaction.
Shujaat is the custom iOS development lead at TechArete.