Ésta página web está pensada para poder obtener información a partir de data de Estudios Ghibli y mostrarla a los usuarios mediante una interfaz sencilla pero bien estructurada, con colores pastel, contenido inmediato de las animaciones a visualizar y de usar.
Al inicio habíamos pensado en el diseño de una aplicación web con diferentes páginas y detalles, por lo que nuestros primeros prototipos tanto de alta como baja fidelidad están basados en esa idea.
Trás mostrar nuestra idea en una demo y recibir feedback, decidimos modificar la interfaz a una más sencilla que igualmente pudiera cumplir con los requerimentos del proyecto, y cubriera las necesidades extraídas de nuestras historias de usuario.
Conforme avanzamos ibamos encontrando detalles que se podían mejorar, por lo que fuimos modificando nuestra idea sin perder la base del nuevo prototipo.
Después de trabajar en la funcionalidad de la página tomando en cuenta lo que queríamos mostrar de a cuerdo a nuestras historias de usuario modificamos nuestro diseño. Por lo que tuvimos como resultado el diseño final de nuestro proyecto.
Nuestra aplicación web se muestra en una sola página, es responsive y sigue un desplazamiento vertical para visualizar las tarjetas de información.
La interfaz muestra el logo de Estudios Ghibli, un buscador por título, los menús de filtros y de ordenamiento en la parte superior, seguidos de un botón que borra los resultados de las busquedas y las tarjetas contenedoras de la información de cada animación.
Las opciones para poder filtrar son; por director, por año y por popularidad. Las opciones para ordenar son; Por las más populares, las menos populares, las más recientes y las menos recientes.
Nos guiamos de la investigación con seguidores de las animaciones del Studio Ghibli y en el feedback de nuestro primer prototipo para crear las historias de usuario.
Finalmente nuestra página cuenta con los elementos necesarios para que las historias de usuario se cumplan.
Se realizaron pruebas unitarias de mas del 90% que corren de manera correcta.