#2 Microinteracciones, el diablo está en los detalles, con Yolanda del Olmo
Por todos es sabido que el diablo se esconde en los detalles (y a veces en las microinteracciones ). Concretamente en diseño, podría hacerse un castillo con todas las opiniones y los matices vertidos sobre cualquier propuesta.
Pero también es en los detalles donde nuestro producto puede crecer y convertir una experiencia buena en una única y personalizada. Y aquí es donde cobran relevancia las microinteracciones, ya que una gran experiencia de usuario suele ir acompañada de ellas.
Sigue leyendo el artículo o si lo prefieres puedes escuchar el podcast de Yolanda explicando qué son y cómo funcionan las microinteracciones en:
Escucha el podcast de la entrevista con Yolanda del Olmo
Si deseas escuchar este episodio puedes hacerlo desde el reproductor. Para descargar el recurso relacionado debes formar parte de nuestra escuela y comunidad de TribUX
Peero…¿Microinteraciones? ¿Y eso qué es? ¿Se comen?
Una forma de definirlas sería:
“Respuesta al usuario por parte de la interfaz de una forma inesperada a la par que poco intrusiva ante un caso de uso particular”
Además las microinteracciones, aparte de ser poco intrusivas, guían al usuario y al mismo tiempo dotan de personalidad propia a la experiencia de uso de nuestro producto digital.
Sin embargo, no deben centrarse únicamente en sorprender, también tienen que ser útiles. Deben aportar información o generar transparencia en los procesos en los que se encuentre inmerso el usuario. En otras palabras, tienen que simplificar la experiencia de usuario haciendo que sea más intuitiva.
Es un error bastante común es pensar que, añadiendo comportamientos a ciertos elementos de la interfaz, ya es automáticamente una microinteracción. Lamentablemente una microinteracción y una animación no funcionan de la misma forma.
A modo de ejemplo, en el proceso de carga de documentos se produce un error en la ejemplo A, nos informa que ha ocurrido un error y nos da una acción para solventarlo (volver a cargarlo).
En contraposición, en el ejemplo B, ocurre una animación que muestra la evolución de la descarga pero tras el error no da ninguna alternativa para solucionar el problema.
Y esta es una de las principales diferencias con una animación.
“Las microinteracciones pueden consistir en animaciones pero no todas las animaciones son microinteracciones.”
Para ello, debemos comprender su mecanismo.
Si te interesa saber cómo hacer una interacción, hemos preparado un curso para comprender en profundidad las microinteracciones.
¿Y cómo funcionan?
Desde un punto de vista formal, Dan Saffer propone un mecanismo compuesto por varias fases.
1) Trigger (disparador) → Es el evento o la condición que desencadena una microinteraccion. Ejemplo: pulsar un botón
2) Reglas → determinan cómo va a “funcionar” la microinteracción y se suelen transmitir a través del feedback de las acciones.
3) Feedback → Respuesta que devuelve la microinteracción. Volviendo al ejemplo anterior, una posibilidad de feedback podría ser que se abra el chat donde se encuentre la conversación mientras que otra opción podría ser la posibilidad de mostrar un campo de texto donde responder (i̶n̶c̶l̶u̶y̶e̶n̶d̶o̶ ̶g̶i̶f̶s̶,̶ ̶p̶o̶r̶ ̶s̶u̶p̶u̶e̶s̶t̶o̶ )
4) Bucles y modos → Los bucles hacen a referencia a la frecuencia que se producirá la microinteracción. Una forma que puede ayudar a definir los bucles es preguntarnos en qué casos de usos se mostrará microinteracción.
¿Solo en ciertos casos de uso? ¿Cuáles serían? Por ejemplo, ocurrirá solo en los casos cuyo contacto tenemos marcado como importante o se mostrarán con todos los contactos. Dicho de otra manera, piensa cuántas veces se repetirá la microinteracción dentro de la interfaz.
Cuando hablamos de modos, nos referimos a la duración de la microinteracción dentro de la vida de nuestro producto digital. En este caso, debemos plantearnos si una microinteracción formará parte de la interfaz de forma temporal o será una seña de identidad de la experiencia.
Una forma sencilla de ver la diferencia entre modos, es si estamos diseñando una funcionalidad que estará disponible temporalmente o no.
Como ejemplo, en una aplicación sobre la previsión del tiempo las microinteracciones relacionadas con la lluvia se mostrará solo cuando la predicción del tiempo indique que va a llover.
¡Nos vemos!
Artículo escrito por Yolanda del Olmo, diseñadora de experiencia de usuario y profesora de Píldoras UX
Yolanda del Olmo te explica en cinco minutos qué es una microinteracción:
Curso de microinteracciones:
¿Te interesa el tema? ¿Crees que puedes potenciar la identidad de tu producto con microinteracciones potentes? ¡Entonces estás de suerte!…
Yolanda ha creado este curso para que aprendas más sobre microinteracciones.
