Cómo usar microinteracciones en diseño UX

Las microinteracciones son pequeños momentos en los que el usuario y el diseño interactúan. Cuando están bien diseñados, las micro interacciones mejoran la experiencia del usuario con el diseño. Cuando están mal diseñados, dañan la experiencia.

Las microinteracciones son una de las tendencias de UX más populares en este momento.

Dan Saffer, autor del libro Microinteracciones y vicepresidente de productos de Mayfield Robotics, define las microinteracciones como "momentos de productos contenidos que giran en torno a un solo caso de uso: tienen una tarea principal". Cada vez que cambie una configuración, sincronice sus datos o dispositivos, configure una alarma, elija una contraseña, inicie sesión, establezca un mensaje de estado o favorito o haga clic en "me gusta", está participando en una microinteracción. Están en todas partes: en los dispositivos que transportamos, los electrodomésticos en nuestra casa, las aplicaciones en nuestros teléfonos y computadoras de escritorio, incluso integrados en los entornos en los que vivimos y trabajamos.

Según Saffer, las microinteracciones son buenas para:
realizar una sola tarea y solo una tarea
interactuar con una sola pieza de datos, como la temperatura o calificar una canción
controlando un proceso continuo, como el volumen de una canción en Spotify
ver o crear un pequeño contenido, como un estado en Facebook
activar o desactivar una característica o función

Microinteracciones: Edición a todo color: Diseñando con detalles Primera edición

Podemos usar algún elemento digital:

Elemento digital + razón

Barra de desplazamiento:
Usuario activado; retroalimentación visual al usuario que cambia la ubicación dentro de una página
Alarma digital:
Sistema activado retroalimentación auditiva (y visual) a la condición de tiempo que se cumple
Animación de extracción para actualizar:
Usuario activado; retroalimentación visual a una acción del usuario
notificación por correo:
Sistema activado proporciona al usuario comentarios de que ha llegado un nuevo mensaje
Estado actual del sistema:
Si los usuarios no están informados, es probable que se molesten y cierren el sitio o la aplicación.
Botón animado
Usuario activado; retroalimentación visual a una acción del usuario
Llamada a la acción:
Las microinteracciones esencialmente empujan al usuario a interactuar con una aplicación o sitio web.
Golpe fuerte:
Ayuda al usuario a cambiar rápidamente entre las pestañas y adquirir más información sobre el producto.
Entrada de datos:
Esta acción puede elevar fácilmente los molestos. Si bien las sugerencias proactivas sobre la seguridad y el uso de la contraseña facilitan que el usuario avance, algunas interacciones interactivas en el momento de la entrada de datos también mantienen a los usuarios comprometidos con el proceso y ayudan a lograr el objetivo.
Hacer tutorial interting:
Los tutoriales con la ayuda de la microinteracción guían a los usuarios sobre el funcionamiento de una aplicación al simplificar y resaltar las características básicas y los controles importantes para una fácil comprensión.

¿Por qué usamos disparadores?

Un disparador inicia una microinteracción. Las Reglas determinan lo que sucede, mientras que los Comentarios le permiten a las personas saber lo que está sucediendo. Los bucles y modos determinan las meta-reglas de la microinteracción. Cada parte se detalla en su propio capítulo en Microinteracciones.

  • Fomentar el compromiso
  • Mostrar el estado del sistema
  • Proporcionar prevención de errores
  • Marca comunicante

Reglas

El gatillo involucra las reglas. Esto es lo que sucede durante la interacción y debe sentirse natural para un usuario.

7 razones, ¿por qué la microintración mejora el diseño de Ux?

1. Tiempo de respuesta

2. Repetición

3. simplicidad

4. Relatable

5.Fácil de usar

6. Animación

7 equilibrio