/DIU

Prácticas Diseño Interfaces de Usuario, ETSI Informática y Telecomunicación. Universidad de Granada CC 2019-2023

MIT LicenseMIT

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 :octocat:
  • 👤 BB :octocat:

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

Método UX 1.a User Reseach Plan

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

Método UX 1.b Competitive Analysis

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

Método UX 1.c Persona

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

Método UX 1.d User Journey Map

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

Método UX 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

Método UX 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)

Método UX 2.b ScopeCanvas

Propuesta de valor

Método UX 2.b User Flow (task) analysis

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

Método UX 2.c IA: Sitemap + Labelling

Identificar términos para diálogo con usuario

Término Significado
Login¿? acceder a plataforma

Método UX 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)

Método UX 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?

Método UX 3.b Landing Page

Plantear Landing Page

Método UX 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.

Método UX 3.d Mockup

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

Método UX 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

Método UX) 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...)

experimento

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 Resultado

Paso 4. Evaluación

Método UX 4.a Caso asignado

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

Método UX 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

Método UX 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

Método UX 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