Catalina Gonzalez Tarea 3- Taller de Diseño de Interacción 2020

De Casiopea



TítuloCatalina Gonzalez Tarea 3- Taller de Diseño de Interacción 2020
AsignaturaTaller de Diseño de Interacción
Del CursoTaller de Diseño de Interacción 2020
CarrerasDiseño, Diseño Gráfico, Diseño Industrial
3
Alumno(s)Catalina Gonzalez

¿A qué se refiere cuando se habla de patrones de interacción?

Los patrones de diseño nacen en el campo de la arquitectura de mano de Christoper Alexander como una forma de ofrecer una solución común a un problema de diseño, el cual definía un patrón de la siguiente manera:

«Cada Patrón describe un problema que ocurre una y otra vez en nuestro ambiente, y luego describe el núcleo de la solución a ese problema, de forma tal que esa solución puede ser usada un millón de veces, sin hacerlo de la misma manera dos veces»

Todos los sistemas operativos proponen diferentes formas de interactuar con los elementos en pantalla. Conocer la diferencia entre ellos y utilizar elementos familiares para el usuario, asegura que se sienta cómodo y seguro usando la aplicación. Los patrones son una solución general que puede ser aplicada a problemas que ocurren comúnmente en el desarrollo de software.

¿Cómo identificar un patrón de interacción?

  1. Se debe haber comprobado su efectividad resolviendo problemas similares en ocasiones anteriores.
  2. Debe ser reutilizable, lo que significa que es aplicable a diferentes problemas de diseño en distintas circunstancias.



Principio de experiencia de usuario.jpg

¿Por qué son importantes los patrones de interacción dentro del diseño?

  1. Proporcionan elementos reusables en el diseño de sistemas software.
  2. Evitan la reiteración en la búsqueda de soluciones a problemas ya conocidos y solucionados anteriormente.
  3. Formalizan un vocabulario común entre diseñadores.
  4. Facilitar el aprendizaje de las nuevas generaciones de diseñadores condensando conocimiento ya existente.


Estos patrones nos permiten trabajar con el diseño de interfaces. La interfaz es el conjunto de elementos de la pantalla que permiten al usuario realizar acciones sobre el Sitio Web que está visitando. Por lo mismo, se considera parte de la interfaz a sus elementos de identificación, de navegación, de contenidos y de acción.


Cada sistema tiene su propia identidad, personalidad que es reflejada en la apariencia y comportamiento de cada uno de los elementos que componen su interfaz, haciendo esta experiencia sea diferente a las demás. Los diseñadores se enfrentan a esta premisa a diario, logrando desde su creatividad innovar y otorgar soluciones prácticas. Un patrón de interacción es eso, una solución, que ayuda a aumentar la usabilidad del producto, llegando al usuario a través de lo práctico y pragmático. Llegando al usuario desde una visual, simplificada, consistente y que aporte una navegación intuitiva.

Dentro de este proyecto se analizaron 30 distintos patrones, estos fueron agrupados en 5 grandes categorías, administrar cuenta, gestión de cuenta, acceso y seguridad, conductores y transacciones. Dentro de administrar cuenta se encuentra el patrón "eliminar cuenta"', el cual sera profundizado a continuación.


Tik Tok 8CGP.png

Eliminar cuenta

La función de este patrón es lograr eliminar una cuenta, sin tener inconvenientes, realizar este procedimiento a través de pasos sencillos y de forma eficaz. Al momento de querer eliminar una cuenta emergen preguntas desde las plataformas, las cuales buscan distintos métodos y formas, para que el procedimiento sea complejo y confuso para el usuario, con eso persuadirlo para que dude y cuestione su decisión; preguntas como:

  1. ¿Seguro que quieres eliminar tu cuenta?
  2. ¿Estas seguro de cancelar tu cuenta?
  3. ¡Oh no! ¿Nos abandonas?
  4. Estas apunto de eliminar tu cuenta ¿Estas seguro que deseas continuar?
  5. Lamentamos tener que despedirnos ¿Realmente quieres cancelar tu cuenta?
  6. Lamentamos que quieras eliminar tu cuenta
  7. ¿Estás seguro de que deseas cerrar la sesión?
  8. ¿Seguro que quieres borrar tu cuenta por completo? Lo perderás todo!


