Ikigai
La App de Ikigai es un prototipo de alta fidelidad de una web destinada al mindfulness a través de la nutrición y ejercicios de respiración, meditación y deporte.
Realizado en FIGMA
La intención con este proyecto consistía en demostrar de FIGMA, centrándose más en lo visual y UI.
01
PRIMEROS PASOS
Lo primero fue un estudio de las empresas que competirían en el mercado con Ikigai. En este caso es una mezcla entre webs de mindfulness y la APP Petit Bamboo.
Tras ello, se realizó un primer boceto en Illustrator, situando los elementos, primero de la página principal, y luego del resto de páginas más relevantes para el flow del usuario.
Como en este proyecto quería centrarme en lo visual y las transiciones, desarrollé las mismas en papel, simulando el flow que posteriormente recorrería el usuario.
02
Refinado de los diseños
Una vez planteada la arquitectura de la APP, y el flow, me puse a diseñar aspectos visuales tales como el logotipo y toda la iconografía.
Se decidieron los tamaños de letras y tipografías para definir el estilo de la página, así como elegir la paleta definitiva de colores.
Una vez se situaron todos los elementos estéticos se procedió al prototipado de la página, creando los componentes y sus respectivas interacciones.
Para este paso, se observaron diversas páginas como las mencionadas anteriormente, para ver qué efectos y transiciones se usaban y poder replicarlas. Le di mucha importancia a que fuera más visual y simple, ya que es una app de mindfulness y meditación, no tenía sentido recargarla de excesivos botones y textos.
03
Figura 1
Figura 2
Figura 3
Diseño
El flow del usuario en este caso no es lineal, no hay principio ni fin, ya que no hay un producto final como tal, pues cada uno de los apartados son el posible destino del usuario.
El inicio se hace en una pantalla principal estética con el logo en dorado y fondo negro, con el letrero de "the mindfulness app" que sirve como carta de presentación. Se usa esta combinación de colores ya que diferentes culturas asiáticas está vinculado a lo sagrado (figura 1).
De esta pantalla inicial, los colores se suavizan a los definitivos en tonos más celestes, dando la sensación de serenidad y relajación. Aquí comienza una página de carga simulada que tras unos segundos da paso a una página de bienvenida con un efecto visual de niebla sobre una figura meditando (figura 2). Al presionar en la pantalla, esta se interna en la mente de la figura, haciendo el símil de que el contenido de la app está en la propia mente (figura 3).
La App en sí tiene un diseño minimalista, con un apartado de perfil y configuración arriba, un buscador animado para simular la introducción de texto y un tabulador que va cambiando los contenidos de vídeos de abajo según si son Para Ti, Novedades, Populares o Guardados.
La página inicial explica los distintos apartados y sus elementos asociados, a saber fuego-ejercicio, agua-meditación, aire-respiración y tierra-nutrición.
Dentro de cada uno de los apartados, visualmente tematizados con cada uno de los elementos, encontramos lo últimos vídeos y posts relacionados con el tema.
La botonera de abajo contiene cada uno de los elementos, y en el centro el icono del árbol de la vida que te lleva a la pantalla de inicio.
Por último en la pantalla de usuario, están los datos del perfil, destacando el desvelador de contraseña.
04
Conclusiones
Impacto
La app tiene como objetivo ser usada por personas que quieran incorporar el mindfulness a su estilo de vida, y hacerlo de raiz, cambiando hábitos tales como la nutrición y el ejercicio, además de la clásica yoga y meditación de otras apps, ya que Ikigai considera que el mindfulness se consigue con un cambio en distintos puntos del estilo de vida, tanto físicos como mentales.
Lo aprendido
Se ha aprendido a realizar efectos visuales más complejos y a sintetizar en la información e iconografía.
_edited_edited.png)
_edited.png)
