Publicat per

5. Diseño de interacción: Videocomunicación

5. Diseño de interacción: Videocomunicación
Publicat per

5. Diseño de interacción: Videocomunicación

1. Storyboard de las secuencias de interacción de la app Continuando con el análisis realizado en la PAC3 con el Value Proposition…
1. Storyboard de las secuencias de interacción de la app Continuando con el análisis realizado en la PAC3 con…

1. Storyboard de las secuencias de interacción de la app

Continuando con el análisis realizado en la PAC3 con el Value Proposition Canvas, se escoge una de las oportunidades o funcionalidades propuestas (Gain creator), para llevar a cabo el storyboard de nuestra nueva aplicación de videocomunicación. En este caso nos hemos decantado por la funcionalidad del filtro de maquillaje para mejorar el aspecto facial de los participantes.

2. Bocetado o sketching básico de la app de videocomunicación

En segundo lugar y siguiendo el resto de necesidades y problemas detectadas en el Value Proposition Canvas, procedemos a prototipar a muy bajo nivel (sketching) lo que sería nuestra propuesta de app de videocomunicación. La he contemplado como multidispositivo, por lo que estaría disponible tanto para móvil, tablet, como para escritorio. En este caso, se ha optado por bocetar el móvil, siguiendo la filosofía mobile first (diseñar antes el dispositivo más pequeños con las funcionalidades más prioritarias)

[Descarga la entrega completa en pdf]

 


Bibliografía

Armengol, D., Casacuberta, D., Chacón, J., Garreta, M., Gondomar, R., Mora, A., Mora, J., Membrives, J., Monjo, T., Mor, E., Nieto, J., Zambrano, J. Design Toolkit. UOC. http://design-toolkit.uoc.edu/es/

Gondomar Miñana, R. (2021). Cuaderno de Diseño de interacción. UOC. http://quadern-disseny-interaccio.recursos.uoc.edu/es/

Golden Krishna (2017) UX London 2017 on Vimeo https://vimeo.com/226003326

Jakobsone, L. (2017) Critical design as approach to next thinking  https://www.tandfonline.com/doi/citedby/10.1080/14606925.2017.1352923?scroll=top&needAccess=true

Marquardt, N. (2013) Proxemic Interactions Tutoria http://www.nicolaimarquardt.com/proxemics-its.html

Moderna de pueblo (2022) Dismofia por selfie https://www.instagram.com/p/CeilXtetxx2/

Recursos iconográficos https://www.flaticon.es/  https://akveo.github.io/eva-icons

Debat0el 5. Diseño de interacción: Videocomunicación

No hi ha comentaris.

Publicat per

4. Diseño especulativo: Paradigmas de interacción

4. Diseño especulativo: Paradigmas de interacción
Publicat per

4. Diseño especulativo: Paradigmas de interacción

Diseño especulativo En esta actividad, se nos requiere elegir un objeto físico cotidiano que usemos generalmente, analizar sus affondances, contextos de uso…
Diseño especulativo En esta actividad, se nos requiere elegir un objeto físico cotidiano que usemos generalmente, analizar sus affondances,…

Diseño especulativo

En esta actividad, se nos requiere elegir un objeto físico cotidiano que usemos generalmente, analizar sus affondances, contextos de uso y aplicarle tecnología para facilitar la manera de interactuar con él. En este caso, el objeto elegido es una cucharilla de café, el cual tras analizarlo, valoraremos los tipos de interacciones digitales que los usuarios pueden tener con él, para mejorar sus prestaciones como objeto, además de su dependencia y relación con los escenarios de interacción en los que se usa.

Affordances:

Revisando la morfología del objeto, podemos intuir algunos affordances perceptibles: es algo para ser agarrado, tiene cierta curvatura o forma ergonómica para adaptarse a alguna parte del cuerpo. Además su acabado romo insinúa cierta seguridad y comodidad en su utilización. Por su material, normalmente de acero inoxidable, podemos barruntar que es un instrumento fácilmente esterilizable y duradero, capaz de soportar altas y bajas temperaturas además de grandes impactos. Su uso puede estar asociado a acciones como rascar, cavar, hacer palanca… Pero en este caso en sí, su principal utilidad: utensilio para poder comer, es un affordance oculto, ya que si se lo ofreciéramos a un indígena de una tribu que nunca ha visto nada igual, probablemente su primera acción con este instrumento no sería utilizarlo para comer. Dependiendo de la percepción del usuario y de la imaginación que este tenga para usar la cuchara, podemos hablar de un affordance falso, inexistente, o de un rechazo correcto.