A su vez el proceso de "eliminar cuenta" es muy complejo de encontrar, ya que este no se encuentra a simple vista, un posible flujo de navegación del patrón se puede encontrar dentro del perfil del usuario, en la parte de configuraciones o ajustes, en donde esta abre distintas opciones, sobre todos de los cambios que se pueden hacer dentro de la plataforma y al final ya sea dentro de "administrador de cuenta", "privacidad y ajustes", "mi cuenta y seguridad", "información de cuenta" o "seguridad de la cuenta", uno encuentra la opción de eliminar la cuenta (en una buena UX), que va de la mano con desactivar, desconectar o cierre de cuenta (en una mala UX).

Flujo de navegacion patron eliminar cuenta.jpg

Desactivar una cuenta es un proceso previo al eliminar una cuenta, ya que en este el usuario puede volver a activarla y al eliminar una cuenta no puede recuperar el acceso. Dentro del procedimiento de cierre de la cuenta se solicita la confirmación del correo electrónico asociado a la cuenta y la contraseña, a su vez se entrega una plantilla de información sobre las consecuencias de eliminar la cuenta según cada plataforma. Al final del proceso se pregunta por ultima vez si se esta seguro de continuar el proceso de cierre. Este proceso puede ser inmediato en una buena UX o extendido e imposible de realizar en una mala UX.

Este patrón se va desglosar en dos categorías, una MALA UX, la cual contiene dos sub categorías, los procesos extendidos y los procesos no logrados y una BUENA UX. Ambas serán definidas, ejemplificadas con pantallas secuenciales, otorgando en cada ejemplo una descripción del usuario en conjunto con una partitura de interacción.

Servicio de Mala UX

Un Servicio de Mala UX se divide en dos sub categorias la primera es cuando la plataforma le otorga un PROCESO EXTENDIDO al usuario al momento de querer eliminar su cuenta. En algunos casos se le otorgara al usuario un plazo aproximado de 30 días hábiles, en donde el sistema evalúa la situación y anuncia que en ese periodo de tiempo la cuenta se eliminara de forma permanente. Este proceso no le otorga una seguridad clara al usuario, si su cuenta realmente sera eliminada, ya que la plataforma le otorga una respuesta a largo plazo y no algo inmediato. Principalmente los servicios que otorgan menos pasos para realizar estos procesos son los incluidos en esta categoría.

La segunda sub categoría es PROCESO NO LOGRADO, esto quiere decir que no se logra realizar el proceso de eliminar la cuenta. En algunos casos no existe la posibilidad de eliminar la cuenta, solamente de desactivarla, esto quiere decir que dicha cuenta se vuelve no es visible al público, y en otros casos no se entrega la información sobre la situación de "eliminar cuenta".

Servicio de Buena UX

Un Servicio de Buena UX es cuando la plataforma elimina de manera inmediata la cuenta del usuario y a su vez haciéndole llegar un correo de verificación de que el procedimiento que realizo fue finalizado con éxito. Principalmente los procesos que tienen una mayor cantidad de pasos para eliminar una cuenta son los incluidos en esta categoría. Si bien es más molesto para el usuario ya que la plataforma le otorga una mayor cantidad de preguntas y el tiempo que el usuario debe aplicar para realizar este procedimiento es mayor; la finalidad se cumple y se le ofrece al usuario una mayor seguridad al momento de eliminar su cuenta.

Servicios de Mala Ux: Procesos extendidos

Primer Caso: Snapchat

  • Nombre del Servicio:SNAPCHAT
  • Soporte del Servicio: Aplicación
  • Descripción de experiencia de usuario con el servicio:La plataforma primero desactiva la cuenta en un periodo de tiempo de 30 días y luego de confirmar la desactivacion elimina la cuenta con un periodo de espera de 30 días, por ende el usuario debe esperar 60 días para que su cuenta sea eliminada.Introducir correo y contraseña. El sistema realiza una acotaciones persuasivas hacia el usuario.Aviso de que el desactivar de la cuenta esta en proceso, en donde el sistema asegura enviar un correo de verificación
  • Colección de Pantallas Secuenciales:
 Snapchat 01CGP.png Snapchat 02CGP.png Snapchat 03CGP.png Snapchat 04CGP.png Snapchat 5CGP.png Snapchat 6CGP.png Snapchat 07CGP.png Snapchat 8CGP.png Snapchat 09CGP.png Snapchat 10CGP.png Snapchat 11CGP.png
  • PARTITURA DE INTERACCION'

