Publicado por

R4_PrototipoFinal

R4_PrototipoFinal
Publicado por

R4_PrototipoFinal

INTRODUCCIÓN Buenas noches, a continuación os muestro mi prototipo final de esta asignatura llamado Spotify Rooms como bien sabeis una app para…
INTRODUCCIÓN Buenas noches, a continuación os muestro mi prototipo final de esta asignatura llamado Spotify Rooms como bien sabeis…

INTRODUCCIÓN

Buenas noches, a continuación os muestro mi prototipo final de esta asignatura llamado Spotify Rooms como bien sabeis una app para reservas salas. Mi idea inicial era mantener la esencia de Spotify pero sin copiar la interfaz aunque basándome en ella, Sobre todo a nivel de componentes y colores.

Enlace Vídeo: https://www.youtube.com/watch?v=UJVF99rhxUE
Enlace Prototipo: https://www.figma.com/proto/q5sE1A8rKSuqcJOObmCW7n/R4_Prototipado?page-id=502%3A245&type=design&node-id=502-1876&viewport=111%2C349%2C0.18&t=UJvAqRIshO9wjzF2-1&scaling=scale-down&starting-point-node-id=502%3A2015&mode=design

También os dejo la reflexión y el Feedback que me parecen interesantes de cara a este final de asignatura:

Reflexión: https://www.figma.com/file/q5sE1A8rKSuqcJOObmCW7n/R4_Prototipado?type=design&node-id=578-1363&mode=design
Feedback: https://www.figma.com/file/q5sE1A8rKSuqcJOObmCW7n/R4_Prototipado?type=design&node-id=569-676&mode=design

METODOLOGÍA

Cabe destacar que para realizar este ejercicio ha sido necesario retocar algunos apartados de los wireframes e iterar sobre el prototipo final.

Después de tocar los wireframes se han duplicado en su gran mayoría y se les ha puesto color. Trabajando con los componentes y estructuras se le iba dando forma la prototipo.

Una vez se tenía una versión acorde era hora de probarlo ¿Cómo? Mediante un test. Realizando un test de guerrilla a 5 usuarios.

Después de este test se han encontrado diferentes errores en diferentes pantallas que me han hecho reflexionar a cerca de ciertas funcionalidades.

Lo más importante ha sido remoldeado y cambiado para el prototipo final mediante iteracción, necesario en estas fases y proyectos.

Por último se le ha dado un retoque de posicionamiento y navegación para llegar a la versión final

 

 

TEST GUERRILLA

Se ha dispuesto de 5 usuarios, 2 online y 3 presenciales para realizar este test. Ha sido crucial este apartado para sacar conclusiones y mejoras a cerca de la primera versión de prototipado. Tras estos test se han hecho las mejoras pertinentes. Os adjunto un par de imágenes de esta sección

FINAL PROTOTIPO Y VÍDEO

Una vez  hecho el test, se han realizado las modificaciones y se ha realizado el vídeo para comentar el prototipo con los flujos principales y funcionalidades esenciales.

Os vuelvo a dejar los links del vídeo y del archivo figma para navegar por el prototipo.


Enlace Vídeo: https://www.youtube.com/watch?v=UJVF99rhxUE
Enlace Prototipo: https://www.figma.com/proto/q5sE1A8rKSuqcJOObmCW7n/R4_Prototipado?page-id=502%3A245&type=design&node-id=502-1876&viewport=111%2C349%2C0.18&t=UJvAqRIshO9wjzF2-1&scaling=scale-down&starting-point-node-id=502%3A2015&mode=design

Muchas gracias por leer, cualquier cosa me decís.
Un saludo

Debate0en R4_PrototipoFinal

No hay comentarios.

Publicado por

R2_Prototipado y construcción sistémica del diseño

R2_Prototipado y construcción sistémica del diseño
Publicado por

R2_Prototipado y construcción sistémica del diseño

INTRODUCCIÓN En este consistía en interiorizar el Atomic Design y representar los diferentes modelos y elementos en la app de Spotify mediante…
INTRODUCCIÓN En este consistía en interiorizar el Atomic Design y representar los diferentes modelos y elementos en la app…

INTRODUCCIÓN

En este consistía en interiorizar el Atomic Design y representar los diferentes modelos y elementos en la app de Spotify mediante un UI kit seguido de su prototipo e interacción. El UI kit nos permite observar los diferentes elementos de un entorno. Como están dispuestos y que características tienen. En este caso observamos tales como la forma, tipografía, iconografía y paleta de colores.

Consiste principalmente en desglosar una interfaz por bloques. Haciendo alusión directamente al Atomic Design y siguiendo las directrices marcadas.

Os dejo con el enlace al proyecto entero de figma:

https://www.figma.com/file/MfDZWu0M7XKmFdB2czVTVc/R2_Prototipado?type=design&t=VEseMOV4H5KZi6Wv-6

A continuación muestro en enlace al UI kit:

https://www.figma.com/file/MfDZWu0M7XKmFdB2czVTVc/R2_Prototipado?type=design&node-id=201-26&mode=design

Y dejo este último enlace hacia su prototipo e interacción:

https://www.figma.com/file/MfDZWu0M7XKmFdB2czVTVc/R2_Prototipado?type=design&node-id=302-698&mode=design

Más adelante, en la parte 2 de ese Reto, hay que realizar un prototipo de baja fidelidad. Es decir, una propuesta basada en Wireframes a cerca de cómo se realizaría una aplicación para la empresa de Spotify que consistiría en reservar salas.

Me basé en este Wireframe hecho a mano como idea inicial:

Os dejo con el vídeo mostrando  explicando el porque de este prototipo:

Debate0en R2_Prototipado y construcción sistémica del diseño

No hay comentarios.

Publicado por

Prototipado-R1: Diseño de un prototipo básico

Publicado por

Prototipado-R1: Diseño de un prototipo básico

Buenas tardes, os dejo a continuación mi ejercicio correspondiente al Reto1 de la asignatura de Prototipado: Diseño de un prototipo básico. He creado este prototipo referente a Spotify con la canción de Reina de Saiko (muy de moda). He utilizado diferentes elementos como componentes, imágenes, creaciones a partir de figma y sobre todo la herramienta «Prototype» para unir los diferentes elementos de este primer reto. Me ha gustado mucho esta actividad, ya estaba familiarizado con Figma, no obstante queda mucho…
Buenas tardes, os dejo a continuación mi ejercicio correspondiente al Reto1 de la asignatura de Prototipado: Diseño de un…

Buenas tardes, os dejo a continuación mi ejercicio correspondiente al Reto1 de la asignatura de Prototipado: Diseño de un prototipo básico.
He creado este prototipo referente a Spotify con la canción de Reina de Saiko (muy de moda).
He utilizado diferentes elementos como componentes, imágenes, creaciones a partir de figma y sobre todo la herramienta «Prototype» para unir los diferentes elementos de este primer reto.
Me ha gustado mucho esta actividad, ya estaba familiarizado con Figma, no obstante queda mucho por aprender y pulir en aspectos como el propio componente o paso entre «Frames».

Os leo para cualquier duda o sugerencia,
Gracias.

Os dejo el enlace al vídeo en Youtube:

Os dejo el enlace al proyecto en Figma:
https://www.figma.com/file/lj6iWmzJ8IPx7c6Rk6SRpC/Prototipado?type=design&node-id=22%3A40&mode=design&t=fZO3UR4WwehUKHyn-1

Debate0en Prototipado-R1: Diseño de un prototipo básico

No hay comentarios.