Omar Nuñez Tarea 3 - Taller de Diseño de Interacción 2020

De Casiopea



TítuloOmar Nuñez 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 Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property.
3
Alumno(s)Omar Nuñez

Patrónes de interacción

¿Que son los patrones de interacción?

Los patrones de interacción son una solución común a un problema de diseño que ayuda a la aplicación, sitio web o al diseñador en comunicarse fácilmente con el usuario, es un punto de partida del cual se le puede expandir en distintos enfoques de como se tratan las interacciones del sistema. La intención de un patrón de interacción es crear un lenguaje similar entre los usuarios y los desarrolladores ya que estos se pueden encontrar en muchos servicios digitales pero nunca de la misma forma o eficiencia, con los patrones todos estos servicios pueden mantener elementos ya familiarizados en la mente del usuario y crear un sentido de entendimiento y comodidad.

¿Por que es importante identificar estos patrones?

Registrar los distintos patrones y clasificarlos es esencial para crear un mejor ambiente entre usuario y servicio, tener esta información de forma accesible nos puede ayudar a discernir que clase de practicas deberíamos usar a la hora de diseñar servicios. Al entender un patrón de interacción y como se ha aplicado en otros servicios podemos ver que clase de practica funciona para el usuario y es importante tener esto en cuenta, la experiencia del usuario es uno de los puntos mas decisivos al comprobar si un servicio es amigable o funcional. Por esto hacer de estas prácticas accesibles es importante para generar una conciencia de cuales comportamientos promover y cuales evitar.

Identificar malas y buenas practicas

La experiencia del usuario es la que indica si una practica es mala o buena, es importante entender como se siente el usuario mientras utiliza el servicio. Un mismo patrón puede ser desarrollado de muchas formas por eso identificar como se usa en otros servicios es tan importante, así se puede destilar las malas practicas que deben evitarse de las buenas que deben incentivarse Una mala de experiencia de usuario puede convertir la navegación en un desastre, acciones innecesarias para ejecutar una acción habitual, menús excesivamente complicados o mal organizados pueden alejar a los nuevos usuarios, en cambio una buena experiencia de usuario genera una buena comunicación y atmósfera entre el usuario y la plataforma, seguir estándares básicos, procesos fáciles de ejecutar entre otros hacen sentir a gusto al usuario.

Patrón: Definición de preferencias para entregar servicio personalizado

La personalización de un servicio a través de medios digitales pretende el acercamiento de los intereses y necesidades del usuario, el entregar un servicio personalizado generalmente es visto como un factor positivo a la hora de elegir entre productos y servicios, esta personalización puede ir desde elegir colores por gusto, tamaño de caracteres para una mejor lectura, que accesos directos quiero ver primero en mi navegación o que tipo de contenidos son lo que me interesan ver, lo importante es hacer que el usuario pueda tener un mejor servicio según sus preferencias personales.

  • ¿Que es lo que se espera al definir preferencias? se podría pensar en una buena cantidad de opciones pero eso puede depender de que es lo que se esta personalizando, una gran cantidad de opciones puede crear un proceso muy complicado o tedioso, muy pocas opciones puede crear una sensación de decepción al querer mas, pero hay que pensar bien en que es lo que se esta personalizando para elegir bien la cantidad de opciones que se van a entregar ¿Que opciones son las necesarias para lo que estoy intentando personalizar.
  • Ademas de la cantidad de opciones a entregar se debe pensar en como se van a organizar estas, el criterio de organización puede variar entre su complejidad o prioridad que tengan para el servicio.
  • ¿Como se muestran estas opciones? Muchas opciones que están bien organizadas y espaciadas entre si pueden ser mas efectivas que unas pocas pero apretadas ya que impiden su comprensión.
  • La interacción con las opciones debe variar según el tipo preferencia que se pide, un switch para un si/no puede marcar la diferencia entre poner las dos opciones como checkmarks, depende de tipo de pregunta responde esto.
  • Otro factor es la inmediatez en la que se ven los cambios, la posibilidad de ver reflejadas las elecciones instantáneamente para poder decidir si eso es realmente lo que quiero y poder probar otras opciones.
  • Algunos servicios pueden necesitar el cambio constante de configuración, en ese caso lo necesario seria la opción de guardar es configuraciones al igual que ofrecer algunas predeterminadas por el sistema.
  • Como se dirige al usuario al momento de darle opciones puede ser de valor agregado dependiendo del servicio.
  • Las opciones deben ser accesibles fácilmente, estas no deben estar ocultas entre otras características del sistema ni tampoco solo estar disponible para algunos (a menos que sea un modelo de negocio)

