Cómo diseñar una interfaz de usuario basada en gestos
¿Recuerda los días en que pasar el mouse y hacer clic con el mouse eran los desencadenantes más utilizados para la interacción con un sitio o aplicación? Esos días pasaron. Cuando Apple presentó el primer iPhone, la tecnología multitáctil se generalizó y los usuarios aprendieron que no solo podían apuntar y tocar la interfaz, sino también pellizcar, extender y deslizar. Los gestos se convirtieron en los nuevos clics.
Hoy en día, el éxito de una interfaz de usuario móvil puede deberse a la eficacia con la que utiliza gestos.
Cómo elegir un buen gesto
Cuando se trata de incorporar gestos en su interfaz de usuario, es esencial conocer su mercado y las otras aplicaciones que su público objetivo puede estar usando. Intente emplear los mismos tipos de gestos en su aplicación. De esta manera, no solo está optimizando su interfaz de usuario en función del comportamiento de su mercado objetivo, sino que también está diseñando un enfoque más cómodo para los usuarios desde el principio.
Enseñar gestos
Los gestos son imprescindibles en todas las aplicaciones móviles, pero siempre es un desafío hacerlos obvios para los usuarios. Las interfaces táctiles brindan muchas oportunidades para usar gestos naturales como tocar, deslizar y pellizcar para hacer las cosas, pero a diferencia de los controles de la interfaz gráfica de usuario, las interacciones basadas en gestos a menudo están ocultas para los usuarios. Entonces, a menos que los usuarios tengan conocimiento previo de que existe un gesto, no lo intentarán.
Por lo tanto, el diseño para el descubrimiento es crucial. Debe asegurarse de proporcionar las señales correctas: significantes visuales que ayudan a los usuarios a descubrir fácilmente cómo pueden interactuar con una interfaz.
Evite tutoriales y tutoriales durante la incorporación
Los tutoriales y recorridos son una práctica bastante popular para las aplicaciones basadas en gestos. Incorporar tutoriales en su aplicación en muchos casos significa mostrar algunas instrucciones al usuario para explicar la interfaz. Sin embargo, un tutorial de IU no es la forma más elegante de explicar la funcionalidad principal de una aplicación. El principal problema con los tutoriales iniciales es que los usuarios deben recordar todas esas nuevas formas de usar la aplicación una vez que ingresan. Demasiada información a la vez puede generar más confusión. Por ejemplo, la aplicación Clear comienza con un tutorial obligatorio de 7 páginas y los usuarios deben leer pacientemente toda la información e intentar memorizarla. Ese es un mal diseño porque requiere que los usuarios trabajen por adelantado incluso antes de probar la aplicación.
Educar en el contexto de la acción
Cuando se trata de enseñar a los usuarios a usar su interfaz de usuario, recomendaría hacerlo principalmente educando en el contexto de la acción (cuando un usuario realmente lo necesita). Para enseñarle a la gente un nuevo gesto hay que empezar lentamente. Dada alguna iteración, las instrucciones se pueden transformar en un descubrimiento más gradual. Utilice consejos justo a tiempo y concéntrese en explicar una única interacción en lugar de tratar de explicar cada acción posible en la interfaz de usuario. Insinúe gestos proporcionando pistas contextuales obvias.
A continuación, puede ver una pantalla de educación de gestos de la aplicación de YouTube para Android. La aplicación tiene una interacción basada en gestos, pero no usa un tutorial para instruir a los usuarios. En su lugar, utiliza sugerencias que aparecen en el primer lanzamiento para los nuevos usuarios, una a la vez, a medida que el usuario llega a la sección relevante de la aplicación. La técnica se basa en comandos de texto que instan a los usuarios a realizar un gesto y describen el resultado de la interacción con una descripción breve y clara.
Utilice la animación para comunicar gestos
Los gestos, utilizables como son, no serían nada sin animación. Como diseñador, puede utilizar la animación para transmitir información sobre las acciones disponibles. Por ejemplo, para que los usuarios sepan que pueden interactuar con un determinado elemento, puede crear un comando de texto directamente en el elemento interactivo y animar el resultado de la interacción como se muestra en el siguiente ejemplo.
Hay tres técnicas populares para ayudar a educar a los usuarios, basadas en el uso de la animación. El primero es un movimiento indirecto. Sugerencia de movimiento, o sugerencia visual animada, muestra una vista previa de cómo interactuar con un elemento al realizar la acción. Tiene como objetivo crear asociaciones entre el gesto y la acción que desencadena. Por ejemplo, la mecánica de juego de Pudding Monsters se basa únicamente en gestos, pero permite a los usuarios hacerse una idea básica de qué hacer sin tener que adivinar. La animación transmite información sobre la funcionalidad: un escenario se muestra con animación e inmediatamente los usuarios tienen claro qué hacer.
Una segunda técnica son las burlas de contenido. Las burlas de contenido son pistas visuales sutiles que indican lo que es posible. Un ejemplo a continuación muestra un avance de contenido para tarjetas; simplemente muestra que existen otras tarjetas detrás de una tarjeta actual y esto deja en claro que es posible deslizar el dedo.
La tercera y última técnica que me gustaría mencionar es la asequibilidad. Puede otorgar a algunos elementos de su interfaz de usuario una alta capacidad para señalar a los usuarios las funciones de una interfaz y utilizar rebotes o pulsos como un indicador de un gesto disponible. Un ejemplo de esta técnica se puede encontrar en Apple iOS. Cuando un usuario toca el ícono de la cámara, la pantalla de bloqueo rebota, revelando la aplicación de la cámara debajo.
Conclusión
Si bien es cierto que los gestos táctiles son en su mayoría invisibles para nosotros, hay una serie de técnicas de diseño que pueden dar a los usuarios una idea de lo que es posible. Las sugerencias de Just in Time, las pistas de animación y las burlas de contenido son algunas de las formas en que se pueden revelar los gestos ocultos.
