DISEÑO

En la fase de diseño recogí todos los datos conseguidos en las anteriores fases para crear los Wireframes del producto digital.

DISEÑO MI-FI

Al principio, realicé el diseño de la APP en LO-FI y a continuación en MI-FI, aplicando diversos cambios en el proceso.

Utilizando los Wireframes en LO-FI del flujo de usuario, mostrado en la anterior página, elaboré dos casos de uso en MI-FI para poder observar cómo el usuario realizaría las tareas principales de la APP.

CASO DE USO: WALKTROUGH Y REGISTRO

 CASO DE USO: TAREAS PRINCIPALES

DISEÑO HI-FI

Basándome en los Wireframes en MI-FI continué con la creación de los Wireframes en HI-FI.

En las siguientes imágenes se muestran las funcionalidades principales de cada sección de la APP (menú principal). Para ver todas las funcionalidades y todos los wireframes puedes visitar la anterior sección de «userflow».

WIREFRAME: WALKTROUGH

WIREFRAME: REGISTRO

WIREFRAME: HOMEPAGE

WIREFRAME: BÚSQUEDA

WIREFRAME: AFINIDAD

WIREFRAME: CHAT

WIREFRAME: PERFIL DE USUARIO

WIREFRAME: MI PERFIL

Tal y como ya hice con los Wireframes en MI-FI, decidí crear dos casos de uso en HI-FI donde, haciendo uso de una narrativa lineal, se pudieran observar todas las acciones que hace el usuario desde que accede a la APP, se registra y llega a la Homepage hasta que realiza las tareas principales de la APP descritas anteriormente en nuestro User Journey: responder preguntas, crear lista de contactos por afinidad, buscar y responder a nuevas preguntas y acceder al perfil de sus contactos y de nuevos usuarios.

CASO DE USO: WALKTROUGH Y REGISTRO

CASO DE USO: TAREAS PRINCIPALES

GUÍA DE ESTILO

Previamente a los diseños en HI-FI realicé una guía de estilo que fuí modificando a medida que el proyecto evolucionaba.

PROTOTIPO NAVEGABLE

Finalizado el proceso de diseño en HI-FI comencé a crear un prototipo navegable (puedes utilizar el prototipo en la siguiente y última página de este proyecto).

Página 5 de 6