Casos positivos

Facebook

  • Descripción del servicio: Red social
  • Soporte del Servicio: Sitio web
  • Descripción de experiencia de usuario con el servicio: Experiencia positiva La personalización visual de la pagina principal de Facebook es muy sencilla, con un menú desplegable rápidamente se llega a un menú de pocas opciones, la normal con blanco y tonos claros y otra oscura para lo que normalmente es el modo nocturno, ademas tiene la opción de cambiar la densidad del menú a la izquierda que cambia el tamaño de los iconos, al seleccionar las opciones se pueden apreciar los cambios instantáneamente, esto es muy importante para poder comparar y elegir fácilmente, este mismo menú desplegable da la opción de volver a la versión antigua del sitio web. El menú izquierdo también da la opción de elegir que grupos son los que apareran como acceso directo con tan solo dos clicks. Lo mas positivo de estas definiciones de preferencias es que se pueden ver los cambios instantáneamente y llegar a la configuración de estas preferencias es muy rápida también.
TDI2020OANAFacebook (1).png TDI2020OANAFacebook (2).png TDI2020OANAFacebook (3).png TDI2020OANAFacebook (4).png TDI2020OANAFacebook (5).png TDI2020OANAFacebook (6).png TDI2020OANAFacebook (7).png TDI2020OANAFacebook (8).png TDI2020OANAFacebook (9).png TDI2020OANAFacebook (10).png

Outlook

  • Descripción del servicio: Mesajeria
  • Soporte del Servicio: Sitio web
  • Descripción de experiencia de usuario con el servicio: Experiencia positiva Outlook cuenta con un panel de personalización "básica" que aparece como un menú a la derecha, este menú contiene personalización visual principalmente no es muy extenso y da la posibilidad de pasar a configuraciones mas especificas, en este segundo panel se entregan opciones mucho mas detalladas centrándose mas en en el manejo del correo recibido y a la redacción de estos mismos. La forma en la que están divididas estas dos formas de personalización es muy efectiva ya que no te llena de opciones desde el comienzo, primero da opciones dirigidas a gente que usa el servicio de manera mas básica y también da la posibilidad para gente mas interesada en opciones mas especificas puedan hacerlo efectivamente con menús bien organizados en sub categorias.
TDI2020OANAOutlook (1).png TDI2020OANAOutlook (2).png TDI2020OANAOutlook (3).png TDI2020OANAOutlook (4).png TDI2020OANAOutlook (5).png TDI2020OANAOutlook (6).png TDI2020OANAOutlook (7).png TDI2020OANAOutlook (8).png TDI2020OANAOutlook (9).png TDI2020OANAOutlook (10).png

