Los formularios, dentro de una aplicación móvil o página web, nos sirven para solicitar información como parte de un proceso, por ejemplo, un inicio de sesión o un pago en línea.
El hecho de utilizar un formulario nace de la necesidad de mantener una conversación con el usuario, de solicitar información y dar retroalimentación; proceso que, “cara a cara”, parece ser mucho más fácil que en medios digitales, donde debió diseñarse la forma correcta de realizarlo.
¿Y qué mejor que apegarse a aquello que ya conoce el usuario?
Hacer que la interacción del usuario con el formulario sea lo más parecido posible a una conversación entre dos personas, parece lo más congruente 🤔.
Por tanto, el diseño en un formulario debe buscar la comunicación clara con el usuario, que éste entienda qué se le solicita y de qué forma; tratando de preveer cualquier duda que pueda tener el usuario en el proceso.
Elementos como el tamaño del texto, colores y alineación hasta la forma en que le hablamos al usuario al hacerle una consulta y cómo le mostramos mensajes, son aspectos importantes en el diseño.
A continuación definimos todos los elementos que debe tener un formulario y características que debe cumplir para ser usable:
Existe un estándar sobre estos, los principales son:
Damos retroalimentación al usuario por medio de mensajes, lo mantenemos actualizado del proceso.
Las etiquetas le indican al usuario que información es necesaria en cada caso.
Los inputs o campos para introducir información permiten al usuario dar la retroalimentación que deseamos; estos incluyen: campos de texto, campos para contraseñas, combo box, check boxes, radio buttons, sliders, list boxes, pickers.
Muy similares a los mensajes, pero específicamente le dicen al usuario si la información que ingresó es correcta o no.
Elementos que le indican al usuario cómo llenar un campo.
Enlaces o botones que producen una acción al ser presionados.
En el libro Forms That Work: Designing Web Forms for Usability, Caroline Jarrett and Gerry Gaffney, definen tres aspectos fundamentales a tomar en cuenta para asegurar la usabilidad de un formulario:
Establecer una relación entre el usuario y la entidad o empresa.
¿Por qué debemos procurar crear una relación con nuestro usuario?
Indique su objetivo al inicio del formulario, mediante un título, y utilice una palabra lo suficientemente descriptiva en el botón de finalizar (ejemplo: Registrarme, Ordenar ahora, Pagar).
Además, el hecho de brindar una descripción del por qué es necesaria la información que consulta, hará menos probable que el usuario no quiera compartirla.
Establecer un diálogo con el usuario.
Tenga en cuenta las características del usuario: escolaridad, experiencia en la utilización del dispositivo; utilice palabras que les resulten familiares.
¿Tiene sentido el orden de las preguntas? ¿Voy de lo general a lo específico? y en caso de ser extenso, ¿Mis consultas tienen una categorización clara?
Es importante transmitirle al usuario si la información que ingresa es correcta, al menos para nuestros parámetros.
Retomando nuestra analogía inicial ¿Qué pasaría si converso con una persona, y después de responderle una serie de preguntas, me dice que no le parece mi primera respuesta? Pierdo el hilo de la conversación, tengo que volver y retomar un tema que ya olvidé en parte.
Lo mismo sucede en los formularios, se corta el flujo cuando el usuario debe volver preguntas arriba a realizar una corrección.
Cuando los formularios se perciben complicados o extensos, es aún más difícil para el usuario empezar a completarlos.
Debe tener claro que reducir la cantidad de inputs no lleva solamente trabajo gráfico, adicionalmente debe analizar la forma en que pide la información y la cantidad real que necesita.
Una buena apariencia apoya los dos puntos anteriores.
All caps le complica la lectura al usuario.
Utilice un formato que le permita al usuario saber siempre qué información se le solicita. Lo anterior, utilizando la etiqueta fuera del input, evitando lo conocido como Inline Labels.
Presente al usuario la etiqueta cerca del correspondiente espacio para introducir la respuesta, e incluya más espacio entre cada pareja de elementos, creando claros grupos de elementos.
Los usuarios completarán los formularios que posean este tipo de alineación más rápido que aquellos formularios en los cuales se mantengan alineada la etiqueta, esto porque poseen un mejor flujo de lectura.
No utilice los placeholder para información adicional, como descripción del input o para agregar cualquier otro dato que el usuario necesite ver al momento de ingresar la respuesta.
Nunca utilice dos o más columas en un formulario. Evite que el usuario haga una lectura en Z, dé un orden claro a la información.
Definitivamente podemos jugar un poco con las reglas, pero para llegar a eso debemos conocer a profundidad a nuestro usuario; las verdaderas reglas vienen de los esquemas mentales.
Compartir artículo