'Segundo Caso: Tik Tok

  • Nombre del Servicio: TIKTOK
  • Soporte del Servicio: Aplicación
  • Descripción de experiencia de usuario con el servicio: Al igual que el caso anterior la plataforma primero desactiva la cuenta en un periodo de tiempo de 30 días y luego de confirmar la desactivacion elimina la cuenta con un periodo de espera de 30 días, por ende el usuario debe esperar 60 días para que su cuenta sea eliminada. La diferencia de este caso es que los botones que se deben cliquear dicen "Eliminar cuenta" y en letra pequeña informa lo anterior mencionado, haciéndole creer al usuario que esta fue eliminada.
  • Colección de Pantallas Secuenciales:
 Tik Tok 1CGP.png Tik Tok 2CGP.png Tik Tok 3CGP.png Tik Tok 4CGP.png Tik Tok 5CGP.png Tik Tok 6CGP.png Tik Tok 7CGP.png Tik Tok 8CGP.png
  • PARTITURA DE INTERACCION'

Tercer Caso: Yahoo

  • Nombre del Servicio:YAHOO
  • Soporte del Servicio:Sitio Web
  • Descripción de experiencia de usuario con el servicio: El sitio no confirma claramente que la cuenta fue eliminada, ya que primero se desactiva la cuenta. Ademas la plataforma constantemente muestra botones con la frase "Eliminar cuenta". Se le otorga la opción al usuario exclusivamente si no tiene ningún saldo restante y han pasado 90 días desde su descripción. Para finalizar se envía un correo de confirmación de que la cuenta fue desactivada pero eliminada en 30 días. Ademas el asusto del correo es "Se elimino la cuenta", jugando con la credibilidad del usuario de que esta ya fue eliminada.Explorar por tema-Crear o eliminar cuenta-crear o reactivar cuenta, dentro de esta opción en forma pequeña aparece "eliminar cuenta"
  • Colección de Pantallas Secuenciales:
 Yahoo 01CGP.png Yahoo 02CGP.png Yahoo 03CGP.png Yahoo 04CGP.png Yahoo 05CGP.png Yahoo 06CGP.png Yahoo 07CGP.png Yahoo 08CGP.png Yahoo 09CGP.png Yahoo 10CGP.png Yahoo 11CGP.png Yahoo 12CGP.png Yahoo 13CGP.png Yahoo 14CGP.png Yahoo 15CGP.png Yahoo 16CGP.png
  • PARTITURA DE INTERACCION'

Cuarto Caso: Pinterest

  • Nombre del Servicio: PINTEREST
  • Soporte del Servicio: Sitio Web
  • Descripción de experiencia de usuario con el servicio: El sitio intenta dar soluciones a cada justificación del desuso,ademas otorga 14 días de plazo para eliminar la cuenta.
  • Colección de Pantallas Secuenciales:
 Pinterest 1CG.png Pinterest 2CG.png Pinterest 3CG.png Pinterest 4CG.png Pinterest 5CG.png Pinterest 6CG.png Pinterest 7CG.png Pinterest 8CG.png Pinterest 9CG.png Pinterest 10CG.png
  • Partituras de Interacción:

Quinto Caso: Facebook

  • Nombre del Servicio: FACEBOOK
  • Soporte del Servicio: Sitio Web
  • Descripción de experiencia de usuario con el servicio: El procedimiento para eliminar la cuenta es seguro, pero poco dinámico ya que le otorgan al usuario un plazo de 30 días para eliminar su cuenta.
  • Colección de Pantallas Secuenciales:
 Facebook 1 CG.png  Facebook 2 CG.png Facebook 3CG.png Facebook 4CG.png Facebook 5CG.png Facebook 6CG.png Facebook 7CG.png Facebook 8CG.png Facebook 9CG.png Facebook 10CG.png Facebook 11 CG.png
  • Partituras de Interacción:

