DIU24

Prácticas Diseño Interfaces de Usuario 2023-24 (Tema: .... )

Grupo: DIU1_01AABB. Curso: 2023/24 Updated: 11/2/2024

Proyecto:

Decida el nombre corto de su propuesta en la práctica 2

Descripción:

Describa la idea de su producto en la práctica 2

Logotipo:

Opcionalmente si diseña un logotipo para su producto en la práctica 3 pongalo aqui

Miembros

• 👤 AA
• 👤 BB

---

Este documento es el esqueleto del report final de la práctica. Aparte de subir cada entrega a PRADO, se debe actualizar y dar formato de informe final a este documento online. Elimine este texto desde la práctica 1

Proceso de Diseño

Paso 1. UX User & Desk Research & Analisis

1.a User Reseach Plan

Describe el plan de User Research (cómo se planteas)

1.b Competitive Analysis

Describe brevemente características de las aplicaciones que tienes asignadas, y por qué has elegido una de ellas

1.c Persona

Comenta brevemente porqué has seleccionado a esas personas y sube una captura de pantalla de su ficha

1.d User Journey Map

Comenta brevemente porqué has escogido estas dos experiencias de usuario (y si consideras que son habituales)

1.e Usability Review

Revisión de usabilidad: (toma los siguientes documentos de referncia y verifica puntos de verificación de usabilidad

SE deben incluir claramente los siguientes elementos

• Enlace al documento: (sube a github el xls/pdf)
• Valoración final (numérica):
• Comentario sobre la valoración: (60-120 caracteres)

Paso 2. UX Design

2.a Reframing / IDEACION: Feedback Capture Grid / EMpathy map

Comenta con un diagrama los aspectos más destacados a modo de conclusion de la práctica anterior,

Interesante	Críticas
Preguntas	Nuevas ideas

¿Que planteas como "propuesta de valor" para un nuevo diseño de aplicación para economia colaborativa ? Problema e hipótesis Que planteas como "propuesta de valor" para un nuevo diseño de aplicación para economia colaborativa te (150-200 caracteres)

2.b ScopeCanvas

Propuesta de valor

2.b User Flow (task) analysis

Definir "User Map" y "Task Flow" ...

2.c IA: Sitemap + Labelling

Identificar términos para diálogo con usuario

Término	Significado
Login¿?	acceder a plataforma

2.d Wireframes

Plantear el diseño del layout para Web/movil (organización y simulación )

Paso 3. Mi UX-Case Study (diseño)

3.a Moodboard

Plantear Diseño visual con una guía de estilos visual (moodboard) Incluir Logotipo Si diseña un logotipo, explique la herramienta utilizada y la resolución empleada. ¿Puede usar esta imagen como cabecera de Twitter, por ejemplo, o necesita otra?

3.b Landing Page

Plantear Landing Page

3.c Guidelines

Estudio de Guidelines y Patrones IU a usar Tras documentarse, muestre las deciones tomadas sobre Patrones IU a usar para la fase siguiente de prototipado.

3.d Mockup

Layout: Mockup / prototipo HTML (que permita simular tareas con estilo de IU seleccionado)

3.e ¿My UX-Case Study?

Publicar my Case Study en Github.. Documente y resuma el diseño de su producto

Paso 5. Exportación & evaluación con Eye Tracking

Exportación a HTML/Flutter

) 5.b Eye Tracking method

Indica cómo diseñas experimento y reclutas usuarios (uso de gazerecorder.com)

Diseño del experimento

Uso de imágenes (preferentemente) -> hay que esablecer una duración de visualización y
fijar las áreas de interes (AoI) antes del diseño. Planificar qué tarea debe hacer el usuario (buscar, comprar...)

cambiar img por tu diseño de experimento

Recordar que gazerecorder es una versión de pruebas: usar sólo con 3 usuarios para generar mapa de calor (recordar que crédito > 0 para que funcione)

Resultados y valoración

Cambiar por tus resultados

Paso 4. Evaluación

4.a Caso asignado

Breve descripción del caso asignado con enlace a su repositorio Github

4.b User Testing

Seleccione 4 personas ficticias. Exprese las ideas de posibles situaciones conflictivas de esa persona en las propuestas evaluadas. Asigne dos a Caso A y 2 al caso B

Usuarios	Sexo/Edad	Ocupación	Exp.TIC	Personalidad	Plataforma	TestA/B
User1's name	H / 18	Estudiante	Media	Introvertido	Web.	A
User2's name	H / 18	Estudiante	Media	Timido	Web	A
User3's name	M / 35	Abogado	Baja	Emocional	móvil	B
User4's name	H / 18	Estudiante	Media	Racional	Web	B

4.c Cuestionario SUS

Usaremos el Cuestionario SUS para valorar la satisfacción de cada usuario con el diseño (A/B) realizado. Para ello usamos la hoja de cálculo para calcular resultados sigiendo las pautas para usar la escala SUS e interpretar los resultados http://usabilitygeek.com/how-to-use-the-system-usability-scale-sus-to-evaluate-the-usability-of-your-website/) Para más información, consultar aquí sobre la metodología SUS

Adjuntar captura de imagen con los resultados + Valoración personal

4.d Usability Report

Añadir report de usabilidad para práctica B (la de los compañeros)

Valoración personal

5.) Conclusion de EVALUACION (A/B testing + usability report + eye tracking)

recupera el usability report de tu práctica (que es el caso B de los asignados a otros grupos) con los resultados del A/B testing, de eye tracking y del usability report: comentad en 2-3 parrafos cual es la conclusion acerca de la realización de la práctica y su evaluación con esas técnicas y que habéis aprendido

Conclusión final / Valoración de las prácticas

(90-150 palabras) Opinión FINAL del proceso de desarrollo de diseño siguiendo metodología UX y valoración (positiva /negativa) de los resultados obtenidos