My UOCfolio
Prototipado – Aula 1
Pública Comparto mi prototipo de aplicación diseñado para los inspectores de calidad de Burger King.
En este proyecto, he trabajado en un prototipado de alta fidelidad y llevado a cabo pruebas de guerrilla con usuarios para evaluar su funcionalidad. Gracias al feedback obtenido, realicé iteraciones en el diseño para optimizar la experiencia del usuario.
Os dejo un breve vídeo explicando cómo funciona la aplicación. ¡Cualquier comentario o sugerencia será muy bien recibido!
Pública Evaluación Heurística de una Cámara de foto desechable
Visibilidad del estado del sistema
Aspectos positivos:
La rueda de avance de la película da feedback físico y sonoro, indicando al usuario que la película está lista para la siguiente toma.
Aspectos negativos:
No siempre es claro cuántas fotos quedan, especialmente si el contador es pequeño o poco visible.
Concordancia entre el sistema y el mundo real
Aspectos positivos:
Utiliza un diseño simple y familiar (botón para disparar, lente visible).
Aspectos negativos:
El ícono del flash a veces no es intuitivo para quienes no están familiarizados con cámaras tradicionales.
Control y libertad del usuario
Aspectos positivos:
Es difícil cometer errores críticos debido a la simplicidad del diseño.
Aspectos negativos:
No permite corregir errores, como fotos mal tomadas, ya que no hay vista previa ni opción de borrar imágenes.
Consistencia y estándares
Aspectos positivos:
Cumple con los estándares tradicionales de cámaras de película: botón de disparo, visor óptico, y flash.
Aspectos negativos:
Algunas marcas tienen ubicaciones poco intuitivas para el flash o el botón de avance.
Prevención de errores
Aspectos positivos:
La cámara está diseñada para evitar usos incorrectos, como disparar sin avanzar la película.
Aspectos negativos:
No previene que el usuario olvide activar el flash en condiciones de poca luz.
Reconocimiento mejor que recuerdo
Aspectos positivos:
Los controles principales (botón de disparo y flash) suelen ser claramente visibles y accesibles.
Aspectos negativos:
Algunos usuarios pueden olvidar el significado de los íconos, especialmente si son poco claros.
Flexibilidad y eficiencia de uso
Aspectos positivos:
Funciona bien para principiantes debido a su simplicidad.
Aspectos negativos:
Usuarios avanzados podrían encontrarla limitante por la falta de control manual sobre la exposición y el enfoque.
Flexibilidad y eficiencia de uso
Aspectos positivos:
Funciona bien para principiantes debido a su simplicidad.
Aspectos negativos:
Usuarios avanzados podrían encontrarla limitante por la falta de control manual sobre la exposición y el enfoque.
Estética y diseño minimalista
Aspectos positivos:
Su diseño es sencillo y no distrae con elementos innecesarios.
Aspectos negativos:
Algunas cámaras tienen etiquetas o indicaciones que abarrotan el espacio visual.
Ayuda para reconocer, diagnosticar y corregir errores
Aspectos positivos:
El diseño limita errores graves.
Aspectos negativos:
Si el usuario olvida avanzar la película o activar el flash, no recibe ningún aviso hasta que revisa las fotos (después del revelado).
Ayuda y documentación
Aspectos positivos:
Las instrucciones impresas suelen ser claras y están disponibles en el empaque.
Aspectos negativos:
No hay soporte adicional mientras se usa el producto.
PRINCIPALES PROBLEMAS
•El indicador del estado del flash es poco visible o accesible, lo que genera:
•Fotos mal iluminadas en condiciones de poca luz.
•Frustración del usuario al no obtener los resultados esperados.
•Falta de feedback que informe si el flash está listo.
PROPUESTAS DE MEJORAS
• Un indicador LED junto al botón de disparo que muestre el estado del flash
– Luz verde: Flash listo.
– Luz roja: Flash cargando.
• Iconos más grandes y claros sobre el interruptor del flash
• Colocación del indicador en un lugar visible mientras se sostiene la cámara además de aumentar el tamaño de casi todo los elementos tangibles.
• Mayor lente para conseguir una mayor calidad
• Luz pre-disparo para conseguir mayor luminosidad
¿QUE PASA SI MEJORAMOS?
•Reducción de errores en fotos mal iluminadas.
•Mejora en la experiencia de usuarios principiantes y avanzados.
•Aumento de la confianza y satisfacción del usuario.
Topografía en las interfaces
Ejemplo: Microondas y su panel de control
Problema identificado: Muchos microondas modernos tienen un diseño de panel confuso, donde los botones son pequeños, están abarrotados, y los íconos o etiquetas no son intuitivos. Esto puede dificultar tareas simples como seleccionar una función o ajustar el tiempo de cocción.
Impacto:
Usuarios mayores o principiantes pueden tener dificultades para entender las funciones.
El sistema no ofrece retroalimentación clara (como luces o sonidos).
Puede generar errores al usar botones incorrectos.
Propuesta de mejora con enfoque en la topografía
Distribución clara de funciones:
-Agrupar botones relacionados en secciones diferenciadas, como «Cocción rápida», «Ajustes de tiempo», y «Opciones avanzadas».
Uso de íconos y etiquetas claras:
-Emparejar íconos comprensibles (como un reloj para tiempo, una llama para potencia) con texto explicativo.
Retroalimentación visual y sonora:
-Agregar luces LED alrededor de los botones seleccionados y sonidos específicos para confirmar interacciones.
Botones grandes y bien espaciados:
-Evitar botones pequeños y agrupados para mejorar la accesibilidad.
Prototipo explicativo
Webflow
Pública
Este segundo reto se divide en dos partes, la creación del UI Kit de la aplicación móvil de Burger King y la creación del prototipo de baja fidelidad.
He diseñado los diferentes elementos del UI Kit teniendo en cuenta los estilos de texto y color identificados en la aplicación móvil. Además, los diferentes elementos cuentan con interacciones que simulan la navegación en la interfaz de Burger King.
Para la segunda parte del reto he creado un prototipo interactivo de baja fidelidad de la futura aplicación móvil donde se podrá evaluar los restaurantes añadiendo los diferentes factores que condicionan la experiencia.
En el siguiente video explico y muestro la funcionalidad del prototipo de baja fidelidad que he diseñado.
Pública En este trabajo, desarrolló una aplicación para Burger King con el objetivo de mejorar la experiencia del usuario en el proceso de pedido y navegación. A lo largo del proyecto, aplicó los principios fundamentales del diseño de interfaces, centrándome en aspectos clave como la jerarquía visual y la consistencia. La aplicación no solo busca ofrecer un diseño estéticamente atractivo, sino que también pretende facilitar una interacción intuitiva, guiando al usuario de manera eficiente a través de las diferentes secciones, como el menú, los servicios y el perfil del usuario. Mediante la implementación de elementos visuales claros y uniformes, trabajó para asegurar que la aplicación sea accesible y fácil de usar.
LINK DEL FIGMA (Para verlo bien, haz clic en el botón secundario del ratón encima de «LINK DEL FIGMA» y ábrelo en una página nueva)
VÍDEO DEL PROTOTIPO:
La verdad que las interacciones para mi es algo a mejorar. Ya que no he podido conseguirlas todas pese a haberlas intentado muchas veces.
No se si a ustedes compañeros les ha pasado lo mismo, pero ¿Con que situaciones te has enfrentado tu?.
Muchas gracias.
Este es un espacio de trabajo personal de un/a estudiante de la Universitat Oberta de Catalunya. Cualquier contenido publicado en este espacio es responsabilidad de su autor/a.