Servicios de Mala Ux: Procesos no logrados

Primer Caso: Twitter

  • Nombre del Servicio:TWITTER
  • Soporte del Servicio:Sitio Web
  • Descripción de experiencia de usuario con el servicio:Dentro de la plataforma solo se le otorga al usuario la posibilidad de desactivar su cuenta, la plataforma omite entregar información sobre eliminar dicha cuenta.
  • Colección de Pantallas Secuenciales:
 Twitter 1CGP.png Twitter 2CGP.png Twitter 3CGP.png Twitter 4CGP.png Twitter 5CGP.png Twitter 6CGP.png Twitter 7CGP.png
  • PARTITURA DE INTERACCION'

Segundo Caso: We Heart It

  • Nombre del Servicio: WE HEART IT
  • Soporte del Servicio: Aplicación
  • Descripción de experiencia de usuario con el servicio:La plataforma solamente le entrega al usuario la posibilidad de desconectar su cuenta, este proceso se realiza a través de 3 simples pasos; luego al desconectar la cuenta, la aplicación regresa a la pagina de inicio, otorgarle la posibilidad al usuario de volver a registrarse inmediatamente. No se realizo ninguna confirmación segura sobre el eliminar la cuenta, solo se desconecto, equivalente a solamente desactivarla.
  • Colección de Pantallas Secuenciales:
 We heart it 1CG.png We heart it 2CG.png We heart it 3CG.png We heart it 4CG.png We heart it 5CG.png We heart it 6CG.png We heart it 7CG.PNG
  • PARTITURA DE INTERACCION'

Tercer Caso: Watt Pad

  • Nombre del Servicio:WATT PAD
  • Soporte del Servicio:Aplicación
  • Descripción de experiencia de usuario con el servicio:La plataforma solo le ofrece al usuario la posibilidad de cerrar la sesión,ya que para eliminar la cuenta debe haber una suscripción de por medio, por ende la cuenta el usuario queda a la deriva dentro de la aplicación.
  • Colección de Pantallas Secuenciales:
 Wattpad 1CG.png Wattpad 2CG.png Wattpad 3CG.png Wattpad 4CG.png Wattpad 5CG.png
  • PARTITURA DE INTERACCION'

Cuarto Caso: Youtube

  • Nombre del Servicio: YOUTUBE
  • Soporte del Servicio: Sitio Web
  • Descripción de experiencia de usuario con el servicio:El usuario no logra eliminar la cuenta, ya que el sistema no le otorga la opción, solamente se logra eliminar el contenido subido dentro de la cuenta, en conjunto con el cierre de sesión
  • Colección de Pantallas Secuenciales:
 YouTube 1CG.png YouTube 2CG.png YouTube 3CG.png YouTube 4CG.png YouTube 5CG.png YouTube 6CG.png YouTube 7CG.png YouTube 8CG.png YouTube 9CG.png
  • Partituras de Interacción:

Servicios de Buena UX

Primer Caso: Gmail

  • Nombre del Servicio: GMAIL
  • Soporte del Servicio: Sitio web
  • Descripción de experiencia de usuario con el servicio:A pesar de las múltiples paginas para lograr e proceso, se logra eliminar la cuenta. Antes de confirmar el proceso la plataforma comunica al usuario la información necesaria paso a paso sobre las consecuencias de cerrar su cuenta de forma clara y especificando todo los puntos.
  • Colección de Pantallas Secuenciales:
 Gmail 1CG.png Gmail 2CG.png Gmail 3CG.png Gmail 4CG.png Gmail 5CG.png Gmail 6CG.png Gmail 7CG.png Gmail 8CG.png Gmail 9CG.png Gmail 10CG.png Gmail 11CG.png Gmail 12CG.png Gmail 13CG.png Gmail 14CG.png Gmail 15CG.png Gmail 16CG.png Gmail 17CG.png Gmail 18CG.png Gmail 19CG.png Gmail 20CG.png Gmail 21CG.png Gmail 22CG.png
  • PARTITURA DE INTERACCION

