microinteracciones: diseñando detalles para generar más engagement
Post on 22-Jan-2018
1.292 Views
Preview:
TRANSCRIPT
1
Microinteracciones: Diseñando detalles para
generar más engagement
Noviembre 2015
BCN MAD SCL MDE BOG LIM MEX MIA SFO
2
En nuestra vida diaria, interactuamos con productos y
sistemas todo el tiempo.
3
En nuestra vida diaria, interactuamos con productos y
sistemas todo el tiempo.
4
En nuestra vida diaria, interactuamos con productos y
sistemas todo el tiempo.
5
Pero amamos a unos productos…
6
Y a otros, simplemente los toleramos.
7
Los usuarios son más exigentes y no
se conforman con poco, cada vez
demandan más y mejores experiencias
de las marcas
8
Para poder satisfacerlos, nos hemos
decantado por darle solución a los
macroproblemas para que nos amen.
9
11
Pero al trabajar a una escala tan macro,
una parte importante del diseño a
menudo se pierde…
12
Los detalles que deleitan
13
14
Los productos que amamos muestran
una atención al detalle:
15
La hermosa curva, el clic satisfactorio, el modelo
mental comprensible
16
O un pedazo de retroalimentación que te hace sonreír
17
Estos son difíciles de lograr cuando se
trabaja en una gran escala.
18
Apple es el rey del detalle. Por eso lo amamos y
odiamos todo lo que lleva la marca Microsoft
19
Al enviar un email, compartir un archivo, agrandar una
foto, cerrar una pestaña o hacer un retweet.
20
Al enviar un email, compartir un archivo, agrandar una
foto, cerrar una pestaña o hacer un retweet.
21
Al enviar un email, compartir un archivo, agrandar una
foto, cerrar una pestaña o hacer un retweet.
22
El contacto que tenemos con el software
es íntimo; un acercamiento que define
nuestra experiencia con el producto.
23
Es aquí donde se da el real punto de
inflexión
24
Lo que hace que lo amemoso lo odiemos.
25
Lo que realmente determina el
engagement del usuario con la
marca… Su éxito.
26
A esos mini momentos de verdad, es lo
que llamamos microinteracciones.
27
¿QUÉ SON LAS
MICROINTERACCIONES?
28
Las microinteracciones están
contenidas en momentos que giran
alrededor de un solo caso de uso de una
tarea principal.
29
• Son simples
• Son generalmente breves
• No requieren demasiado esfuerzo
30
Crear un evento de calendario, añadir una búsqueda de contactos
o hacer un comentario son interacciones fáciles de realizar
31
Al hacer UX, son estas interacciones
simples y pequeñas las que solemos
pasar por alto o dejamos para el último
momento, haciéndolos aburridos
32
¿Pero por qué es tan importante
enfocarnos en ellas?
33
Las microinteracciones evocan
emociones y la emoción forma parte del
50 % de la experiencia.
34
Se puede llegar a tomar 12
experiencias positivas, para
compensar una experiencia negativa
que haya tenido un cliente… si es que
nos da la oportunidad de brindársela.
35
Más del 95 % del pensamiento humano
es empujado por influencias
inconscientes, cosas que ni siquiera
consideramos pueden generar una
respuesta emocional.
36
20000 momentos en un día son
los que nuestro cerebro evalúa y graba
como experiencias.
Daniel Kahneman,
premio nobel de economía 2012
37
Si tu mayor preocupación pasa por la
experiencia del usuario, entonces debes
preocuparte por las
microinteracciones.
38
Y convertirlas en momentos reflexivos
de deleite.
39
El famoso diseñador Charles Eames dice a menudo,
"Los detalles no son los detalles. Ellos son el diseño.”
40
Los detalles necesita ser increíblemente
sencillos y muy intuitivos. Obsesionarse
con estos detalles de diseño hacen toda
la diferencia en la experiencia del
usuario.
41
El Iphone no sería lo que es si Apple no tuviera sumo
cuidado en trabajar sus interacciones
42
ESTRUCTURA DE LAS
MICROINTERACCIONES
43
DISPARADOR REGLAS RETROALIMENT
ACIÓN
LOOPS&MODES
Es el detonante que
inicia una
microinteracción
Definen lo que se
puede hacer y lo que
no
Nos permite saber lo
que está pasando
Determina la acción y
la duración de la
microinteracción
44
DISPARADOR
45
REGLAS
46
RETROALIMENT
ACIÓN
47
LOOPS&MODES
48
¿CÓMO TRABAJAR BUENAS
INTERACCIONES?
49
¿Entonces cómo podemos refinar los
detalles para hacer que un producto sea
exitoso y genere una excelente UX?
50
Adaptar nuestro diseño a cada
usuario de distinto tipo.
Reducir complicaciones que
reduzcan su entendimiento.Tratar cada funcionalidad
como un conjunto de
microinteracciones
vinculadas.
1 2 3
51
Visualmente pulido
52
Atención a los microcopys
53
Transiciones con un propósito concreto
54
Inspirándonse en la vida real
55
Con una pizca de humor
56
Algún regalito de por medio
57
Algún regalito de por medio
58
Y ahora, ¿A dedicarle más tiempo a
trabajar esos grandes pequeños
detallitos?
59
¿PREGUNTAS?
60
top related