{"id":9285,"date":"2019-06-27T13:53:09","date_gmt":"2019-06-27T11:53:09","guid":{"rendered":"https:\/\/www.makingscience.com\/blog\/el-gran-aliado-de-los-usuarios-son-las-microinteracciones\/"},"modified":"2019-06-27T13:53:09","modified_gmt":"2019-06-27T11:53:09","slug":"el-gran-aliado-de-los-usuarios-son-las-microinteracciones","status":"publish","type":"post","link":"https:\/\/www.makingscience.com\/es\/blog\/el-gran-aliado-de-los-usuarios-son-las-microinteracciones\/","title":{"rendered":"El gran aliado de los usuarios son las microinteracciones"},"content":{"rendered":"<div>El gran aliado de los usuarios son las microinteracciones<\/div>\n<div><span style=\"font-weight: 400; color: #000000;\">Uno de los mayores problemas que tienen los usuarios cuando se encuentran en un entorno digital es la comunicaci\u00f3n con el sistema. Para mejorar el <em>engagement<\/em> con los usuarios, los dise\u00f1adores suelen utilizar microinteracciones y as\u00ed crear \u00absensaciones de bienestar\u00bb, mientras que el usuario interact\u00faa con el sistema. Estas \u00absensaciones\u00bb en muchos casos hacen que la interacci\u00f3n sea m\u00e1s humana, acercando el producto al usuario sin que \u00e9ste lo perciba y, a su vez, ayud\u00e1ndole a experimentar una conexi\u00f3n con la marca que le haga regresar.<\/span> <\/p>\n<h2>\u00bfQu\u00e9 son las microinteracciones?<\/h2>\n<p> <span style=\"font-weight: 400;\">Las <strong>microinteracciones<\/strong> son aquellas interacciones que hacen que se forje una estrecha relaci\u00f3n entre el sistema y el usuario y, a falta de ellas, se puede dar que un producto sea f\u00e1cil de olvidar. Por ejemplo, \u00bfqu\u00e9 pasar\u00eda si al intentar \u201crefrescar\u201d el correo el sistema no te devolviese un elemento de carga? La audiencia pensar\u00eda que no tienen m\u00e1s correo o que el servicio se ha quedado bloqueado.<\/span>  <img fetchpriority=\"high\" decoding=\"async\" class=\"wp-image-2553 aligncenter\" src=\"\/wp-content\/uploads_old\/2019\/06\/iOS-7-Mail-pull-to-refresh.gif\" alt=\"\" width=\"230\" height=\"408\" \/> <\/p>\n<p style=\"text-align: left;\"><em><span style=\"font-weight: 400;\">Mail<\/span><\/em><\/p>\n<p> &nbsp;  <span style=\"font-weight: 400;\">Las <strong>microinteracciones<\/strong> funcionan porque el usuario tiene un deseo de obtener un reconocimiento. Al usuario\u00a0 le gusta saber al instante que su acci\u00f3n fue aceptada u obtener una recompensa visual. Si obtiene la segunda, esta debe ser invisible para que no sean inc\u00f3moda o molesta y se ha de poder utilizar a largo plazo, pues esto es lo que la hace ser relevante para la experiencia de usuario. <\/span>  <span style=\"font-weight: 400;\">Todas ellas tienen que ser familiares para el <em>target<\/em> de nuestro producto, de manera que no sea necesario elevar la carga cognitiva del proceso, creando una armon\u00eda visual con el resto de elementos de la interfaz pero sin ser repetitivas para mantener el inter\u00e9s de la audiencia.<\/span>  <span style=\"font-weight: 400;\">Normalmente el usuario inicia la microinteracci\u00f3n a trav\u00e9s de una acci\u00f3n, ya sea encima de un elemento o presionando un bot\u00f3n, como por ejemplo el cambio del bot\u00f3n de descarga por la <em>loader<\/em>.<\/span>  <img decoding=\"async\" class=\"wp-image-2554 aligncenter\" src=\"\/wp-content\/uploads_old\/2019\/06\/sc04_download_one_file_recip.gif\" alt=\"\" width=\"260\" height=\"347\" \/> <\/p>\n<p style=\"text-align: left;\"><em><span style=\"font-weight: 400;\">WeTransfer<\/span><\/em><\/p>\n<p> &nbsp;  <span style=\"font-weight: 400;\">La gran versatilidad de las microinteracciones hacen que las podamos encontrar alrededor de cualquier acci\u00f3n potencial. En general, tienden a aparecer en las siguientes \u00e1reas:<\/span>  <b>Mostrar el estado del sistema<\/b>  <span style=\"font-weight: 400;\">El primer principio heur\u00edstico de usabilidad de Jakob Nielsen es \u201cDar visibilidad al estado del sistema\u201d que trata de mantener siempre al usuario informado sobre lo que est\u00e1 ocurriendo o donde est\u00e1, por ejemplo: en los casos anteriores de descarga de elementos, hay sistemas que necesitan tiempo para ser cargados. Otro ejemplo ser\u00eda la posici\u00f3n en la que se encuentra el usuario en un formulario.<\/span>  <img decoding=\"async\" class=\"size-full wp-image-2552 aligncenter\" src=\"\/wp-content\/uploads_old\/2019\/06\/progress-bar.gif\" alt=\"\" width=\"800\" height=\"83\" \/>  <b>Prevenci\u00f3n de errores<\/b>  <span style=\"font-weight: 400;\">La prevenci\u00f3n de errores es otra de las heur\u00edsticas de Nielsen que se centra en facilitar al usuario la informaci\u00f3n correcta para que este no cometa fallos en situaciones complejas. Por ejemplo: Mailchip utilizar microinteracciones para evitar errores en la validaci\u00f3n de una nueva contrase\u00f1a en el momento de introducirla.<\/span>  <img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-2555 aligncenter\" src=\"\/wp-content\/uploads_old\/2019\/06\/contrasen\u0303a-1.gif\" alt=\"\" width=\"572\" height=\"196\" \/> <\/p>\n<p style=\"text-align: left;\"><em><span style=\"font-weight: 400;\">Mailchimp<\/span><\/em><\/p>\n<p> <b>Cambios destacados<\/b>  <span style=\"font-weight: 400;\">En ocasiones hay que facilitar que el usuario preste atenci\u00f3n a un elemento con informaci\u00f3n relevante, aunque este no haya interactuado con \u00e9l. Por ejemplo, uno de los casos m\u00e1s comunes es la localizaci\u00f3n de tu posici\u00f3n en un mapa.<\/span>  <img loading=\"lazy\" decoding=\"async\" class=\" wp-image-2556 aligncenter\" src=\"\/wp-content\/uploads_old\/2019\/06\/mapa.gif\" alt=\"\" width=\"478\" height=\"422\" \/> <\/p>\n<p style=\"text-align: left;\"><em><span style=\"font-weight: 400;\">SIX<\/span><\/em><\/p>\n<p> <b>Comunicaci\u00f3n de la marca<\/b>  <span style=\"font-weight: 400;\">Todas las microinteracciones deb\u00edan tener un prop\u00f3sito y transmitir al usuario el significado de la acci\u00f3n, siempre acorde con el tono de la marca. En este caso, Mailchimp transmite a los usuarios la satisfacci\u00f3n de haber completado todos los env\u00edos de acuerdo con el lenguaje de la marca.<\/span>  <img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-2550 aligncenter\" src=\"\/wp-content\/uploads_old\/2019\/06\/mailchimp.gif\" alt=\"\" width=\"400\" height=\"300\" \/> <\/p>\n<p style=\"text-align: left;\"><em><span style=\"font-weight: 400;\">Mailchimp<\/span><\/em><\/p>\n<p> <span style=\"font-weight: 400;\">Para concluir, en el <strong>dise\u00f1o de las microinteracciones<\/strong> lo prioritario es c\u00f3mo el producto atraiga a los usuarios hasta en los m\u00ednimos detalles, haciendo que situaciones complejas resulten f\u00e1ciles de entender y, a su vez, lleven al producto al \u00e9xito diferenci\u00e1ndolo de otros.<\/span><\/div>\n","protected":false},"excerpt":{"rendered":"<p>El gran aliado de los usuarios son las microinteracciones Uno de los mayores problemas que tienen los usuarios cuando se encuentran en un entorno digital es la comunicaci\u00f3n con el sistema. Para mejorar el engagement con los usuarios, los dise\u00f1adores suelen utilizar microinteracciones y as\u00ed crear \u00absensaciones de bienestar\u00bb, mientras que el usuario interact\u00faa con [&hellip;]<\/p>\n","protected":false},"author":21,"featured_media":9286,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[27,34],"tags":[70,68],"class_list":["post-9285","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-advertising","category-technology-ai","tag-ux-cro","tag-web-development"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/posts\/9285","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/users\/21"}],"replies":[{"embeddable":true,"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/comments?post=9285"}],"version-history":[{"count":0,"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/posts\/9285\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/media\/9286"}],"wp:attachment":[{"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/media?parent=9285"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/categories?post=9285"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.makingscience.com\/es\/wp-json\/wp\/v2\/tags?post=9285"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}