Segundo Caso: Instagram

  • Nombre del Servicio:INSTAGRAM
  • Soporte del Servicio:Sitio Web
  • Descripción de experiencia de usuario con el servicio:Sencillo eliminar la cuenta, los pasos son claros y la plataforma al final de del proceso confirma el proceso.¿Como elimino mi cuenta?, se otorga la posibilidad diferenciada de desactivar la cuenta y se dan a conocer información sobre la eliminación
  • Colección de Pantallas Secuenciales:
 Instagram 01CGP.png Instagram 02CGP.png Instagram 03CGP.png Instagram 04CGP.png Instagram 05CGP.png Instagram 06CGP.png Instagram 07CGP.png Instagram 08CGP.png Instagram 09CGP.png Instagram 10CGP.png Instagram 11CGP.png Instagram 12CGP.png
  • PARTITURA DE INTERACCION'

Tercer Caso: Zoom

  • Nombre del Servicio:ZOOM
  • Soporte del Servicio:Sitio Web
  • Descripción de experiencia de usuario con el servicio:El eliminar la cuenta dentro de la plataforma se realiza de manera rápida y eficaz, sin persuadir al usuario sobre su decisión.El sistema pide una confirmación del cierre de la cuenta, ademas realiza una pregunta persuasiva al usuario
  • Colección de Pantallas Secuenciales:
 Zoom 01CSGP.png Zomm 2CGP.png Zomm 03CGP.png Zomm 04CGP.png Zoom 05CSGP.png 100PX Zoom 07CSGP.png
  • PARTITURA DE INTERACCION'

Cuarto Caso: Yapo

  • Nombre del Servicio:YAPO
  • Soporte del Servicio:Sitio Web
  • Descripción de experiencia de usuario con el servicio:Al momento de eliminar la cuenta se debe aceptar y confirmar términos y condiciones sobre las consecuencias de eliminar la cuenta, esto se reitera en tres oportunidades, lo cual le otorga una confianza al usuario sobre un procedimiento seguro y eficaz.
  • Colección de Pantallas Secuenciales:
 Yapo 01CGP.png Yapo 02CGP.png Yapo 03CGP.png Yapo 04CGP.png Yapo 5CGPS.png Yapo 06CGP.png Yapo 7CGP.png Yapo 08CGP.png Yapo 09CGP.png Yapo 10CGP.png Yapo 11CGP.png Yapo 12CGP.png Yapo 13CGP.png Yapo 14CGP.png
  • PARTITURA DE INTERACCION'

Quinto Caso: Tumblr

  • Nombre del Servicio:TUMBLR
  • Soporte del Servicio: Aplicación
  • Descripción de experiencia de usuario con el servicio: En este caso la plataforma realiza una confirmación del cierre de su cuenta de forma "coloquial", comunicándole al usuario que esta ya no se encuentra existiendo dentro de la plataforma.
  • Colección de Pantallas Secuenciales:
 Tumblr 01CG.png Tumblr 02CG.png Tumblr 03CG.png Tumblr 04CG.png Tumblr 05CG.png Tumblr 06CG.png
  • PARTITURA DE INTERACCION'

Sexto Caso: Flickr

  • Nombre del Servicio: FLICK
  • Soporte del Servicio: Sitio web Y App
  • Descripción de experiencia de usuario con el servicio:Se logra eliminar la cuenta de manera efectiva,al llegar a los últimos pasos el sitio hace cuestionar al usuario de manera leve sobre si su decisión es correcta, pero luego hace efectivo el procedimiento.
  • Colección de Pantallas Secuenciales:
 Flickr 1.png Flickr 2.png Flickr 3.png Flickr 4.png Flickr 5.png Flickr 6.png Flickr 7.png


  • PARTITURA DE INTERACCIÓN

Bibliografia

  1. http://www.guiadigital.gob.cl/articulo/que-es-una-interfaz.html
  2. https://ingsoftwareisc.wordpress.com/2016/05/28/1-2-patrones-de-diseno/
  3. http://www.uxlumen.com/patrones-de-diseno-de-interaccion/
  4. https://ccc.inaoep.mx/~grodrig/Descargas/InteraPatternToCIC.pdf
  5. https://appdesignbook.com/es/contenidos/patrones-interaccion-moviles/