Aprovecharemos este enigma o carencia de affordance para descontextualizar, especular e inventar una nueva interacción, añadiéndole parte de tecnología y carácter social al utensilio.

Escenarios o contextos de uso:

Normalmente este objeto es utilizado en una gran diversidad de espacios donde es común comer, desde cualquier hogar, comedores, restaurantes, bares, colegios, guarderías, hospitales, residencias de ancianos, incluso en servicios de caterings de algunos transportes públicos como trenes y aviones (principalmente en occidente, ya que en otras culturas es común el uso de palillos y manos entre otros). Es un objeto comúnmente utilizado para una de las primeras necesidades del ser humano, alimentarse. Pero en algunos contextos como en el de bebés lactantes, este utensilio es raro y se suelen utilizar tetinas con un affordance similar al pezón materno. Esto nos lleva a pensar qué pasaría si descontextualizamos el uso de la cuchara en el ámbito infantil, y se nos ocurre que podría ser un widget que se introdujera en el pañal del bebés y éste nos avisara de las principales preocupaciones de los padres, como es la temperatura del bebé, el número de micciones que ha realizado, las horas que ha dormido o si hay que cambiarle el pañal, entre otras cosas.


 

Monitor de control y seguimiento del bebé

Con solo instalar nappyfy en el pañal del bebé, descargar su aplicación móvil y sincronizar el dispositivo, los padres podrán estar tranquilos, y recibir de forma instantánea un reporte con lo que está pasando con su bebé: temperatura, humedad, movimiento…

Características del producto:
  • Compatible y adaptable a cualquier tipo y talla de pañal, independiente del peso y estatura.
  • Inalámbrico. Su batería tiene autonomía para una semana y su cargador funciona con cualquier cable usb-c.
  • Reutilizable y respetuoso con el medio ambiente. Se limpia facilmente con agua caliente (como una copa menstrual).
  • Función termómetro: Recoge información acerca de la temperatura del bebé avisando de picos de febrícula y fiebre.
  • Indicador de humedad. Avisa en % cuando el pañal deber ser sustituido por otro.
  • Control del número de micciones. Detecta el número de pipís realizadas por el bebé.
  • Modo noche. Se ilumina y funciona de linterna tenue para facilitar el cambio de pañal en plena oscuridad.
  • Detector de calidad y duración del sueño.
  • Aviso de llanto nocturno.
  • Detector de cólicos y/o gases.
  • Detención de movimientos.
  • Contador de pasos y metros gateados y andados.
  • Avisos de variación en el color de deposiciones.
Bibliografía

Armengol, D., Casacuberta, D., Chacón, J., Garreta, M., Gondomar, R., Mora, A., Mora, J., Membrives, J., Monjo, T., Mor, E., Nieto, J., Zambrano, J. Diseño especulativo. Design Toolkit. UOC. http://design-toolkit.uoc.edu/es/diseno-especulativo/

Caballero, A.J., Mercado, O. (2018) Affordance y Diseño. Universidad Autónoma Metropolitana. Ciudad de México. https://www.casadelibrosabiertos.uam.mx/contenido/contenido/Libroelectronico/Affordance-diseno.pdf

Debat0el 4. Diseño especulativo: Paradigmas de interacción

No hi ha comentaris.

Publicat per

3. Diseño Centrado en el Usuario: Interacción y videocomunicación

3. Diseño Centrado en el Usuario: Interacción y videocomunicación
Publicat per

3. Diseño Centrado en el Usuario: Interacción y videocomunicación

Value Proposition Canvas Para finalizar esta actividad, se nos requería recopilar en un Value Proposition Canvas (VPC) toda la información obtenida en…
Value Proposition Canvas Para finalizar esta actividad, se nos requería recopilar en un Value Proposition Canvas (VPC) toda la…

Value Proposition Canvas

Para finalizar esta actividad, se nos requería recopilar en un Value Proposition Canvas (VPC) toda la información obtenida en la investigación previa sobre videollamadas laborales por Teams. Para dicha investigación se utilizaron encuestas y benchmarking.

De las encuestas y pequeñas entrevistas con los compañeros de trabajo se consiguió obtener las satisfacciones, penas y tareas diarias de los usuarios de Teams, mientras que del benchmarking, se comparó la herramienta Teams con otras de uso similar, y se pudieron sacar funcionalidades que podrían mejorar el día a día de la videocomunicación.

