Hola a todos!

Aquí les presento mi prototipo de alta fidelidad del último reto de la asignatura. Una app para inspectores de calidad de Burger King (BK), donde se pueden ver los escenarios planteados y como de una manera intuitiva se puede hacer uso de la app.

Considero que tener un buen UI kit ayuda muchísimo, el Atomic Design me ha servido para ir ajustando algunos elementos o iconos y que se puedan ir replicando en otros componentes. Vi muy claramente que al tener un buen UI kit o Design System lo más completo posible permite componer pantallas y secciones lo más ajustadas al branding de BK. Sumado a las interacciones que se prototipan con Figma se puede ver como se usa la app de manera muy directa.

Gracias al test con usuario pude iterar el prototipo y ajustar unas cuestiones que resultaban elementales para los usuarios, pero que a la hora del diseño no estaban consideradas.

Espero que les guste y enhorabuena por todos los trabajos que estuve viendo algunos y soy muy buenos!

Aqui les dejo el link de mi prototipo de Figma y abajo un video explicativo.

CASO 1

Para realizar el análisis elegí como imagen de sistema una cafetera automática DeLongui magnifica EVO. El objetivo es poder comprobar las interacciones, encontrar esas brechas de ejecución y de evaluación, si es que existen, para luego poder presentar un esquema con propuestas de mejora.

Para ello, se utilizó inicialmente una evaluación heurística, más concretamente, el listado de heurísticas de Jakob Nielsen. Este listado, es uno de los más utilizados y la idea fue buscar resultados que permitan mejorar los problemas de usabilidad que presenta la cafetera.

Desde la usabilidad, hasta la estética, la forma que interpela al usuario, etc. son criterios que se tendrán en cuenta en el momento del análisis.

Una de las brechas que me pareció más interesante es cuando la máquina se queda sin café y se quiere rellenar los granos no se sabe bien si el espacio para poner los granos de café es el grande o el pequeño. No queda claro cual es de granos y cual de café molido, no hay ningún indicador.

Para resolver el problema con la confusión sobre dónde se debe poner el café, ya sea en el compartimento grande o en el pequeño, es necesario implementar soluciones que le den indicio visibles al usuario. Por ejemplo, se podría añadir una etiqueta en cada compartimento que especifique de manera clara su función. Ejemplo: «Solo para café molido», para el compartimento pequeño, mientras que en el compartimento grande podría decir: «Solo para café en grano». Estas etiquetas con texto claro, ayudarían a evitar confusiones, reduciendo el riesgo de errores.

Además de las etiquetas, se podría incorporar una solución física para prevenir el uso incorrecto del sistema. Por ejemplo, en el compartimento para café molido, sería útil añadir una rejilla fina más pequeñas que el tamaño de un grano de café. Este diseño garantizaría que, si un usuario intenta colocar granos enteros en el espacio para al café molido, estos no puedan pasar a través de la rejilla. Al quedar bloqueados físicamente, se evitaría que la máquina funcione de manera incorrecta, preservando su buen estado y prolongando su vida útil.

Para ver el caso completo haz click aqui

CASO 2

En el ejemplo elegido se puede ver una topografía que ayuda a mejorar la comprensión del sistema y el uso del objeto. Es un molinillo de pimienta, pero a diferencia de los molinillos convencionales, que se utilizan girando la parte superior para que gire el molinillo, en este se presiona como un botón.

Como se puede ver en la imagen, el tamaño del pimentero es de una dimensión para un agarre con la palma de la mano y queda el dedo pulgar libre como para poder presionar y lograr moler los granos de pimienta. El diseño del molinillo es, a diferencia de los tradicionales que son circulares a rosca, este es vertical que mediante el movimiento de arriba hacia abajo, se muele la pimienta.

Para ver el caso completo haz click aqui

Hola a todos,

En este reto cuenta con dos partes, en la primera se analizó la interfaz de Burger King (BK) viendo como son los elementos de estilo, los elementos de interacción e iconografía con lo que preparé un ui-kit básico. Que se puede ver en este enlace de figma: LINK

Aqui algunas capturas de los componentes:

Pero también presento este video que permite ver las interacciones de esos componentes y como se relacionan con el prototipo:

En la segunda, realizaré un pequeño prototipo de baja fidelidad para plantear una aplicación que serviría para facilitar a los controladores de calidad de BK poder cargar reportes de calidad de los productos. Este prototipo se puede ver es este enlace: LINK

También en el siguiente video se puede observar la navegación por el mismo:

Espero que les haya gustado! Saludos!

Hola compañeros aquí les presento mi prototipo de BK. A la ahora de prototipar, me centré en examinar los elementos que componen la interfaz, intentando tener el mente el Atomic Design viendo los elementos más pequeños a los más grandes. Esto me ayudó a ver los distintos principios básicos en la construcción del diseño de la interfaz gráfica y la forma en que el usuario interactua. Fué un reto ya que tuve que definir como iba a crear los componentes y encontrar la forma para visualizar las interacciones y animaciones. Creo que lo más complicado fue generar las mismas animaciones cuando el usuario interactua con la interfaz.

Aqui dejo el link de Figma para que puedan interactuar con el prototipo: LINK