Diseño Intercambio de libros

Redefiniendo la experiencia de aprendizaje digital

Vision General

Objetivo

Desarrollar una plataforma web educativa que mejore la accesibilidad, organización y comprensión de los contenidos, facilitando la interacción del usuario mediante un diseño intuitivo y funcional.

Contexto

El proyecto se enmarca en la necesidad de digitalizar y optimizar los espacios educativos, ofreciendo herramientas que respondan a las nuevas formas de aprendizaje y consumo de información en entornos digitales.

Impacto

Se espera que la implementación de este diseño contribuya a una mejor experiencia de usuario, incrementando la participación, comprensión y acceso a los contenidos educativos, generando un impacto positivo en el proceso de aprendizaje.

NAVEGACIÓN DE FLUJO

Para organizar la experiencia del usuario, diseñé un mapa de flujo de navegación donde estructuré todas las pantallas y conexiones de la aplicación.

 

iPhone 14 Plus - Startlight

Componentes Utilizados

Para el desarrollo de la interfaz, diseñé y utilicé diferentes componentes que me permitieron construir una experiencia clara, interactiva y coherente dentro de la aplicación educativa. Cada uno de estos elementos está pensado para facilitar la navegación y mejorar la interacción del usuario.

Calendario

Diseñé un componente de calendario que permite al usuario visualizar fechas y organizar contenido relacionado con la lectura o actividades. Este elemento facilita la planificación y el seguimiento dentro de la aplicación.

Transiciones

Incorporé transiciones entre pantallas para hacer la navegación más fluida y natural. Estas animaciones ayudan a mejorar la experiencia del usuario, aportando continuidad entre las diferentes secciones.

Icono Me gusta

Añadí un icono de interacción que permite marcar contenido como favorito. Este componente ofrece una forma rápida de guardar o destacar elementos dentro de la plataforma.

Tab bar (barra de navegación inferior)

Diseñé una barra de navegación inferior que permite acceder rápidamente a las secciones principales de la aplicación. Este componente mejora la usabilidad y facilita el desplazamiento entre pantallas.

Selector de centro educativo

Incluí un componente que permite al usuario elegir su centro educativo. Esto ayuda a personalizar la experiencia y adaptar el contenido según el contexto del usuario.

Formulario para subir libro

Diseñé un formulario donde el usuario puede subir contenido, como libros o recursos. Este incluye campos de texto, selección de opciones y elementos para completar la información de forma clara y estructurada.

Componentes de inicio de sesión

Creé los elementos necesarios para el acceso del usuario, como campos de correo y contraseña, botones de acceso y recuperación. Este componente garantiza una entrada sencilla y segura a la plataforma.

Casillas sobre el estado del libro

Implementé casillas de selección que permiten indicar el estado del libro (por ejemplo, leído, pendiente o en progreso). Esto facilita la organización y el seguimiento del contenido.

Componente para escribir, adjuntar foto o subir audio

Diseñé un componente multifuncional que permite al usuario escribir contenido y adjuntar archivos como imágenes o audios. Este elemento fomenta la interacción y la creación de contenido dentro de la aplicación.

Investigación / Referencias​

Antes de diseñar la interfaz, realicé una fase de investigación en la que analicé dispositivos interactivos y soportes digitales utilizados en entornos educativos. Estas referencias me ayudaron a entender cómo se presenta la información en pantallas táctiles y cómo adaptar la experiencia a un formato accesible y visual.

Video intercambio de Libros

En este video, muestro paso a paso la navegación por la aplicación y el intercambio de libros con otros estudiantes. 

Figma.logoCreated using Figma

Figma

Para el desarrollo del proyecto utilicé Figma, una herramienta que me permitió diseñar la interfaz, crear componentes reutilizables y construir el prototipo interactivo Gracias a esta herramienta pude trabajar de forma ordenada, iterar sobre el diseño y visualizar cómo sería la experiencia final del usuario.

Descubre más desde Portafolío_Jesús Gordillo Pardal

Suscríbete ahora para seguir leyendo y obtener acceso al archivo completo.

Seguir leyendo