Propuestas de mejoras

  1. Filtro facial de maquillaje o corrección: Para esos días en los que tienes reuniones con cliente, has descansado mal y no te ha dado tampoco tiempo a maquillarte. Sería un punto extra a los efectos de cámara como ya lo es en Instagram.
  2. Permitir ver mensajes y archivos una sola vez: Esta funcionalidad ya la integran whatsapp y el chat de instagram. Es una forma de no almacenar imágenes y/o vídeos que no quieres que se vuelvan a compartir. Es un punto extra a la privacidad.
  3. Configuración del estado disponible aunque la pantalla del pc esté bloqueada: Hay tareas que son físicas como lectura de un pliego, esquematizar, preparar sketching o el propio prototipo en papel. Esto hace que no estes interactuando con la computadora, lo que hace que se bloquee o detecte que no estas conectado. Sería un punto a favor poder mantener ese estado disponible en dicho contexto.
  4. Detención de rasgos faciales para control de emociones y atención prestada del participante: Aunque no estuviera la cámara activa para que el resto de la reunión pudiera verle la cara, estaría bien que ésta trabajara en segundo plano detectando las emociones y expresiones de la cara. De esta forma se sabría si estas delante de la videollamada, si está pero se encuentra aburrido, o incluso si se está haciendo otras tareas mediante el eyetracking.
  5. Avisos y bloqueo de aplicación para obligar a los participantes a descansar: Esto podría incorporarse a nivel de sistema operativo como ya lo hace iOS con el tiempo de uso de las aplicaciones.
  6. Establecer turnos ordenados de intervención en videollamada:  A día de hoy la mayoría de apps permiten levantar la mano pero si varios la levantan, no hay un orden establecido. Se podría incluir de cara a disponer de un turno de palabras.
  7. Compartir varias pantallas de varios usuarios a la vez: A veces cuando un equipo trabaja en un mismo proyecto, puede ser necesario estar visualizando varios archivos o diferentes partes de uno mismo, por lo que sería útil poder estar compartiendo pantalla varios compañeros, además de poder controlar y minimizar las diferentes perspectivas de la videollamada: pantalla/retrato.
  8. Subtitular y traducir de forma automática a los participantes de la videollamada: En el contexto compartido con los compañeros, hemos detectado que la mitad de los proyectos activos actualmente son internacionales, donde por ejemplo el equipo de desarrollo está en la India, el de diseño en Chile y el cliente en Bélgica. Y aunque el idioma oficial sea el inglés, muchas veces los acentos, cultura y la propia terminología utilizada hace que sea difícil una comunicación eficaz. Es por ello, que sería interesante tener un widget en la propia herramienta que subtitulara y tradujera a la vez que el participante va hablando en la videollamada.
  9. Interfaz controlada por voz + envío de archivos de audio por chat: Ya son varias apps las que permiten el envío de audios. De hecho la propia app móvil en Teams lo contempla, pero en escritorio aún no. No sólo esto es un punto a favor, también podrían sincronizar con algún asistente de voz o crear el suyo propio para manejar la interfaz mediante comandos de voz. Sobre todo sería útil de cara la app móvil, ya que muchas reuniones diarias de seguimiento acaban cogiendo a los usuarios en el coche y podría ser interesante en este contexto poder pedirle a dicha asistente crear eventos, recordatorios o enviar a la videollamada actual el último documento en el que se ha estado trabajando.
  10. Transcripción de sesiones grabadas para la creación de actas de reunión: Esta funcionalidad iría de la mano del widget de subtítulos y traducción. Una vez se tuviera dicho texto, éste se podría ir guardando de forma automática en un documento word que sirviera como base para la creación de actas de reunión. Agilizaría mucho el proceso.

Bibliografía

Gondomar,R. (2021) Cuaderno de Diseño de interacción. Tema 3.3. El diseño de interacción: disciplinas, modelos, principios y prácticas. UOC. http://quadern-disseny-interaccio.recursos.uoc.edu/es/3-3-conceptos-o-factores-del-diseno-de-interaccion/

Gondomar,R., Mor, E. (2021) Cuaderno de Diseño centrado en las personas. Tema 5. Procesos y métodos de diseño. UOC. http://quadern-dcp.recursos.uoc.edu/es/5-processos-i-metodes-de-disseny/

