User experience with virtual forms

Las personas que ingresan a los sitios web persiguen diferentes objetivos: comprar productos, obtener algún tipo de información, realizar un registro, entre otros. En la mayoría de casos se requiere llenar un formulario con una serie de datos personales, momento muchas veces engorroso. Los formularios, tanto para desktops como móviles, son pasos necesarios para generar conversiones. Por ello, es importante diseñarlos de tal forma que sean dinámicos y útiles.


PROCEDURE

Para este artículo, se evaluaron 3 plataformas distintas: creación de perfil para Domino´s pizza, creación de cuenta de Amazon y formulario del MTC para renovar licencia de conducir.


FINDINGS

Let's imagine a funnel: a large number of users enter the platform, then a few arrive at the form and only some fill in all the data, others fall by the wayside. So why are so few users encouraged to fill in the form? Here are some of the most common pitfalls.

  1. Registration errors

This is a typical problem, where the user realises that there is already a registered email address or that some data has been entered incorrectly. What happens is that a feeling of insecurity is created, which makes the user lose the confidence to continue with the registration. For this reason, they end up abandoning the page or deleting the application they were going to register.

1
Source: Designers; Dominos pizza profile
  • Lack of autofill formatting

When there are several fields to fill in, autofill is available to help speed up the process. For example, in the place of origin record, filling in a single field (e.g. district where you live) allows the system to auto-fill the other fields, such as country and city. The drawback is that many platforms do not take this into account and make it inefficient and burdensome for the user.

  • Complex structure

When the design of the forms is poorly structured. We observe the clear example in the following point, where the MTC (Ministry of Transport and Communications) form for registration is presented. It is not visually friendly and contains two columns where a lot of data is requested.

  • A lot of information

Organisations often try to collect too much information from users when this is really unnecessary. In addition, they ask for the same data over and over again, which is obsolete. This is especially tedious for users who register using a mobile device. It turns out that, as the screens are small, it becomes unreadable and dynamic for the user to interact with the system, so they end up logging out or simply deleting the application.

1
Source: MTC registration platform

RECOMMENDATIONS

Structure

Primero, se debe de entender que hay interacción entre el usuario y la plataforma, sea esta en un desktop o en un dispositivo móvil. Por esto, es importante que el creador del formulario use las herramientas adecuadas para ofrecer “más con menos”. Es decir, mientras más simple sea, más usuarios estarán dispuestos a llenar los campos y habrá un mayor porcentaje de conversiones. La estructura también debe de contar con el orden adecuado (nombre, apellido, fecha de nacimiento…) Estas deben de estar agrupadas por secciones para que sea coherente y se asemeje a una conversación con el usuario.

1
Credits: Juan Carlos Ferraris - Left: A way of interpreting the relationship between the fields when they are organised in two columns. Right: Straight line towards the bottom of the page.

Another recommendation is to use a single column. Often two or more are used, making the form horizontal. Doing it vertically will make the user continue the journey to the end of the form and a conversion is finally made.

Fields to fill in

Es importante minimizar el número de campos para ahorrarle tiempo al usuario y que no termine abandonando la sesión. Por otro lado, se debe de evitar los campos opcionales, ya que el usuario creerá que resulta irrelevante llenar el formulario. En todo caso, cuando son formularios en los que se presentan campos obligatorios y opcionales, es imprescindible señalarlos para tener una mayor comprensión de lo que se solicita. Existen los datos por default, donde el sistema los rellena automáticamente. Estos son (por ejemplo) datos de geolocalización, donde la plataforma reconoce donde te encuentras y evita que se coloque de manualmente.

On the other hand, it is suggested to have a "friendly" keyboard. This is for phones that normally display forms on a small screen; therefore the keyboard is also small and may encourage typing errors. Having a large system keyboard will make it more readable and easier to fill in data.

Tags

It is of utmost importance to label each field. This will make it easier for the user to read and help them through the process. These words should be short and clear.

1
Credits: Juan Carlos Ferraris
Buttons

We must ensure that the buttons are clearly visible and that they are not confused within the forms. Therefore, it is more useful to place them at the end of the form, ensuring that they have contrast so that the user can identify them.

1

Let's talk. Contact us for further information. 

Freddy Linares
Freddy Linares

Director