Este challenge es parte de Prework del Bootcamp IronHack de UX/UI , el cual consiste en diseñar un Wireframe con un flujo de cinco pantallas de alguna App y prototiparlo en Invision para tener un flujo testeable.
En este caso elegí Spotify porque es una de esas aplicaciones que utilizo literalmente todos los días.
A pesar de que la utilizo todos los días y me parece muy intuitiva, investigando en Internet encontré que muchas personas hablaban de que Spotify tenía una mala UX… Por lo que empecé a reflexionar; ¿Realmente tiene una experiencia usuario buena o somos sus usuarios los que nos hemos adaptado al planteamiento de diseño de este Producto? Definitivamente es un tema que tendríamos que debatir otro día tomando unas cervezas, pero hoy no, ¡Este challenge va sobre el Wireframe!
Así que… ¿Qué es un Wireframe?
Un wireframe es la representación esquemática de la estructura de las pantallas de una App o Sitio web, podríamos resumirlo en que es el ‘Esqueleto’ de nuestro producto.
La principal ventaja es que ofrece una perspectiva basada solamente en la arquitectura del contenido y elementos de navegación, obviando el diseño y evitando elementos que puedan distraer (colores, tipografías, sombras, imágenes, etc.)
El Challenge
Aquí te dejo una comparativa de las cinco pantallas que elegí para hacer el Wireframe, elegí estas capturas pues me parece que se puede visualizar el tipico flow que utilizo dentro de esta aplicación, entrar en algún playlist que me guste o poner algún podcast y dejar que esté de fondo mientras estoy haciendo alguna otra cosa.
Prototipo en Invision
Conclusión
Tras investigar un poco más sobre el tema, entiendo que realmente un Wireframe es bastante útil a la hora de diseñar un producto, ahorramos en recursos, dinero y tiempo enfocándonos en la base de la aplicación antes de empezar a diseñar una UI espectacular.
Me gustaría destacar que los Wireframes suelen ser más simples en cuanto a elementos (por ejemplo los iconos en mi caso), pero quise aprovechar éste challenge para testear con herramientas de Sketch como Shapes para los iconos, ya que normalmente utilizo Figma para diseñar y mi objetivo es aprender a utilizar Sketch con fluidez.