Armengol, D., Casacuberta, D., Chacón, J., Garreta, M., Gondomar, R., Mora, A., Mora, J., Membrives, J., Monjo, T., Mor, E., Nieto, J., Zambrano, J. Factores humanos psicológicos y sesgos cognitivos. Design Toolkit. UOC.http://design-toolkit.recursos.uoc.edu/es/factores-humanos-psicologicos-y-sesgos-cognitivos/

Hassan,Y. (2021) Elementos de la IPO: diseño, personas y tecnología. Capítulo 2. El factor humano. FUOC, Fundació per a la Universitat Oberta de Catalunya. https://materials.campus.uoc.edu/daisy/Materials/PID_00176067/pdf/PID_00176057.pdf

Armengol, D., Casacuberta, D., Chacón, J., Garreta, M., Gondomar, R., Mora, A., Mora, J., Membrives, J., Monjo, T., Mor, E., Nieto, J., Zambrano, J. Guía de Cuestionarios. Design Toolkit. UOC. http://design-toolkit.uoc.edu/es/guia/cuestionarios/ 

Travis, D. (2020) Taller de investigación de usuarios. http://uxtraining.net/emails/lesson-04.html

Travis, D. (2020) User Research Workshop. http://uxtraining.net/emails/lesson-05.html 

Debat0el 3. Diseño Centrado en el Usuario: Interacción y videocomunicación

No hi ha comentaris.

Publicat per

2. Media: Medios tradicionales / Formatos digitales

2. Media: Medios tradicionales / Formatos digitales
Publicat per

2. Media: Medios tradicionales / Formatos digitales

Wireframe de una página En la tercera parte de esta actividad, se requiere ejecutar el wireframe de una página del periódico elegido.…
Wireframe de una página En la tercera parte de esta actividad, se requiere ejecutar el wireframe de una página…

Wireframe de una página

En la tercera parte de esta actividad, se requiere ejecutar el wireframe de una página del periódico elegido. En mi caso, el diario Sur, por su accesibilidad y cercanía, y por cumplir con los requisitos de presentarse en diferentes medios como es en físico y en digital, a través de portal web y aplicación móvil.

Tras analizar y realizar la tabla comparativa con los principios de diseño de interacción en los diferentes medios que se presenta, se decide prototipar una de los layouts más visitados al fin y al cabo en cualquier diario, el detalle de una noticia. Para ello se observan diferentes entradas y se analiza la estructura que siguen todas ellas, manteniendo un patrón común que se intenta representar de forma gráfica a continuación como wireframe.


Bibliografía

Murray, Janet H.. Inventing the Medium : Principles of Interaction Design As a Cultural Practice, MIT Press, 2011. ProQuest Ebook Central, http://ebookcentral.proquest.com/lib/bibliouocsp-ebooks/detail.action?docID=3339350

Gondomar Miñana, R. (2021). Cuaderno de Diseño de interacción. UOC. http://quadern-disseny-interaccio.recursos.uoc.edu/es/

Armengol, D., Casacuberta, D., Chacón, J., Garreta, M., Gondomar, R., Mora, A., Mora, J., Membrives, J., Monjo, T., Mor, E., Nieto, J., Zambrano, J. Design Toolkit. UOC. http://design-toolkit.uoc.edu/es/

Coggan, G. (2021) 63 of the best infographics. https://www.creativebloq.com/graphic-design-tips/information-graphics-1232836

Recursos iconográficos

https://www.flaticon.es/ 

https://akveo.github.io/eva-icons

Debat0el 2. Media: Medios tradicionales / Formatos digitales

No hi ha comentaris.

Publicat per

1. Información de campo del recorrido

1. Información de campo del recorrido
Publicat per

1. Información de campo del recorrido

En esta actividad se nos propone elegir un recorrido común que hagamos de forma diaria. En mi caso, he elegido el recorrido…
En esta actividad se nos propone elegir un recorrido común que hagamos de forma diaria. En mi caso, he…

En esta actividad se nos propone elegir un recorrido común que hagamos de forma diaria. En mi caso, he elegido el recorrido más realizado durante estos meses anteriores, seguimiento y revisión de embarazo y posparto en el hospital.

El recorrido va desde la interacción humana con el personal de correos o del propio hospital que gestiona las citas hasta la interacción con los resultados obtenidos en el ecógrafo o monitores. Todo esto pasando por una serie de interacciones como coger y conducir el coche hasta el hospital, interactuar con la puerta de entrada, escanear citación en la máquina de bienvenida, estar atenta a las pantallas donde ordenan el turno de la consulta, incluso poner estar pendiente de la señalética y normativa implantada por el Covid, con la cual si no estás de acuerdo, puedes efectuar una nueva interacción con el mostrador de reclamaciones.

