Nuestro aporte para lograr una experiencia educativa distinta en el sector.
Focus Mind fue convocado para rediseñar completamente la experiencia educativa de tusclasesdeguitarra.com, una de las plataformas para aprender guitarra online más grande de habla hispana.
Scope de trabajo
Cómo organizamos el flujo del proyecto y aplicamos The Mind®
Re-diseño de identidad visual.
Re-definición de imagen de marca.
Creación de mascota corporativa.
Selección de funcionalidades principales.
Flujo de Usuario.
Ilustraciones + Gamificación
Prototipado - Iteraciones.
Digital Branding + Gamificación
Prototipado
Desarrollo y Q&A
16 sprints
Product Manager
Project Manager
Diseñador UX/UI
Front-End Developer
Back-End Developer
UX Copywriter.
El diseño como vehículo para desarrollar negocios.
Nuestro primer acercamiento es para entender los objetivos de negocio que buscamos lograr con el producto. Una vez definido esto, sabemos lo que tenemos que hacer.
Uno de los objetivos de negocios que planteamos, fue incrementar la eficacia del producto para lograr visitantes en suscriptores efectivos.
Al mismo tiempo, buscamos una experiencia de usuario en dispositivos móviles con mayor performance que la actual y con la misma o mejor velocidad de respuesta que le brindaría una App a los usuarios; para esto seleccionamos hicimos una selección tecnologica acorde.
Incrementar el tiempo que los estudiantes permanecen en la plataforma y el porcentaje que terminan los cursos.
Proceso de Branding.
Cómo los usuarios perciban a la marca en el producto es algo escencial. (destacar algo bold ahí) Para esto, recomendamos al cliente realizar un proceso de re-diseño de marca, donde buscamos mantener la esencia que la misma había transmitido en las diferentes comunidades pero con un estilo más actual, fresco, dinámico y que técnicamente nos permita realizar aplicaciones digitales.
"Veníamos de hacer rebranding con otro estudio pero cuando comenzamos con el producto, no nos servía. Focus Mind encontró la manera de lograr lo que imaginabamos; y lo hicieron en una semana"
Benchmarking
"Los buenos artistas copian, los mejores roban"Pablo Picasso.
En el proceso de investigación de mercado nos interesaba entender lo que los mejores jugadores de la industria a escala global estaban haciendo, por qué lo estaban haciendo y luego comparar en base a diferentes parámetros lo mejor que podíamos tomar de éstos para crear el mejor producto digital.
Features destacadas
1. Comentarios de alumnos que dan respaldo
2. Progreso de los cursos que se estan haciendo
3. Afinador para la guitarra interactivo
4. Registro simple, pocos pasos
5. Preferencias para el alumno, una vez logueado
Features destacadas
1.Selector del tipo de lecciones en el home
2. Video explicativo de la plataforma
3. Hightlights del producto
4. Diseño limpio y minimalista
5. Listado de canciones en forma de thumbs
6. LLamados de acción claros para un Free Trial
Features destacadas
1. Experiencia de estudio clara, con progreso y material para cada clase
2. Highlights del producto en el desarrollo del curso
3. Checkout con pocos pasos, compras sin registro
4. Membresías con detalles de que ofrece cada plan
5. Hover con video introductorio
5. Thumbs con detalles sobre el curso
Features destacadas
1. Thumb del curso con imagen y datos sobre el mismo
2. Filtros para buscar por categorías los cursos
3. Video de presentación del curso, dentro del curso ampliado
4. División de contenido por módulos en forma de dropdowns
4. Checkout claro e intuitivo, con pocos pasos para la compra
Los usuarios como centro del producto, siempre.
La plataforma educativa contaba con más de 17000 alumnos, por lo tanto el objetivo era entender junto a nuestro cliente los distintos tipos de usuarios, sus patrones de comportamiento, intereses y puntos de dolor.
Intermedio/avanzado
+ 30 años, hombre
Integración tecnológica: Intermedia/avanzada
Productos Digitales que usa:
Twitter, Spotify, Itunes, Youtube, Instagram, Sibelius.
"Quiero aprender técnicas copadas/avanzadas de guitarra por alguien que la tenga clara."
Principiante
+ 20 años, mujer
Integración tecnológica: Avanzada
Productos Digitales que usa:
Instagram, Tik Tok, Spotify, Youtube y Vimeo.
"Quiero aprender a tocar la guitarra y poder manejar mis horarios, de forma práctica y cómoda desde mi casa."
Suscriptor
+ 25 años, hombre
Integración tecnológica: Intermedia/Avanzada
Productos Digitales que usa:
Youtube, Spotify, TCDG vieja plataforma, Twitter, Instagram.
"Quiero terminar el curso de guitarra que comencé y cumplir con las expectativas de aprendizaje."
Betiana
24 - 32 años
Augusto
26 - 32 años
Martin
28 - 36 años
Intermedio
x ¿Valdrá la pena pagar por esto?
x ¿No será esto un curro?
x ¿Sabe de verdad o solo enseña cuatro acordes?
x ¿No es la mismo que youtube?
x ¿Para qué voy a pagar?
Principiante
x ¿No estaré desperdiciando la plata?
x ¿Esta persona es un profesional serio?
x ¿No será una truchada para sacarme plata?
x ¿Podré aprender bien simplemente con videos por internet?
x ¿Me queda una garantía de que hice el curso?
x ¿No es lo mismo que hacerlo en youtube?
x ¿Para qué voy a pagar?
Suscriptor
x ¿Vale la pena seguir pagando el curso?
x ¿Qué constancia me queda de que aprendí?
x ¿Me será útil lo que estoy aprendiendo?
x No sé si quiero seguir pagando, pero tampoco quiero quedarme a mitad de camino.
Calidad del producto y respaldo
Conocimientos/técnicas de perfeccionamiento que no encontras en otros canales
Enseñanza de calidad a cargo de un profesional reconocido.
Flexibilidad/libertad en la plataforma opciones de pago
Calidad del producto y respaldo
Flexibilidad/libertad en la plataforma opciones de pago
Meta a la cuál llegar.
No vas a encontrar este contenido en Youtube
Flexibilidad para dejar y retomar las clases a gusto.
Seguimiento/motivación durante el aprendizaje
Innovación y practicidad a nivel UX
Opciones de pago descuentos
No vas a encontrar este contenido en Youtube
Motivación/Recompensas a medida que se avanza
Meta a la cuál llegar, demostración clara de avances.
Flujo de usuario
Todos los caminos conducen al checkout?Una vez que comprendimos el flujo de usuario, lo dejamos documentado para entender qué deberíamos hacer en el diseño visual del producto.
- Selección de cursos
- Ganar y acumular premios
- Elegir preferencias o gustos musicales
- Ver los progresos de cada curso
- Elegir el orden de aprendizaje de las clases
- Descargar material de cada clase
- Poder dar por finalizada una clase
- Pagar y luego registrarse
- Registro con sólo un mail
Wireframings
Visualizar las ideas en papel para volverlas reales con un teclado y mouse. El proceso de diseño comenzó con bocetados de la estructura del sitio en lapiz para, una vez aprobadas, convertirlas reales a través de un monitor.
El 67% del uso de la plataforma era desde dispositivos móviles, por eso nuestro acercamiento de de diseño fue a través de "mobile first"
En papel
Digital (estructura)
Digital Branding
Conectando las comunidades digitales con el producto.
Creación de una mascota corporativa.El fundador de tusclasesdeguitarra.com es un influencer digital que cuenta con millones de seguidores en Youtube, Instagram y Facebook. Una de los pilares en el diseño del producto, era no perder la relación cercana que él mantenía con sus comunidades a través de las distintas redes sociales.
“Tusclasesdeguitarra es para mi una escuela donde mis alumnos aprenden mi pasión y lo que se. En las redes tengo una relación muy cercana con ellos y temía que se vuelva muy fría. Lo que hizo Focus Mind fue algo de otra dimensión”.
Para resolver el problema de abandono de los cursos por parte de los alumnos y el aburrimiento cuando estudiaban en la plataforma, creamos una experiencia de estudio interactiva, dinámica y que premie el avance de los alumnos a través de un proceso de gamificación.
de los instrumentos.
y coloreado digital.
Conceptualizamos e ilustramos cada premio y luego determinamos dónde aparecerían en el flujo del usuario.
Prototipos en alta calidad
Los prototipos fueron útiles para obtener feedback por parte del cliente, iterar internamente y contar con una simulación de lo que sería la experiencia del usuario, y que de esta manera tengamos una aproximación de cómo funcionaría el producto.
Decisiones en cuanto a tecnología.
Cómo logramos los mismos objetivos sin desarrollar una app.
Nuestro cliente tenía en mente posterior a este producto la creación de una app, principalmente por motivos de experiencia de usuario y performance en dispositivos moviles.
Las tecnologías que elegimos para el producto y la manera en que creamos el mismo, nos permitió lograr los mismos objetivos a través del diseño de una SPA (single page application) que brinda la experiencia de usuario de una App nativa sin salir de la comodidad del navegador.
Tecnologías utilizadas:
Aceptación del nuevo producto;
De acuerdo al feedback de los alumnos activos que tenía la plataforma.
Incremento en ventas.
El nuevo producto es un 42% más efectivo que el anterior en convertir visitantes en suscriptores.
Incremento de velocidad de carga, comparado con el sitio anterior.
Hora de aprender. Te dejamos el enlace para que navegues el producto y aprendas a tocar con el mejor (y el diseño de los mejores)
Conocer el sitio
Ejecutivo de cuentas,
consultor UX, PM.
Product Manager
Diseñadora UX/UI
Juan AlfieriFront-end Developer
Back-end Developer
Martina LobatoCopywriter
Ejecutivo de cuentas,
consultor UX, PM.
Product Manager
Maira GraffDiseñadora UX/UI
Juan AlfieriFront-end Developer
Jacsiel RodriguezBack-end Developer
Martina LobatoCopywriter