Photoshop

  • Descripción del servicio: Editor de imágenes
  • Soporte del Servicio: Programa de escritorio
  • Descripción de experiencia de usuario con el servicio: Experiencia muy positiva Puede que muchos se confundan con la gran cantidad de herramientas que ofrece Photoshop pero una vez que el usuario ya esta familiarizado con ellas la personalización del espacio de trabajo es fundamental para trabajar rápidamente. Esta personalización es muy bien lograda por el programa ya que primero que nada trae espacios de trabajos básicos predefinidos lo suficientemente variados para un ajuste rápido, pero también da la opción de crear espacios de trabajo totalmente distintos según los gustos personales y necesidades, se pueden agregar nuevas ventanas de herramientas al igual que definir sus tamaños y prioridad dentro de la interfaz, estos no se limitan a los costados de la pagina, se pueden colocar donde uno quiera, estas configuraciones personales también pueden quedar guardadas para volver a ellas si se planea usar otra. La personalización de Photoshop es muy flexible se ajusta a las necesidades y no agobia con muchas opciones a la vez ni deja deseando mas.
TDI2020OANAPhotoshop (1).png TDI2020OANAPhotoshop (2).png TDI2020OANAPhotoshop (3).png TDI2020OANAPhotoshop (4).png TDI2020OANAPhotoshop (5).png TDI2020OANAPhotoshop (6).png TDI2020OANAPhotoshop (7).png TDI2020OANAPhotoshop (8).png  TDI2020OANAPhotoshop (12).png TDI2020OANAPhotoshop (9).png TDI2020OANAPhotoshop (10).png TDI2020OANAPhotoshop (11).png

Pinterest

  • Descripción del servicio: Permite crear y administrar colecciones de imágenes
  • Soporte del Servicio: Sitio web
  • Descripción de experiencia de usuario con el servicio: Experiencia positiva Al crear una cuenta la plataforma pregunta por preferencias de inmediato para generar contenido de interés para el usuario, lo primero que se ve es una gran colección de imágenes relacionadas con los temas escogidos y si vas a la sección de seguidos se puede buscar cuentas especificas eligiendo los temas de interés. La forma en la que se dan estas opciones es muy acertada, da una pequeña profesionalizan detrás del texto y al ir seleccionando se ve como va cambiando el feed detras, las elecciones son tomadas en ventanas por encima del feed rápidamente y la forma en la que se descubren nuevas cuentas esta muy bien organizada por temas, lo tamaños y previas son los necesarios para obtener una idea rápida del contenido.
TDI2020OANAPinterest (1).png TDI2020OANAPinterest (2).png TDI2020OANAPinterest (3).png TDI2020OANAPinterest (4).png TDI2020OANAPinterest (5).png TDI2020OANAPinterest (6).png TDI2020OANAPinterest (7).png

Discord

  • Descripción del servicio: Plataforma para comunicación enfocada en juegos sociales
  • Soporte del Servicio: Programa de escritorio
  • Descripción de experiencia de usuario con el servicio: Experiencia positiva Las preferencias están divididas en tres grupos principales, un aspecto notable de Discord es que en sus opciones se refieren informalmente al usuario incluso con sentido de humor, tienen bien definido el tipo de usuario que utiliza este servicio y por lo tanto tiene configuraciones bien detalladas pero bien organizadas, cuando es necesario mostrar una previsualización de las preferencias se hace acordemente.
TDI2020OANADiscord (1).png TDI2020OANADiscord (2).png TDI2020OANADiscord (3).png TDI2020OANADiscord (4).png TDI2020OANADiscord (6).png TDI2020OANADiscord (7).png TDI2020OANADiscord (8).png TDI2020OANADiscord (9).png TDI2020OANADiscord (10).png

Casos negativos

Chrome

  • Descripción del servicio: Navegador web
  • Soporte del Servicio: Programa de escritorio
  • Descripción de experiencia de usuario con el servicio: Experiencia negativa Al subir el volumen estando en chrome con un vídeo o algo que produzca sonido en alguna ventana aparecerá al lado del volumen un panel de control demasiado grande por lo que prefiero quitarlo, intentar interactuar con este panel para buscar una solucion es inutil y al ir a configuraciones del navegador no se encuentra nada de ayuda por lo que debo ir a buscar a Google, luego de un momento navegando encuentro una pagina útil que me dirige a links de configuración de preferencias, los cuales por fin me dan una solución para que este panel no aparezca. El proceso toma demasiado tiempo y el servicio (Chrome) no facilita la definición de preferencia en este caso. La solución estaría en que cuando aparece este panel te de la opción de interactuar con el para definir si es que lo quieres ver o no.