Carregant...
Carregant...
Carregant...
Carregant...
Carregant...
Carregant...
Carregant...
Carregant...

Para poder evidenciar un recorrido claro en el mapa de experiencia contemplando algunos puntos de debilidad, seguiremos la siguiente historia o guión que he dibujado, dividiendo la experiencia en tres bloques: Llegada, espera y atención.

Debat0el 1. Información de campo del recorrido

No hi ha comentaris.

Publicat per

¡Interaccionamos sin parar!

¡Interaccionamos sin parar!
Publicat per

¡Interaccionamos sin parar!

Resulta interesante ver qué entendemos por interfaz fácil y/o difícil de usar, y a modo de reflexión, os comparto una serie de…
Resulta interesante ver qué entendemos por interfaz fácil y/o difícil de usar, y a modo de reflexión, os comparto…

Resulta interesante ver qué entendemos por interfaz fácil y/o difícil de usar, y a modo de reflexión, os comparto una serie de vídeo-experimentos que hacen en el Hormiguero con objetos cotidianos y su uso. Seguro que algunos ya lo habréis visto, pero creo que es un magnífico ejemplo de cómo dependiendo del contexto, edad, cultura, experiencia, etc un mismo objeto puede resultar ser fácil o difícil según la persona/usuario.

https://www.youtube.com/watch?v=z8yoeWNXrsw
https://www.youtube.com/watch?v=IzuomgmAy2w
https://www.youtube.com/watch?v=wIcMsWa64k8
https://www.youtube.com/watch?v=1xicsr-vPOo

Mis objetos han sido varios. Os dejo a continuación la imagen categorizándolos entre fácil y difícil, según mi persona y experiencia.

Objetos fáciles para mí:
– La grabadora de voz que compré para las entrevistas a usuarios.
– Mi antiguo walkman, que desde bien pequeña manejaba con mucha soltura según mi madre.
– Y la secadora de casa.

Son objetos que no necesité leer ningún tipo de documentación o instrucciones para usarlos la primera vez. No sé si por haberlo visto usar anteriormente o porque realmente es intuitivo, aunque esto, como hemos dicho, es subjetivo, puede ser intuitivo para mí, pero no para otra persona.

Objetos difíciles para mí:
– Cafetera y espumador de leche de Nespresso.
– Impresora, escáner, incluso fax de Epson.
– Los conocidísimos Earbuds de Xiaomi.
– La máquina de coser de mi madre, de toda la vida.

Son objetos que necesité libro de instrucciones para saber usarlos y/o conectarlos.

En este caso, objetos modernos como los productos de Nespresso o los auriculares Xiaomi, disponen de pocos botones y no por ello son fáciles de usar la primera vez. Sobre todo los auriculares, a día de hoy prefiero coger los de cable porque cuando no están sin batería, no se sincronizan bien entre ellos o se desconectan del bluetooth del móvil. Siempre acabo teniendo una experiencia con ellos un tanto frustrante.

Con la impresora-escáner, es abrumador la cantidad de botones que tiene. Y creo que aún, no sabemos sacarle el máximo partido. Es complicado entender todas las funciones que trae. Respecto a la máquina de coser de mi madre, me doy por vencida en entenderla…Ella lleva usándola 20 años y a veces, aún tiene que consultar su libreta, no sólo para recordar cómo se hacían algunas puntadas, si no porque además tiene truco con algunas combinaciones de teclas jejeje Siempre que me la deja, es ya configurada para coser lo que necesite.

Espero seguir debatiendo sobre usabilidad con vosotros a lo largo del curso

Debat1el ¡Interaccionamos sin parar!

  1. Nuria López Ferrer says:

    Buenísimos los vídeos del Hormiguero Laura, qué curiosos y divertidos, gracias por compartirlos !

    Pues viendo las publicaciones de los compañeros, veo que tenía una idea equivocada de lo que es una interfaz, primero tenía una visión digital del concepto y el ejercicio me ha hecho pensar en las analógicas, que centraba en algún tipo de panel. Ahora viendo , por ejemplo , que puede ser un boli, una libreta, veo que yo puse como interfaz fácil una cafetera de cápsulas, que contrastando con un boli ,es mucho más difícil, de hecho tu misma lo has clasificado como difícil , por lo que la percepción es totalmente diferente.