LA PICCOLA ACADEMIA
CONSULTORÍA UI, UX, DISEÑO WEB
Imagen: Diseño web Piccola Academia
1. GENERALIDADES DEL PROYECTO
Retos del proyecto:
Luego de avanzar en la organización de información del sitio web, empezó la pandemia por el Covid-19. Debido a esto la academia se tuvo que replantear su oferta para pasar a la virtualidad, esto cambia la infomación, requerimientos, mensaje y oferta.
Equipo de:
Sin equipo de trabajo
Tiempo:
Desde enero hasta agosto 2020
Problema:
En sus más de 5 años de funcionamiento, la Piccola Academia ha crecido y diversificado los servicios que ofrece. En la actualidad se apoyan en herramientas virtuales para dar clases y tienen oferta no sólo presencial sino también virtual
Enfoque:
Su objetivo principal es reorganizar la información del sitio web y actualizar el contenido, contemplando que ahora ofrecen también clases online.
2. INVESTIGACIÓN UX
USUARIO OBJETIVO
Los usuarios objetivo de la academia son familias que viven en el oriente o nororiente de Bogotá.
Con la información obtenida, se piensa en una forma de organizar la información para los usuarios.
Herramienta: ARQUETIPO - PERSONA
Manuel Piedrahita
Manuel tiene 45 años, es abogado independiente y vive con su familia al norte de la ciudad. Tiene dos hijos, Juana de 10 años y Jerónimo de 6 años.
Juana es una niña muy tranquila, pero Jerónimo tiene mucha energía. Una profesora le sugirió a Manuel que lo llevara a clases extracurriculares para que se pueda enfocar más en clase y aprenda a trabajar en equipo.
Manuel y su esposa buscan una academia de música para que los niños aprendan a tocar instrumentos.
Juliana Ramírez
Juliana vive en Miami con su esposo y su hija Valeria, de 5 años.
Desde que Valeria era pequeña, mostró su gusto por la música y el baile. Juliana ha averiguado clases de ballet pero son lejos de su casa, los horarios no se ajustan a su estilo de vida, y además son bastante costosas.
Ahora Juliana y su esposo están buscando oferta de clases online de ballet para Valeria, creen que es la mejor decisión considerando la restricción de sus horarios y su presupuesto.
INVESTIGACIÓN VISUAL
Herramienta: BENCHMARKING
Imagen: Moodboard de texturas e imágenes tomadas a partir de las palabras clave
Se recopilan palabras clave que definen la academia gracias a encuestas que se hicieron a los padres de familia.
Al hacer una búsqueda visual en las fotos de la academia, las instalaciones, las clases y las presentaciones, se reconocen elementos visuales clave que pueden ser parte del sitio web:
Círculos y la forma del logo
Pentagrama y notas musicales
Formas curvas que sugieran movimiento
ORGANIZACIÓN Y DISEÑO DE INFORMACIÓN
Con las herramientas anteriores, se reunen conclusiones que son relevantes para el diseño y arquitectura de información. A continuación están las secciones y guía de estilos UI:
Es importante resaltar las modalidades de clases presencial y virtual
Las secciones son: Cursos, beneficios, testimonios, nosotros y contacto.
WIREFRAME
Herramienta: WIREFRAME
Imagen: Wireframe del sitio web organizada por secciones. Pantallas grandes.
Se estructura la información del sitio web en diferentes secciones para pantallas grandes y móviles.
PROTOTIPO
Herramienta: PROTOTIPO ALTA FIDELIDAD
Imagen: Prototipo de alta fidelidad con los detalles de las decisiones de diseño.
El prototipo de alta fidelidad tiene formas dinámicas y colores vibrantes que evocan la experiencia de las clases presenciales y virtuales de la Piccola.
Con la información obtenida con las herramientas usadas, se hace el diseño visual. Los elementos a destacar son:
Uso de los colores y tipografía de La Piccola
El uso de líneas repetidas evoca el pentagrama en el header y footer. La nota musicar en el footer tiene las mismas curvas que la P del logo
Los elementos dinámicos del fondo son círculos y las curvas del logo de la Piccola.
4. LO QUE APRENDÍ CON ESTE PROYECTO
En este proyecto, disfruté los workshops con los stakeholders porque los clientes y los usuarios han construido un fuerte sentido de pertenencia con la academia. Por esta razón, están dispuestos a colaborar para que la academia mejore y crezca.
La segunda fase del proyecto es una aplicación que está aún en desarrollo.