TDI2020OANAChrome (1).png TDI2020OANAChrome (2).png TDI2020OANAChrome (3).png TDI2020OANAChrome (4).png  TDI2020OANAChrome (5).png TDI2020OANAChrome (6).png TDI2020OANAChrome (7).png TDI2020OANAChrome (8).png TDI2020OANAChrome (9).png  TDI2020OANAChrome.png

Instagram

  • Descripción del servicio: Red social
  • Soporte del Servicio: Aplicación celular
  • Descripción de experiencia de usuario con el servicio: Experiencia negativa Pensé que el cambio a modo oscuro en Instagram seria algo sencillo como lo ha sido en facebook, pero en realidad no es así. Al buscar en las opciones no se llega a nada, la realidad es que para poder hacerlo se necesita versiones mas recientes de Android o iOS en las cuales la opción de modo oscuro viene en en el sistema operativo el cual lo detecta la aplicación, hay otras maneras de tener esta preferencia pero no son formas oficiales del servicio. Esto se podría considerar una mala experiencia en la definicion de preferencias para entregar un servicio personalizado al ver que unas personas pueden usarlo y otras no.
TDI2020OANAInstagram (1).jpg TDI2020OANAInstagram (2).jpg TDI2020OANAInstagram (3).jpg TDI2020OANAInstagram (4).jpg TDI2020OANAInstagram (5).jpg TDI2020OANAInstagram (6).jpg TDI2020OANAInstagram (7).jpg

Gmail

  • Descripción del servicio: Mensajería
  • Soporte del Servicio: Sitio web
  • Descripción de experiencia de usuario con el servicio: Ligeramente negativa El principal problema con la definición de preferencias de gmail es que las opciones están en ventanas distintas, esto provoca una experiencia tediosa de terminar una configuración, salir de esta, abrir el menú de nuevo e ir otra configuración, proceso que se repite en todas estas.
TDI2020OANAGmail (1).png TDI2020OANAGmail (2).png TDI2020OANAGmail (3).png TDI2020OANAGmail (4).png TDI2020OANAGmail (5).png TDI2020OANAGmail (8).png TDI2020OANAGmail (9).png TDI2020OANAGmail (10).png TDI2020OANAGmail (11).png

Twitter

  • Descripción del servicio: Red social
  • Soporte del Servicio: Sitio web
  • Descripción de experiencia de usuario con el servicio: Ligeramente negativa La definición de preferencias en Twitter es eficiente, su problema esta en la densidad de información en la pantalla, el interfaz se divide en tres partes, la negación normal del sitio categorías de configuraciones y las configuraciones mismas creando muchas opciones a la vez.
TDI2020OANATwitter (1).png TDI2020OANATwitter (2).png TDI2020OANATwitter (3).png TDI2020OANATwitter (4).png TDI2020OANATwitter (5).png TDI2020OANATwitter (6).png

WhatsApp Web

  • Descripción del servicio: Mensajeria
  • Soporte del Servicio: Sitio web
  • Descripción de experiencia de usuario con el servicio: Ligeramente negativa La interfaz de configuración se limita demasiado a la sección de conversaciones lo que provoca el salir y entrar repetidamente para acceder a otras opciones, ademas al ser la versión de escritorio de una aplicaron las opciones son muy limitadas.
TDI2020OANAWhatsAppWeb (1).png TDI2020OANAWhatsAppWeb (2).png TDI2020OANAWhatsAppWeb (3).png TDI2020OANAWhatsAppWeb (4).png TDI2020OANAWhatsAppWeb (5).png TDI2020OANAWhatsAppWeb (6).jpg