UX/UI Case Study
Eat It
Diseño de una aplicación móvil siguiendo la metodología de Diseño Centrado en el Usuario (DCU)
- User experience
- User interface
- Mobile aplication
![prototipo aplicacion](/assets/Imagen_1000.png)
Overview
Frecuentemente, las personas con alergias alimentarias se ven condicionadas a la hora de consumir alimentos fuera de sus hogares.
La aplicación diseñada les facilita el proceso de elección de platos aptos cuando visitan un restaurante u otros establecimientos similares.
Investigando sus costumbres y necesidades para realizar un diseño que se adapte lo máximo posible a ellas.
¿Cómo?
![search](/assets/magnifying-glass.png)
Investigación
![idea](/assets/lightbulb.png)
Definición
![wireframe](/assets/wireframe.png)
Diseño
![test](/assets/test.png)
Evaluación
Investigación
Entender el contexto
Búsqueda de información para conocer en profundidad la situación actual, conceptos relacionados y otras soluciones ya existentes.
-
Porcentaje de alérgicos en aumento.
-
Síntomas graves.
-
Nueva legislación europea.
-
Dificultad para consultar cartas de restaurantes.
Conocer a los usuarios
-
¿Encuentran dificultades para elegir la comida en restaurantes?
-
¿Limitan sus salidas por la dificultad de encontrar comida apta para ellos?
-
¿Han sufrido malas experiencias por confusiones o mala información por parte de establecimientos?
Definición
Descripción de un usuario arquetípico cuyas necesidades y características, descubiertas anteriormente, representan a los usuarios primarios. Así como representar posibles interacciones usuario-producto mediante los escenarios y user journeys. Finalmente se genera un árbol de contenidos que representa la estructura en la que se organiza la informacion ofrecida al usuario.
![User persona](/assets/user_persona.png)
![Arbol de contenidos](/assets/arbol_contenidos_800.png)
Diseño
Sketching
Esbozos rápidos y poco detallados que plasman las ideas y requisitos necesarios. Definen la estructura visual de la aplicación.
![sketch](/assets/sketch.jpg)
Wireframes
Representar de forma más clara y formal la idea planteada en los bocetos, definiendo la estructura y navegación entre secciones.
![wireframe 1](/assets/wf/wf1.png)
![wireframe 2](/assets/wf/wf2.png)
![wireframe 3](/assets/wf/wf3.png)
![wireframe 4](/assets/wf/wf4.png)
![wireframe 5](/assets/wf/wf5.png)
![wireframe 6](/assets/wf/wf6.png)
![wireframe 7](/assets/wf/wf7.png)
![wireframe 8](/assets/wf/wf8.png)