Edutive: Plataforma SaaS para academias
Nota: En este artículo intento detallar todas las funcionalidades de la plataforma Edutive que se encontraban disponibles en Febrero del 2022, fecha en la cual se discontinuó el desarrollo del software. Si lo que se desea es conocer la historia y mi experiencia personal durante los años trabajados en Edutive, el articulo correspondiente es Cofounder y CTO de Edutive
Descripción general de las funcionalidades
Edutive es un software pensado para ofrecerle la infraestructura necesaria a academias pequeñas y medianas de Latinoamérica de forma que puedan escalar su negocio. La plataforma cuenta con diferentes módulos:
- Core: módulo central donde la academia gestiona los cursos, prospectos, alumnos, pagos, suscripciones y cupones. A su vez puede realizar las configuraciones de su academia e integrar otras herramientas con Edutive.
- Checkout: permite que la academia brinde un proceso de registro a los cursos para los estudiantes, donde pueden pagar por el curso a través de alguna de las formas de pago brindadas por Edutive (tarjeta de crédito/débito, efectivo o transferencia bancaria)
- Canales de venta: se trata de diferentes formas que ofrece Edutive para que las academias puedan promocionar y vender sus cursos. Uno de ellos es un CMS propio para que las academias puedan tener un sitio web dentro de Edutive. También es posible crear un botón de compra que puede ser agregado en cualquier sitio web de preferencia del cliente.
- LMS: gestor de contenidos propio de Edutive, donde se pueden crear módulos y clases, seguir el progreso de los estudiantes y agregar profesores a las clases. Este módulo incluye un panel para estudiantes, donde pueden registrarse y acceder al contenido y a las clases en vivo.
La idea es que el cliente pueda configurar su academia a través del módulo Core, y pueda optar por utilizar el resto de los módulos sólo si los necesita, teniendo también la posibilidad de utilizar una solución de un tercero que esté integrada a la plataforma si así lo prefiriese. Por ejemplo, una academia podría utilizar Edutive para vender sus cursos, aprovechando los procesadores de pago disponibles en Edutive como Mercadopago, pero configurar un LMS externo como Thinkific para gestionar los contenidos y los alumnos. También podría optar por crear su propio sitio web utilizando otra solución diferente en caso que necesite un diseño personalizado, pero continuar vendiendo con Edutive mediante el botón de compra como canal de venta para integrar el checkout dentro dede su propio sitio web.
Esta flexibilidad es posible ya que la plataforma cuenta con integraciones directas con algunas plataformas externas, pero también porque se creó una aplicación de Edutive en las plataformas de automatización Zapier y Make. Esto permite por ejemplo que una academia pueda utilizar cualquier solución de LMS listada dentro de estas plataformas, y configurar una automatización que permita dar de alta al alumno en el LMS elegido de forma automática luego de que se registre una venta exitosa en Edutive.
Las principales tecnologías utilizadas fueron las siguientes:
- Laravel
- Vue
- React
- Nginx
- MySql
- AWS
- Git
- Forge
- Envoyer
Sin embargo, en este artículo no se detallarán los aspectos tecnológicos, sino más bien las funcionalidades de la plataforma. Para ello se hicieron capturas de pantalla de la plataforma, en su gran mayoría utilizando la cuenta de un cliente de Edutive llamado SomosFit, que ha apostado por el proyecto desde sus comienzos.
Core
El core es el corazón de la plataforma, donde la academia puede realizar las configuraciones generales, gestionar los cursos, alumnos y pagos, y habilitar los demás módulos o integraciones.
Registro y Login
La página de registro fue mutando durante la evolución de la plataforma. En un momento se contó con un flujo de registro con onboarding, donde el usuario iba completado alguna información sobre su academia para ayudarlo en la configuración.
Cuando se cambió el segmento objetivo de clientes a B2B, el formulario de registro exigía que el usuario cargue los datos de su tarjeta y elija el plan deseado para cobrar la suscripción a través de Stripe. Esta página de registro detectaba el país del usuario para mostrarle el precio en la moneda correspondiente, ya que se vendía en todo Latinoamérica pero principalmente en Argentina (precio en dólares) y México (precio en pesos mexicanos). En la imagen no se muestra el detalle del plan debido a que ya no existen más planes disponibles.
También se contó con un formulario de registro diferente, donde el usuario podía registrarse de forma gratuita y probar la plataforma por 14 días, sin dejar todavía los datos de su tarjeta. Este registro estuvo habilitado para promociones y a través del link de referidos único que se le brinda a cada academia.
Si el usuario se registraba a través de este formulario, podía utilizar todas las funcionalidades de Edutive. Luego de 14 días podía seguir accediendo a su cuenta pero se bloqueaba el acceso a todas las funciones, teniendo que elegir un plan y cargar la información de su tarjeta dentro de la plataforma.
La página de login es muy sencilla y nunca se actualizó su diseño al Design System que se creó para la empresa. Cuenta con la posibilidad de recuperar la contraseña en caso de olvidarla, y un acceso directo a la página de registro.
Inicio
La página inicial cuenta con un pantallazo rápido de lo que sucede en la academia del usuario. Es posible ver algunos reportes de ventas, transacciones y cursos más vendidos, pudiendo aplicar filtros por fechas. También se muestra la actividad más reciente de la academia, detallando quienes han realizado alguna acción determinada en la plataforma. Por último se dispone el enlace de referidos para que el usuario pueda recomendar el software a quien quisiera y ofrecerle con la recomendación una prueba gratuita de 14 días.
También se muestran una serie de pasos iniciales para configurar la academia y comenzar a vender cursos con Edutive. A medida que el usuario completa estos pasos, se marcaban como completados. Si ya se completaron todos los pasos de setup, la sección desaparecía de la página de inicio.
Cursos
Listado de cursos de la academia. Se provee la posibilidad de filtrar por texto y ordenar según diferentes criterios.
Para crear un curso sólo es requisito seleccionar un nombre. También se puede definir si el curso es basado en ediciones o no. Esta característica permite crear diferentes ediciones de un mismo curso, por lo que el contenido puede repetirse para diferentes camadas de alumnos, permitiendo vender el curso para determinadas fechas y a su vez cambiar sólo determinada información del contenido para cada nueva camada (por ejemplo las fechas de las clases en vivo)
Dentro del detalle de un curso sin ediciones, se puede acceder a 4 pestañas: Información, Precios, Inscriptos y Contenido.
Dentro de la Información se puede modificar información general del curso como el nombre, el estado, las fechas de inicio y fin, y los instructores.
En la pestaña de Precios es posible crear uno o múltiples precios para un curso. La idea de tener más de un precio para los cursos es aplicable sólo para algunas academias particulares, que establecían diferentes precios para un mismo curso porque ofrecían un upselling dentro del mismo curso (por ejemplo asesorías o materiales adicionales). Esto iba a ser reemplazado por una nueva funcionalidad de paquetes o bundles que no llegó a ser lanzada a producción.
Al momento de crear un precio, se puede optar por ofrecer el curso de forma gratuita, con un pago único o con una suscripción recurrente de forma mensual o anual.
También es posible vincular el checkout a un link de pago externo y habilitar un precio internacional para el curso. Esta última funcionalidad permite establecer un precio para el curso en una moneda nacional, y otro precio en moneda internacional para quienes compren fuera del país de la academia. También es posible utilizar un procesador de pago diferente para las compras internacionales (esto se detalla en la sección de configuración).
Otro campo que es posible configurar para un precio, es la página de agradecimiento que se muestra luego de confirmar un pago exitoso. El usuario puede optar por utilizar la página de agradecimiento por defecto de Edutive, o introducir un enlace con su propia página de agradecimiento.
En la pestaña de inscriptos se listan todos los alumnos que ya están inscriptos en el curso. También permite gestionar acciones en masa (como enviarles un correo electrónico) y ver el detalle de la ficha del alumno (se detalla en la sección de contactos)
La última pestaña es la de contenidos, y es donde se configura que sistema de gestión de contenidos (LMS) se va a utilizar para el curso en particular. Las dos opciones nativas que se ofrecen son el LMS de Edutive y Thinkific, pero el usuario podría utilizar otro externo y configurar las automatizaciones a través de Zapier si lo quisiera.
En caso de utilizar el LMS de Edutive, se ofrece un link directo al curso en cuestión dentro del gestor de contenidos. Lo mismo ocurre con Thinkific, con la diferencia de que el usuario es dirigido a un sitio externo.
Curso con ediciones
En caso que el curso sea basado en ediciones, se suma una nueva pestaña al detalle del curso donde se listan todas las ediciones creadas para ese curso. El concepto de edición es análogo al de camada, y lo que hace es establecer una fecha de inicio y de fin para un curso determinado, con un conjunto de alumnos inscriptos para esa edición en particular
Para cada edición se lista las fechas, la cantidad de inscriptos y el estado (próxima, en curso o finalizada). También se puede duplicar una edición para facilitar la creación de una nueva edición. Esta acción duplica todo el contenido de la misma, pero no agrega los inscriptos a la nueva edición, evitando de esta forma tener que volver a crear los contenidos desde 0 para configurar una nueva camada.
Para crear una nueva edición de un curso, sólo es requerido como obligatorio la fecha de inicio y de fin de la cursada.
Dentro del detalle de la edición, es posible modificar las fechas de inicio y fin de la misma, se puede establecer un cupo máximo de alumnos para una edición, cambiar el estado entre oculta o publicada para comenzar a vender la edición solamente una vez que esté completamente configurada, entre otras cosas.
Por otra parte, en este tipo de curso, los inscriptos y la configuración del LMS ya no se encuentra a nivel del curso, sino que pertenece a cada edición particular. De esta forma se pueden distinguir los inscriptos en cada una de las camadas para no mezclar alumnos entre camadas, y a su vez es posible actualizar el contenido que se brinda entre camadas sin afectar a las camadas anteriores.
Contactos
La sección de contactos tuvo varios cambios de nombre, ya que inicialmente se distinguían los prospectos de los alumnos. En la última versión se agrupan ambos dentro del nombre de “Contactos”, diferenciando el tipo entre Alumno y Prospecto según si la persona ya compró un curso y es parte de la academia o no.
En la página de contactos se listan entonces todos alumnos de la academia y todas las personas que hayan dejado sus datos en alguno de los “Call to action” o el checkout del sitio web, pero todavía no han comprado un curso. Es posible filtrar los alumnos por curso o edición en esta misma página, asi como también descargar un archivo csv con todos los contactos de la academia.
En esta página también se pueden seleccionar múltiples contactos y realizar una acción en masa, como enviarles un correo electrónico o inscribirlos a un curso manualmente.
En esta sección también se pueden crear contactos de forma manual, ya sea cargando la información de la persona (el email es el único requisito obligatorio), o importando la información desde un archivo csv. En caso de optar por importar múltiples contactos desde un archivo, es posible seleccionar qué columna del archivo corresponde con cada campo dentro de Edutive, para poder importar un archivo independientemente del orden de sus datos.
Ficha del contacto o alumno
Al hacer click en un contacto es posible ver la ficha del contacto. Esta contiene toda la información básica de la persona (nombre, apellido, email, teléfono) y se separa la información detallada en 3 pestañas: Información, Inscripciones y Actividad.
Dentro de la Información general se pueden ver algunos datos como el origen (cuál fue el “Call to action” por el cual llego la persona a la academia), la fecha de alta, el país y el total gastado. También se lista la biografía y las redes sociales en caso que este lo haya cargado en el panel de estudiantes de Edutive.
En la pestaña de Inscripciones se listan los cursos a los que el alumno esta inscripto. Para cada inscripción se detalla el nombre del curso, el progreso (en caso que se utilice el LMS de Edutive), el estado del curso, la modalidad y los instructores. También es posible inscribir al contacto en un curso dentro de esta pestaña.
La última pestaña es la de Actividad, y lista todas las acciones que el contacto fue realizando en la academia. Algunas de las acciones registradas son:
- Dejo sus datos para comprar un curso
- Dejo sus datos para descargar el programa de un curso o para participar en un webinar
- No completó la compra de un curso (carrito abandonado)
- Completó la compra de un curso
- No completó la compra de un curso debido a un error en el pago
- Se inscribió a un curso
Transacciones
La página de transacciones es un registro de todos los intentos de inscripción a los cursos. En este listado se muestran todos los pagos exitosos, pero también aquellos que por alguna razón fallaron en el cobro, por ejemplo por insuficiencia de fondos en la tarjeta.
Para cada transacción se detalla el producto, el estado, el método de pago, el monto, el email y la fecha. Es posible filtrar las transacciones con texto o por estado.
Los posibles estados de una transacción son:
- Completo: se considera cobrado con éxito y el alumno es inscrito automáticamente al curso
- Error: ocurrió un fallo en el intento de cobro, por lo cual se detalla el error del mismo tanto en el panel de academias como para el alumno al momento de intentar pagar.
- Sin confirmar: cuando el alumno elige “Transferencia bancaria” como opción de pago, se registra una transacción “sin confirmar” ya que el alumno debe realizar la transferencia por su cuenta, y es el administrador de la academia el encargado de comprobar el ingreso del dinero a su cuenta y cambiar el estado a Completo manualmente.
- Pendiente: cuando el alumno elige “Efectivo”, se crea una transacción que queda pendiente, y luego pasará a Completado o Cancelado según si se recibió el pago en efectivo o no. Este estado se actualiza automáticamente gracias a la integración con Mercadopago que brinda conexión con múltiples oficinas de cobro en efectivo. Otro ejemplo de estado Pendiente es cuando la validación de un pago con tarjeta no es instantánea, por lo que todavía no pudo ser rechazada o aceptada (se actualiza automáticamente gracias a la integración con los procesadores de pago).
- Cancelado: se canceló manualmente una transacción Incompleta
En esta página también es posible descargar un archivo csv con todas las transacciones de la academia y su información detallada.
El administrador de la academia podía cambiar manualmente el estado de una transacción. Sólo algunos cambios estaban permitidos. Por ejemplo, se puede cambiar de “Sin confirmar” a “Completo”, o de “Sin confirmar” a “Cancelado”. También se puede por ejemplo filtrar por todas las transacciones sin confirmar, y seleccionar todas las que correspondan para cambiarles el estado en una misma acción.
Si bien no es lo más común, también se puede dar de alta una transacción manualmente, seleccionando un alumno, un curso y un precio ya creado. Al momento de seleccionar el alumno es posible buscar uno ya existente con su email, o crear un alumno nuevo en la misma acción.
Al hacer click en una transacción, se puede ver más información detallada de la misma, como es el procesador de pago, el método de pago, el detalle del error en caso de existir, el tipo de tarjeta utilizado, e información del curso y de la persona involucrada.
En el ícono de un carrito ubicado en la parte superior, se puede acceder a la sección de carritos abandonados. En esta sección se listan todos los prospectos que dejaron sus datos en un curso determinado y no completaron la compra luego de un tiempo predeterminado.
Carritos Abandonados
Acceder a este listado no es de gran utilidad, y por eso tampoco es algo muy visible de acceder. El valor de esta funcionalidad se encuentra en la automatización de envío de un correo electrónico al prospecto cuando ya es considerado un carrito abandonado, invitándolo a que finalice el proceso de compra, y ofreciéndole un enlace que le permite continuar con su compra salteando el primer paso del checkout que es la carga de sus datos personales. Este correo se puede personalizar en la sección de configuraciones que se explica más adelante.
Suscripciones
En la sección de suscripciones se muestra un listado con todas las suscripciones vendidas por la academia, detallando el nombre de la persona, el email, el curso, el estado, el monto y la fecha de creación. Una suscripción puede estar Activa o Cancelada. Si el alumno deja de pagar por su suscripción, el procesador de pagos notifica a Edutive y actualiza el estado en la plataforma, dando de baja al estudiante del curso en cuestión de forma automática.
Cuando se agregó el concepto de suscripciones en Edutive, no se contempló tener dentro de la plataforma el registro de todos los pagos recurrentes de una suscripción. Esta funcionalidad se pensó lanzar a producción en la época que se discontinuó el desarrollo de la plataforma, y si bien se registran los pagos recurrentes en la base de datos de Edutive, no se muestra esta información al usuario. Es por este motivo que no se muestran los pagos recurrentes dentro de las transacciones ni tampoco dentro de una suscripción.
Al hacer click en una suscripción, es posible ver más información de la misma, como el tipo de recurrencia (mensual o anual), el procesador de pago o el identificador de la suscripción en el procesador de pago.
Promociones
En la página de promociones se listan todos los cupones de la academia. Estas promociones permiten crear códigos únicos para ofrecer promociones de descuento a los clientes de la academia. Estos códigos deben ser introducidos durante el proceso de checkout para aplicar el descuento. Al momento de aplicarlo se hace una validación en el sistema para comprobar que estén activos, que queden cupos disponibles, que no este vencido y que sea aplicable para el curso en cuestión.
Desde esta página se pueden crear nuevos cupones y editar cupones existentes. Para cada cupón o promoción se debe elegir un código único que será el que la academia promocione a sus potenciales clientes. Además, se debe especificar el porcentaje de descuento, una descripción para detallar en el checkout, una fecha de vencimiento, una cantidad máxima de usos (opcional) y una selección de cursos para los que pueda ser aplicable. En caso de no seleccionar ningún curso, el cupón se puede aplicar a cualquier curso de la academia.
Aplicaciones
En la página de aplicaciones se listan todas las integraciones que se pueden realizar desde el Core de Edutive. Aquí no se incluyen las integraciones propias del LMS de Edutive, como puede ser Zoom o Typeform, ya que sólo son aplicables en caso de utilizar el “edutive LMS”
Las dos integraciones nativas listadas son “edutive LMS“, que la academia puede activarla con un sólo click en caso de querer utilizar este módulo, y Thinkific, que puede ser conectado utilizando las credenciales de Thinkific desde Edutive.
A su vez se listan una serie de aplicaciones que pueden integrarse a través de Zapier. En este listado se incluyen algunas de las integraciones más comunes, y redirecciona al usuario a la página correspondiente dentro de Zapier donde se puede realizar dicha integración.
El LMS de Edutive será detallado por completo en su sección correspondiente, al igual que las integraciones a través de Zapier y Make.
Thinkific
La plataforma cuenta con una integración directa con Thinkific. Esta es una plataforma de gestión de contenidos muy popular a nivel mundial y que cuenta con muchas funcionalidades para quienes quieran comenzar a brindar cursos en internet. Si bien es una plataforma muy completa para la gestión de contenidos, hasta la fecha no ofrece un procesador de pagos amigable con Latinoamérica, siendo esta la principal motivación de algunos usuarios para optar por utilizar Edutive para vender sus cursos y Thinkific para la gestión de contenidos.
La integración se puede realizar ingresando el nombre de la escuela en Thinkific y la credencial generada por dicha plataforma dentro de los campos solicitados en Edutive.
Una vez activada esta integración, es posible configurar la entrega de contenidos con Thinkific dentro de la ficha de un curso como se mostró anteriormente en dicha sección. En esa configuración se puede especificar a qué curso o bundle de Thinkific se debe inscribir al estudiante luego de la compra exitosa, y se puede detallar otra información como el período por el cual se habilita la inscripción.
Una vez vinculado el curso, es posible acceder directamente al LMS de Thinkific desde Edutive con un acceso rápido, o realizar modificaciones propias de Edutive como editar el curso vinculado o el plazo límite de acceso a los contenidos.
Canales
Los canales son formas de potenciar las ventas de la academia. Este concepto se separó del core de Edutive ya que se pensó en agregar múltiples canales de venta opcionales, como integraciones con redes sociales y con Whatsapp.
Los dos canales disponibles al momento de separar esta funcionalidad son el “edutive Website” y el “Botón de compra“. Estos canales se agregan en la barra lateral sólo cuando son activados de forma manual por la academia.
El edutive Website es el CMS desarrollado por Edutive, que permite configurar un simple sitio web con una página principal, profesores adjuntos y landings de los cursos que incluyen información del curso y call to actions para capturar prospectos, entre otras cosas. El sitio web se desarrolla con mayor detalle en la sección correspondiente.
Botón de compra
El botón de compra es una forma muy rápida de conectar el checkout de Edutive en cualquier sitio web. Sin saber nada de programación, el usuario puede seguir tres simples pasos y tener un botón que le permita vender cursos en Edutive desde su sitio web.
El primer paso consiste en seleccionar el curso para el cual se desea crear el botón
Luego el usuario puede darle el estilo que desea al botón. Puede cambiar el color del fondo, del texto, el tamaño o el tipo de la fuente, e incluso el texto del botón en sí.
El último paso consiste en copiar el código generado automáticamente por Edutive y pegarlo en la sección del sitio web que se desee mostrar el botón. La mayoría de las plataformas low-code pensadas para crear sitios web permiten agregar código de esta forma y no es necesario tener conocimientos de programación para utilizarla, lo cual abría la posibilidad a cualquiera de integrar Edutive en su sitio web con facilidad.
Para hacer una demostración de cómo funciona este botón de compra en un sitio web, copie el código generado en el último paso en una sección aleatoria de mi sitio web. Este sitio utiliza WordPress, por lo que sólo cambie el editor de la página a “Editar como HTML” y pegue el código debajo de la sección “Sobre mi” de mi sitio web. El resultado fue el siguiente:
El código pegado, además de incluir html, incluye un script desarrollado por Edutive que agrega cierta lógica al botón. Cuando el usuario hace click en el botón de comprar, se abre en una nueva ventana el checkout del curso seleccionado anteriormente. A su vez, se oscurece el fondo del sitio web, generando una sensación de inmersión como si se estuviese navegando en un popup del mismo sitio.
La experiencia en dispositivos móviles es simplemente una redirección, ya que al abrir una ventana nueva en el navegador del celular, se cambia a la nueva pestaña automáticamente perdiendo visibilidad de la pestaña anterior.
En caso que el usuario pierda de vista la nueva ventana, puede volver a abrirla desde el sitio web original como se muestra en la siguiente imagen.
Si el usuario cierra la ventana del checkout, se vuelve a mostrar el sitio original como en un principio.
Checkout embebido
También se ofreció la posibilidad de embeber el checkout dentro del sitio web del cliente. Esto se hizo principalmente para un cliente importante que lo solicitó de esa forma, pero no es algo que cualquier cliente pueda realizar de forma autónoma ya que requiere autorizar en nuestro servidor el dominio del cliente para solucionar los problemas de CORS policy.
Perfil del usuario
Desde la barra superior del panel de administración, es posible abrir la configuración del perfil del usuario de Edutive.
En esta página, el usuario puede cambiar sus datos personales (nombre, apellido, email, imagen de perfil), establecer el idioma dentro de la plataforma (español o inglés), y configurar las notificaciones por email, es decir, si desea recibir un correo por cada venta o captura de prospecto.
En esta sección también se dispone del API token, que permite hacer uso de las APIs de Edutive para su cuenta.
Configuración
Accediendo al icono de configuración de la barra superior, se abre un panel independiente con una nueva barra lateral, donde el usuario puede navegar y realizar las configuraciones generales de la academia. Estas configuraciones forman parte del Core de la plataforma, pero están separadas debido a que en el común de los casos son de acceso eventual y no recurrente para el usuario. Es decir, son configuraciones que por lo general se realizan una vez y en rara ocasión se vuelve a actualizar.
Información General
En esta sección se pueden configurar las siguientes propiedades:
- Nombre de la academia: visible en multiples secciones (sitio web, checkout, emails, etc)
- Idioma de la academia: a diferencia del idioma seleccionado en el perfil del usuario, esta selección de idioma se aplica a los lugares públicos de la academia (sitio web, checkout, panel de estudiantes)
- Dominio: es posible elegir el nombre del subdominio dentro del dominio de Edutive que es aplicable para el checkout y el sitio web (el subdominio del panel de estudiantes se configura en el LMS). En caso que se quiera utilizar un dominio propio, es posible solicitarlo pero se debe configurar manualmente por Edutive.
- País de origen: es el país de la academia. Esta configuración es importante, entre otras cosas, para las academias que desean utilizar un procesador de pagos distinto en su país y en el resto del mundo.
- Zona horaria: se carga automáticamente con el país, pero puede ser modificada en caso de ser necesario. Se utiliza tanto para las fechas que se visualizan en la plataforma, como para las clases en vivo dentro del panel de estudiantes.
- Moneda: es la moneda principal con la que se desea cobrar los cursos. En caso de querer cobrar con otra moneda internacionalmente es posible únicamente en dólares y se configura en métodos de cobro.
- Configuración avanzada: estas secciones de “Términos y condiciones” y “Política de privacidad” permiten colocar un enlace personalizado para ser enlazados desde el footer del sitio web y del checkout de la academia.
Identidad
En la sección de Identidad se puede elegir el color principal de la academia, el logo y un ícono. Esto permite darle personalidad en toda la información pública de la misma: sitio web, checkout, emails, panel de estudiantes, etc.
Métodos de cobro
La sección de métodos de cobro permite configurar un procesador de pago y las diferentes formas de cobro de la academia. La lógica de esta sección es un tanto rebuscada ya que depende del procesador de pago elegido.
En la siguiente imagen se puede ver un ejemplo donde no existe ningún procesador de pago configurado. En este caso sólo es posible ofrecer la opción de transferencias bancarias, que debe ser activada manualmente
Para activar las transferencias bancarias se debe hacer click en “Editar”, luego activar dicha configuración y guardar los cambios. Además es necesario detallar en el campo disponible toda la información necesaria que será brindada al cliente al momento de seleccionar dicha opción en el checkout, para que este pueda realizar la transferencia correctamente.
Al seleccionar el botón de “Vincular procesador de cobro”, se muestran todos los procesadores de pago disponibles para la moneda configurada por la academia. Esto es importante ya que algunos procesadores de pago no soportan todas las monedas. Por ejemplo, hasta la fecha no es posible vender en dólares estadounidenses a través de Mercadopago.
En la siguiente imagen se muestra un ejemplo de una academia con Mercadopago como procesador de pagos seleccionado. Al utilizar Mercadopago, es posible habilitar las opciones de cobro Tarjeta de débito/crédito y efectivo. Ambas opciones deben ser activadas de forma análoga a como se hizo con las transferencias bancarias
En la parte inferior se muestra una opción para cambiar el país o la moneda de la academia. El cambio de moneda es un cambio delicado en caso que la academia ya haya configurado precios, y por eso se agrega la advertencia de que se deben volver a configurar todos los precios de la academia.
En caso de querer avanzar con el cambio, se vuelve a solicitar el país de origen y la moneda. A su vez, se valida que la academia no haya realizado ventas todavía, ya que en ese caso se requiere de una intervención manual debido a posibles conflictos con los reportes y la información relacionada a las transacciones.
El procesador de pago en cambio puede ser cambiado en cualquier momento sin inconvenientes, ya que los precios se van a seguir manteniendo.
Los pasos para configurar Mercadopago son sumamente sencillos ya que se implementó una integración mediante autenticación OAuth. De esta forma, lo único que debe hacer el usuario para conectar este procesador de pago es iniciar sesión en su cuenta de Mercadopago luego de hacer click en “Vincular”, y aceptar los permisos solicitados en pantalla. Una vez aceptado, el usuario es nuevamente redirigido a Edutive y Mercadopago se conecta de forma automática ya que se almacenan unas credenciales en Edutive para operar en nombre de la academia.
Para configurar Stripe es un flujo similar, ya que también se implementó la conexión a través de OAuth. En este caso particular, la academia actúa como un merchant dentro de la cuenta de Stripe de Edutive, pero de cara al usuario no hay diferencias respecto a utilizar Mercadopago.
En el caso de Paypal, la configuración es mediante el ingreso de la clave pública y el access token provisto por el procesador de pago en los campos brindados por Edutive, ya que no provee un método de autenticación directo.
Por último, existe una pestaña adicional para cobros internacionales, que permite a la academia configurar un segundo procesador de pagos para procesar todos los pagos fuera de su país en dólares estadounidenses, algo muy común de hacer si se quiere vender desde Latinoamérica al resto del mundo. Debido a que sólo se permite configurar el segundo procesador en dólares, sólo es posible utilizar Paypal o Stripe para cobrar internacionalmente.
Esta configuración es análoga a la configuración de procesador de pago nacional, por lo que no hace sentido mostrar imágenes del mismo. A su vez cabe destacar que, como otras funcionalidades avanzadas de la plataforma, sólo se permite configurar un segundo procesador de pagos a academias que contratan el plan más avanzado del software.
Notificaciones
El software cuenta con la posibilidad de enviar emails automáticamente luego de determinados sucesos en la plataforma. Estos sucesos son:
- Transacciones: luego de la compra exitosa de un curso
- Descarga de un programa: luego que el usuario deja sus datos en el sitio web para descargar el contenido del programa de un curso
- Correo de bienvenida: cuando el usuario compra un curso por primera vez en la academia. Se ofrece la posibilidad de incluir un enlace de registro al panel de estudiantes en caso que utilice el LMS de Edutive.
- Carrito Abandonado: cuando el usuario deja sus datos para comprar un curso pero no finaliza la compra luego de un período de tiempo predeterminado, es considerado un carrito abandonado, y se le envía un email automáticamente para que continúe la compra del curso desde donde la dejó.
También es posible establecer si se quiere recibir una copia de determinados correos a una dirección de email particular como CCO. Esto es un atajo que se hizo principalmente para integrar determinados sucesos con Hubspot.
Para cada correo automático, el usuario puede redactar el contenido a su gusto, y hacer uso de determinadas variables relativas al suceso en cuestión. Por ejemplo, para una nueva transacción es posible utilizar variables que representen el nombre de la academia, el nombre del alumno y el nombre del curso. En el caso del correo de bienvenida también se puede incluir el email del alumno y la fecha de inscripción, y en el correo de carritos abandonados se puede utilizar el enlace específico para retomar la compra de ese curso con los datos de esa persona.
Instructores
Esta sección permite crear instructores de la academia, detallando nombre, profesión, descripción, una imagen y redes sociales. Estos instructores deben ser agregados luego a un curso o edición por parte del administrador de la academia con el fin de que aparezca públicamente como instructor del curso en cuestión.
A su vez es posible crear una cuenta de Edutive para el instructor estableciendo un email y una contraseña, de forma que este pueda acceder a la plataforma como profesor y ver los contenidos de los cursos a los que fue asignado. Esto se llamó panel de instructores y será detallado más adelante.
Esta sección originalmente formó parte del Core de Edutive, pero luego se movió a las configuraciones generales ya que es algo opcional para muchos clientes. De hecho, su funcionalidad aplica únicamente para el CMS o para el LMS, pero no tiene implicancias en el checkout.
Ubicaciones
Las ubicaciones son una entidad que existe desde los comienzos de Edutive, ya que originalmente se pensó que se puedan vender cursos presenciales además de los virtuales. La idea es que las academias puedan ofrecer cursos presenciales e indicar donde será dictado ese curso, de forma que esta información sea visible para el alumno al momento de hacer la compra del mismo.
La realidad es que prácticamente todos los clientes que han llegado a Edutive tienen la intención de vender cursos virtuales, por lo que no se dedicó nada de esfuerzo en mejorar esta funcionalidad, que se retiró del Core y se movió a las configuraciones para los clientes legacy que todavía tenían algún curso presencial publicado.
Scripts
Las academias pueden cargar scripts que carguen en el header o el footer del sitio web y del checkout, permitiendo agregarles diferentes funcionalidades. Por ejemplo, se puede agregar un script para tener un seguimiento del tráfico de visitas con Google Analytics, o agregar un script de un chatbot que de respuestas en tiempo real a los potenciales clientes que tengan dudas al momento de hacer una compra, entre otras cosas.
Suscripción
La sección de suscripción muestra toda la información relevante al plan contratado con Edutive: nombre del plan, monto a pagar, moneda, recurrencia (anual o mensual) y fecha del próximo pago. Toda esta información esta integrada con Stripe, que es el procesador de pagos utilizado por Edutive para cobrarle a sus clientes.
Además, en esta sección el cliente puede cancelar su suscripción actual, o actualizar la información de pago en caso que necesite utilizar otra tarjeta para los cobros recurrentes.
Los planes existentes en Edutive fueron mutando con el tiempo, pero por lo general existió siempre un plan básico, uno avanzado y uno “Enterprise” para clientes grandes con necesidades personalizadas, y los precios también variaron según si la recurrencia es anual o mensual. En la siguiente foto se muestra un ejemplo de esta sección donde el plan es personalizado.
En los últimos meses de actividad se intentó comenzar a cobrar un porcentaje de participación por las ventas de la academia, y es por eso que en esta página se agregó también información sobre el porcentaje y el monto a pagar acorde a las ventas de la cuenta. De todas formas esto no se llegó a implementar, y si bien se registró el porcentaje correspondiente a cobrar, nunca se llegó a cobrar dicha comisión.
Dentro de la información de la suscripción también se muestra una pantalla que detalla toda la información relacionada con las facturas emitidas al cliente. De esta forma el cliente puede ver las facturas ya emitidas y las próximas facturas a cobrar
También se muestra un monto llamado “Saldo de la cuenta“. Esto se sumó ya que desde marketing y customer success se iniciaron algunas campañas donde se premiaba a los usuarios por determinadas acciones (por ejemplo referir a un usuario), y estos premios consistían en saldo a favor que luego era deducido de la próxima factura a pagar. Esto fue posible implementar de forma rápida gracias a que Stripe ya contaba con dicha funcionalidad.
Datos de compra
Una de las últimas funcionalidades agregadas a la plataforma consiste en que la academia pueda capturar más información de sus clientes durante el proceso de compra. La plataforma exige que el alumno complete su nombre, apellido, email y teléfono, pero para algunos usuarios esta información es insuficiente.
En la siguiente imagen se muestra un ejemplo donde además de los campos requeridos, se agregaron dos datos adicionales a solicitar en el checkout: DNI y profesión
El usuario puede modificar el orden en el que se disponen estos datos adicionales en el checkout. A su vez, puede determinar si el dato son sólo números o puede ser alfanumérico, y si es un campo obligatorio u opcional. El identificador del dato se genera de forma automática, y sirve para justamente identificarlo de forma inequívoca en caso de utilizar las APIs de Edutive o una integración con Zapier o Make.
Checkout
El flujo del checkout fue desarrollado con React y corresponde con la parte más crítica para los clientes, por lo que ha sufrido varios cambios de diseño. El último diseño se realizó como proyecto “Mobile first“, priorizando el diseño para dispositivos móviles que representaban la mayoría de las visitas.
A su vez se mantuvieron algunos conceptos como poder capturar el prospecto en un primer paso, poder elegir el método de pago en el segundo y finalizar la compra como último paso dependiendo del método de pago elegido previamente. Independientemente del paso, en todo momento se le muestra al cliente la información del curso a comprar y el precio, junto con la posibilidad de cargar un cupón de descuento.
Captura de datos personales
Como primer paso se solicita el nombre, apellido, email y teléfono del estudiante, pudiendo capturar la información del potencial cliente en este punto para poder persuadirlo en caso que luego no finalice la compra. En esta sección también se solicitan los datos personalizados mencionados anteriormente en caso que la academia haya agregado alguno.
Selección de método de pago
El segundo paso consiste en seleccionar el método de pago entre los disponibles para la academia. Los métodos posibles son pagar con tarjeta, transferencia bancaria o efectivo.
Pago con tarjeta de crédito o débito
En caso que el estudiante seleccione pagar con tarjeta, se solicitan los datos de la tarjeta dependiendo del procesador de pago que utiliza la academia. Si utiliza Mercadopago, es obligatorio solicitar algunos datos adicionales con respecto a Stripe, como por ejemplo el tipo y número de documento. Tanto con Mercadopago como Stripe, la experiencia de compra convive dentro del diseño de Edutive, mientras que con Paypal se redirige al estudiante a pagar dentro de la plataforma de Paypal y es enviado nuevamente a Edutive una vez finalizado el pago.
Pago con transferencia bancaria
En caso de seleccionar transferencia bancaria, se muestra la información cargada por la academia para realizar la transferencia, junto a un código generado automáticamente para que el cliente utilice como referncia de la transferencia y permita facilitar la validación del pago por parte de la academia.
Pago en efectivo
En caso de seleccionar efectivo como forma de pago, se le entrega al cliente un cupón de pago para ir a pagar a la sucursal seleccionada, a la vez que se le envía el mismo por email a su correo electrónico. En el caso de Argentina pueden optar por sucursales como Rapipago o Pago Fácil, pero dependiendo del país pueden existir otras alternativas.
Pago de suscripción
En caso que el pago del curso sea a través de una suscripción, el único método de pago posible para seleccionar es el de tarjeta de crédito, utilizando Mercadopago o Stripe como procesador de pago. En la información del checkout se especifica que se trata de una suscripción indicando si es con recurrencia mensual o anual, y el precio total por mes/año.
Aplicar cupón de descuento
Los clientes pueden utilizar los cupones promocionados por la academia dentro del flujo del checkout para poder obtener el descuento correspondiente. En la barra lateral se brinda el campo para la carga del cupón, que una vez aplicado se valida (vigencia, cupos, elegibilidad, etc) y de ser correcto se muestra el precio antiguo y el precio final actualizado.
Diseño mobile
Todas estas pantallas tienen su diseño pensado para dispositivos móviles, pero sólo se incluyeron capturas de pantalla de escritorio. A continuación se muestra un ejemplo de la distribución para dispositivos móviles, donde el contenido se separa de un footer expansible que mantiene fijo el precio del curso por más que el usuario haga scroll en la pantalla.
CMS y Sitio Web
Edutive cuenta con su propio sistema de gestor de contenidos (CMS) un tanto rígido respecto a la personalización, pero que permite a las academias contar con un sitio web propio que le ayude a vender sus cursos, capturar prospectos, o simplemente tener presencia en internet.
Página de inicio
La página de inicio es la sección que muestra una descripción general de la academia y es la ruta raíz del sitio web, siendo enlazado también desde el logo del header del sitio.
En esta página se puede cargar un encabezado que incluya una imagen de fondo, un texto llamativo y hasta dos botones de “Call to action” con el fin de capturar la atención del visitante.
A continuación se pueden listar de forma opcional algunos cursos o instructores destacados de la academia, siendo también enlaces para ver el listado de todos los cursos o instructores.
Toda esa información se carga y configura desde el panel de las academias, ingresando en la sección de “edutive Website” que abre un panel independiente con nuevas secciones para realizar las configuraciones correspondientes al sitio web. Dentro de este panel se lista la opción “Página de inicio” que permite configurar dicha sección.
Header y Footer
Otra de las secciones a configurar son los menus de navegación superior e inferior, que se muestran de forma transversal en todo el sitio web con excepción del checkout.
En estos menus se pueden agregar enlaces personalizados, indicando un nombre y el link a donde dirigir al usuario. A su vez, existen dos opciones pre-cargadas para enlazar a la sección de cursos y de instructores. Estas secciones pueden ocultarse en caso de no querer incluirlas, o incluso cambiarles de nombre. En el ejemplo de la imagen, el menu de cursos fue renombrado a “Otros recursos” en el header y a “Programas” en el footer, y el de instructores se ocultó únicamente para el header.
También se pueden incluir de forma opcional los enlaces al panel de estudiantes y al panel de instructores. Estos ya cuentan con el enlace correspondiente cargado, y a su vez tienen un diseño de botón para que sea distinguido del resto de las opciones del menú.
Listado de Cursos y de Instructores
Otras dos páginas adicionales del sitio web generadas de forma automática consisten simplemente en un listado de los cursos y un listado de los instructores. Para ambos casos, se muestran imágenes y demás contenido ya cargado previamente para cada curso o instructor, y un enlace a la página de dicho curso/instructor.
Página de un instructor
La página de un instructor muestra simplemente la información cargada para dicho instructor: nombre, imagen, profesión, descripción y enlace a sus redes sociales.
Página de un curso
La página de un curso por su parte, es mucho más amplia y con funcionalidad propia, ya que es la página de presentación del curso que tiene como objetivo informar al estudiante y dirigirlo al checkout para realizar la compra.
En esta sección se muestra:
- Una imagen de portada con un texto llamativo superpuesto y un botón de “Inscripción” que desliza el sitio hasta la sección de inscripción. También incluye un botón opcional para contactar a la academia.
- Una sección de descarga del programa, que solicita al estudiante de forma obligatoria la carga de sus datos antes de comenzar la descarga para poder capturar su información.
- Una sección de contenidos que incluyen imágenes y textos para poder describir el curso
- Una sección de beneficios que permite añadir más bloques de texto con iconos representativos
- La sección de inscripción que lista los diferentes precios para el curso con un enlace al checkout
- Una sección con el listado de instructores asignados al curso
- Una sección de casos de éxito
- Una sección de patrocinadores del curso
- Una sección de preguntas frecuentes
Toda esa información se configura desde el panel de academias para cada curso en cuestión, pudiendo incluso determinar si se desea publicar u ocultar la página del curso en su totalidad.
La carga de toda la información, incluyendo el archivo del programa del curso, los textos, las imágenes y los enlaces, se realiza dentro de una misma sección para cada uno de los cursos de la academia, siendo esta página de configuración bastante cargada de información y botones. Anteriormente el CMS se configuraba dentro del mismo panel del Core, y esta carga de información se hacía en diferentes pestañas del curso, pero luego se movió todo a una sección propia del CMS con secciones expansibles para separar las funcionalidades del Core con las del CMS.
A su vez es posible modificar los textos propios de la plantilla del curso, que no forman parte del contenido propio cargado por la academia. Estos textos se cambian dentro de una sección a parte llamada “Plantilla del curso”
LMS
El “Learning Management System” (LMS), es un módulo independiente del core de Edutive. Por este motivo se presenta, al igual que el CMS, en un panel independiente con sus propias secciones: Cursos, Recursos, Navegación e Integraciones.
Dentro de la sección de cursos se listan todos los cursos creados por la academia dentro del Core, permitiendo buscar y filtrar dentro del listado, y brindando una información general de cada uno: cantidad de clases, cantidad de inscriptos y estado en caso que el curso tenga fechas de inicio y fin.
Clases y módulos
Al ingresar a alguno de los cursos del listado anterior dentro del LMS, se abre el detalle del mismo contenido en dos pestañas: Clases e Integrantes.
Dentro de la pestaña de clases se pueden crear diferentes módulos y clases para agregarle el contenido al curso en cuestión. A su vez se presenta el listado de módulos y clases ya creados, indicando su estado y permitiendo editar o eliminar el contenido.
Los módulos son simplemente una forma de agrupar las clases para darle mayor orden al contenido del curso. Además de un título, también se puede indicar si se quiere mantener el módulo como oculto o público, permitiendo al administrador cargar el contenido de las clases del módulo con anticipación y liberarlo para que esté disponible para los estudiantes cuando lo considere.
En el listado también es posible reordenar los módulos y las clases utilizando el ícono de los 6 puntos del lado izquierdo del elemento. Si bien no es posible tener módulos anidados, se pueden agrupar clases dentro o fuera de los módulos.
Los módulos y clases ocultas se muestran con un fondo gris para poder identificarlas fácilmente. Además se muestra un ícono para cada clase que indica el tipo de clase. Para las clases en vivo por ejemplo, se muestra la fecha y el horario de inicio y de fin.
Tipos de clase
Como se mencionó previamente, existen diferentes tipos de clases. Al momento de apretar en el botón de “Crear clase”, se solicita ingresar un nombre para la misma y seleccionar uno de los tipos de clase disponibles.
Los tipos de clases sirven para darle mayor relevancia a un tipo de contenido en particular, pero todas cuentan con la posibilidad de agregar una descripción que puede incluir textos, imágenes, enlaces o incluso videos embebidos. También se pueden agregar recursos, que son archivos que representan materiales complementarios de la clase y que pueden ser descargados por los alumnos dentro de esa misma clase.
Texto
El tipo de clase más básica es la “clase de texto“, que igualmente como se dijo antes, permite agregar diferente tipo de contenido dentro de la descripción.
En la descripción de la clase se le puede dar diferentes formatos al texto, agregar enlaces, o agregar imágenes o videos embebidos mediante dos opciones adicionales agregadas al editor de texto básico.
En la parte inferior se pueden agregar archivos cargados dentro de los recursos de la academia, o enlaces que sirvan también como material complementario para la clase. Ambos son presentados luego al estudiante de manera indistinta como si fuese un modal dentro del panel, pero la diferencia radica en que los archivos subidos son accesibles únicamente desde el panel de estudiantes manteniendo la privacidad de los mismos en internet.
Video
Otro tipo de clase es la de Video, que permite adicionalmente ingresar el enlace de un video para mostrarlo embebido como contenido principal de la clase. Las plataformas que se aceptan son Youtube y Vimeo, ya que se programó para embeber el video a partir del enlace.
En el caso de Vimeo, la plataforma permite configurar la privacidad del video para que pueda ser reproducido sólo bajo un dominio puntual. De esta forma, la academia puede configurar la privacidad del video para que sólo pueda ser reproducido bajo el dominio de su panel de estudiantes, y de esa forma evitar que los estudiantes compartan los videos de las clases en internet: sólo los estudiantes registrados pueden acceder a estos videos con sus credenciales de Edutive.
Clase en vivo
Otro tipo es la clase en vivo, que además del nombre permite configurar una fecha y un horario de inicio y fin de la clase.
Esta fecha y horario no es sólo informativa ya que agrega funcionalidad en la plataforma. Por ejemplo, se muestra un acceso rápido a la clase dentro del panel de estudiantes y de profesores 15 minutos antes de comenzar, a modo recordatorio y para no tener que buscar el enlace de la clase dentro del curso. A su vez, se listan las próximas clases dentro de la pantalla de inicio de la plataforma, con un acceso rápido al contenido de esas clases.
Como último campo es obligatorio ingresar el enlace a la videollamada. Esto permite utilizar cualquier plataforma de videollamadas para tener las clases, como por ejemplo Google Meet.
A su vez, se ofrece una integración con Zoom a través de sus APIs, que facilitan el proceso de creación y gestión de las clases en vivo. En caso de realizar esta integración, no es necesario cargar ningun enlace ya que la clase se crea de forma automática en Zoom utilizando la fecha y horario cargado para la clase. Además se permite grabar las clases de forma automática, funcionalidad que sólo esta disponible en cuentas de Zoom con determinados planes.
También se implementó la posibilidad de que las clases de Zoom estuviesen disponibles de forma embebida en el navegador dentro del panel de estudiantes, pero esto traía algunas limitaciones y problemas, por lo que finalmente se quitó dicha opción y los estudiantes necesitaban tener algún cliente de Zoom instalado para poder acceder a la clase.
Formulario
Otro tipo de clase existente es la de formulario, un tipo útil para realizar encuestas o hacer evaluaciones a los estudiantes. Estas clases permiten agregar un enlace al formulario, y esto le permite al estudiante completar el formulario dentro del panel de estudiantes, ya que carga de forma embebida dentro del mismo.
A su vez se ofrece una integración con Typeform, que facilita la vinculación de los formularios de dicha plataforma con Edutive, dándole así un mejor seguimiento de qué alumnos completaron los formularios sin la necesidad de pedirle sus datos, ya que en la integración se agregan algunos parámetros básicos como el email y nombre del estudiante de forma automática.
A través de las APIs de Typeform es posible vincular una clase de tipo formulario de Edutive a un formulario puntual dentro de un workspace de Typeform, o bien crear un nuevo formluario dentro de ese workspace que llevará el mismo nombre de la clase (el usuario debe luego ir a modificar el formulario dentro de Typeform).
Archivo
Las clase de tipo archivo permiten seleccionar un archivo de tipo PDF dentro de los recursos subidos por la academia, para que este sea el elemento central de la clase. El mismo aparece de forma embebida en el navegador como el contenido de la clase en cuestión
Ver clase como alumno
Para todos los tipos de clases se muestra un acceso rápido para ver dicha clase como si se fuese un alumno, es decir, dentro del panel de estudiantes. De esta forma, las academias tienen la posibilidad de ver cómo quedaría el producto final del contenido que van cargando para una clase.
Integrantes
En la pestaña de Integrantes simplemente se listan todos los alumnos e instructores asociados a dicho curso, mostrando su información básica como nombre, imagen, redes, etc.
Además se indica si el alumno ya está registrado dentro del panel de estudiantes o todavía no realizó el registro. Esta información es útil ya que la primera vez que un estudiante compra un curso en una academia, debe registrase con su email y establecer una contraseña dentro del panel de estudiantes para comenzar a tener acceso a los cursos. De esta forma es posible identificar a los estudiantes que todavía no se han registrado o han tenido algún problema para hacerlo.
Recursos
Los recursos son una sección donde el administrador puede cargar diferentes tipos de archivo para que estén disponibles dentro del LMS. Estos archivos luego pueden ser utilizados dentro de las clases como material complementario, o mismo como contenido propio de una clase.
Los archivos son almacenados en un bucket S3 de Amazon, y sólo son accesibles desde la plataforma de Edutive, por lo que subir un archivo como recurso en Edutive no lo hace público dentro de internet, manteniendo los contenidos de las academias de forma segura.
Navegación
Las academias pueden agregar secciones en la barra de navegación del panel de estudiantes, de forma que sus alumnos puedan tener un acceso rápido a las plataformas de interés de la academia que son externas a Edutive. Por ejemplo, una academia puede agregar un enlace para soporte, para las redes o grupos importantes, para webinars, etc.
Al agregar una sección en la barra de navegación, es necesario establecer el nombre, el enlace y un ícono para representar la sección dentro de un conjunto de iconos disponibles.
La única navegación obligatoria y que no puede ser reordenada es la de Inicio, que aparecerá siempre primera en el panel de estudiantes y redirige al alumno al inicio. De todas formas se le puede cambiar el nombre a esta sección en caso que se prefiera otro.
Integraciones
Dentro del panel de LMS existe una sección de Integraciones propias del gestor de contenidos. En esta sección es posible configurar la integración con Zoom y con Typeform ya explicadas con anterioridad
Panel de estudiantes
Cuando las academias habilitan el LMS de Edutive, automáticamente se genera también un subdominio propio para un panel de estudiantes, donde los alumnos pueden iniciar sesión para comenzar a ver los contenidos de los cursos comprados.
Este panel de estudiantes fue desarrollado con React, y al igual que el sitio web y el checkout, también se priorizó que el diseño sea amigable para dispositivos móviles. De todas formas, en este artículo se mostrarán capturas de pantalla de escritorio por simplicidad en la presentación.
Login y Registro
Con el fin de poder escalar la plataforma para soportar miles de estudiantes en simultáneo, se tomó la decisión de delegar la autenticación a un servicio externo y poder mantener el estado de la sesión fuera de los servidores de Edutive. El servicio elegido fue Auth0, que brinda una pantalla de inicio de sesión y de registro propia, pero donde se nos permite utilizar un subdominio y un logo diferente para cada academia dentro de esta pantalla.
Es importante destacar que las academias que utilizan Edutive son independientes entre sí. En el caso que un estudiante se registre en el panel de estudiantes de una academia, podrá ver todos los contenidos de los cursos que haya comprado en esa academia únicamente.
En caso que un mismo estudiante haya comprado un curso en otra academia que también está hospedada en Edutive, debe utilizar las mismas credenciales elegidas para la primer academia, pero debe iniciar sesión en el dominio de la academia a la cual quiere acceder a ver los cursos. Es decir que dispone de una única cuenta que le permite acceder a cualquier academia de las hospedadas en Edutive, siempre y cuando haya comprado un curso y tenga acceso al panel de estudiantes de esa academia.
Página de inicio
Al acceder al panel de estudiantes, puede verse una barra de navegación lateral que muestra los enlaces configurados en la sección de navegación mostrada en el LMS. La página de inicio es la única sección de esta barra lateral que muestra el contenido propio del LMS.
En la parte superior del inicio se muestran algunos pasos para por ejemplo invitar al estudiante a completar sus datos personales, e inmediatamente debajo de esta sección se muestra el listado con todos los cursos a los que el estudiante esta inscrito.
El objetivo de la página de inicio es que el estudiante pueda acceder rápidamente a los contenidos de sus cursos. También se muestra un acceso rápido a la clase en vivo en caso que queden pocos minutos para que comience.
Perfil del estudiante
En la barra superior se ubican dos botones para poder cerrar sesión y para abrir el perfil del estudiante. Este último permite al estudiante cargar o actualizar su información personal: nombre, biografía, país, teléfono y redes sociales.
También puede configurar algunas preferencias, como lo son las notificaciones por email o la privacidad de sus datos sensibles (teléfono o email). Por último, puede solicitar un cambio de contraseña por email que es gestionado a través de Auth0.
Contenido del curso
Al ingresar a un curso desde la pantalla de inicio se muestra una portada y el listado de clases del mismo. En esta página el alumno sólo puede ver el listado de todas las clases y módulos visibles, y acceder a cada una de las clases para ver el contenido en cuestión.
También puede ver su progreso dentro del curso, ya que para cada clase puede marcar la misma como completada, y de esa forma también brindarle información a la academia del avance del estudiante dentro del curso.
En la información del curso también se muestra otra pestaña de Integrantes, donde se listan todos los instructores y alumnos del curso, pudiendo ver la información de los mismos en caso que la hayan cargado en su perfil.
Contenido de la clase
Al ingresar a alguna clase del curso, se abre una vista nueva donde el estudiante queda inmerso en el contenido del curso, y ya no ve la barra lateral con los enlaces configurados por la academia. En su lugar, en la barra lateral se muestra el nombre del curso, el progreso y el listado de clases y módulos, teniendo la posibilidad de volver a la información del curso con un botón de retroceder.
En el centro de la pantalla se muestra el contenido de la clase, de forma que el estudiante pueda ver el contenido con mayor comodidad y navegar entre las diferentes clases con facilidad. También puede marcar la clase como completa en el final del contenido de la clase y avanzar a la clase anterior o siguiente.
Panel de profesores
Además de un panel propio para los estudiantes, las academias que utilizan el LMS de Edutive también cuentan con un panel para los instructores de su academia. Anteriormente ya se mostró como es posible crear una cuenta a los instructores, siendo esta la cuenta utilizada para acceder a este panel.
Esto permite que los administradores de las academias puedan delegar determinadas funciones a sus instructores, como poder cargar o actualizar el contenido de las clases, gestionar las clases en vivo, o simplemente acceder a las clases de forma organizada.
El registro de los instructores los debe hacer el administrador de la academia, pero luego pueden hacer login en una pantalla similar a la de los administradores para acceder a un panel limitado de Edutive.
En el panel de instructores se muestra una pantalla de inicio donde se orienta al instructor sobre lo que puede hacer en la plataforma, y también se listan las próximas clases de los cursos a los que el instructor está asignado.
El instructor puede acceder y modificar el contenido de todos los cursos a los que fue asignado. Si bien se pensó en implementar una funcionalidad de permisos, esta no llegó a producción, por lo que el instructor cuenta con los mismos permisos que el administrador dentro del LMS. De todas formas no puede acceder al core de la plataforma, por lo que no puede editar precios, gestionar camadas, modificar estudiantes o prospectos, ver reportes de ventas, etc.
Además de los contenidos de los cursos asignados, puede acceder a los recursos de la academia para utilizarlos como contenido de las clases, y también subir nuevos archivos a la plataforma.
Panel de Super Administrador
Hasta el momento se han mencionado 3 tipos de usuarios diferentes que interactúan con la plataforma: los administradores de las academias, los instructores y los estudiantes. La autenticación de los dos primeros son gestionados con Laravel, mientras que los alumnos son autenticados a través de Auth0.
Además de estos tres roles, existe un rol de super administrador que permite acceder a un panel para la visualización y gestión de todas las cuentas registradas en Edutive.
Este panel se creó inicialmente con la necesidad de que el personal de Edutive pueda acceder a la información de las cuentas creadas en Edutive, su progreso dentro de la plataforma (ventas, cantidad de cursos, etc) y a su vez poder borrar cuentas. Las funcionalidades de reportes luego fueron reemplazadas por otras herramientas como Mixpanel, que a través de Segment es alimentado con información de lo que hacen los usuarios de Edutive dentro de la plataforma, pudiendo tener información mucho más detallada del comportamiento de los usuarios en gráficos más claros y amigables.
Tener la información en Mixpanel permitió paneles de reportes para las diferentes áreas de la empresa, y poder hacer seguimientos específicos de algunos flujos de la plataforma con el fin de detectar problemas y puntos de mejora.
De todas formas, el panel de administración interno siguió siendo de utilidad, ya que si bien dejó de utilizarse como herramienta de reportes, permitía gestionar de forma manual las cuentas de Edutive y sus suscripciones sin necesidad de la intervención de alguien del área de sistemas.
Debido a que es un panel interno al que sólo tienen acceso unas pocas personas, no se priorizó en ningún momento la calidad de la interfaz y la experiencia del usuario. Se utilizó la misma página de login de los usuarios regulares, agregando un tono sepia en la imagen para distinguirla con facilidad.
Dentro del panel se listan sólo dos secciones: Cuentas y Clientes. Las cuentas representan a las academias creadas en la plataforma, y los clientes a los usuarios registrados en Edutive. La plataforma esta pensada para que una academia pueda tener más de un administrador, e incluso que una misma persona pueda administrar más de una academia. De todas formas esta funcionalidad no se utilizó nunca, por lo que en la práctica existe una relación 1 a 1 entre academias y usuarios.
En la sección de cuentas se listan los nombres de las academias, el usuario administrador, el plan actual, entre otra información útil. En la última columna se muestran las acciones posibles:
- Editar cuenta: permite cambiar la información de la academia, puntualmente útil para modificar el plan de una academia manualmente
- Borrar cuenta: esto hace un borrado lógico de la academia, permitiendo limpiar principalmente algunas cuentas que fueron utilizadas a modo de prueba
- Impersonificarse: el icono del “ojo” permite iniciar sesión en una cuenta como si se fuese el administrador de dicha academia. Esto permitía ayudar a una academia cuando se encontraba con algún error o algún problema de configuración, permitiendo acceder a su cuenta sin necesidad de conocer sus credenciales. A medida que el software se fue haciendo más robusto, comenzó a bajar la necesidad de acceder a las cuentas.
En la sección de clientes se listan los emails de los usuarios, el estado de la cuenta e información relacionada a su suscripción en Stripe. Esta pantalla está particularmente desordenada debido a que fue mutando según las necesidades que iban surgiendo.
Por ejemplo, se comenzó a registrar prospectos de Edutive desde la pantalla de registro, para capturar a los usuarios que dejaban su correo electrónico y no completaban su registro en la plataforma, y se comenzaron a listar estos prospectos en esta misma sección. También se comenzó a cobrar un porcentaje de las ganancias de las academias a determinados clientes, por lo que dicha información era accesible desde esta sección para poder generar una factura de forma manual, adicional a la factura de la suscripción.
En líneas generales, casi todo lo que se puede hacer desde esta sección también se puede realizar dentro del panel de Stripe, ya que la plataforma estaba conectada con Stripe y el estado de las cuentas se actualiza de forma automática acorde al pago. Sin embargo resultaba útil poder vincular manualmente algunas cuentas a un plan de Stripe para casos especiales.
Integraciones con Zapier y Make
Si bien se implementaron algunas integraciones nativas con diferentes plataformas como Thinkific, el esfuerzo de implementar y mantener estas integraciones era algo insostenible para la empresa. De todas formas era indispensable que para que los clientes utilicen Edutive como core de su negocio, puedan complementar las funcionalidades faltantes con las plataformas de su preferencia. Por este motivo se decidió desarrollar una integración de Edutive con Zapier, de forma que se pueda conectar Edutive con las miles de plataformas ya integradas en este sistema.
Zapier es una plataforma que permite automatizar flujos permitiendo realizar conexiones entre dos o más plataformas. Para ello se debe seleccionar un disparador (o trigger) de una de las plataformas, y conectarla con acciones en otras, pudiendo enviar información entre ellas. Para poner un ejemplo, se podría conectar una cuenta de Stripe y una de Google en Zapier, de forma que cuando ocurra un pago en la cuenta de Stripe, se envíe la información del pago a una hoja de cálculo de Google y se cargue la información en determinadas columnas.
Para esta integración fue necesario desarrollar APIs en Edutive que puedan ser utilizadas desde la implementación de Zapier. Adicionalmente, fue necesario implementar una API de autenticación básica para que los usuarios puedan cargar sus credenciales de Edutive en Zapier y conectar su cuenta en dicha plataforma.
Los disparadores que se implementaron fueron los siguientes:
- Nuevo carrito abandonado
- Nuevo contacto
- Nuevo curso
- Nueva descarga de un programa
- Nueva suscripción
- Nueva suscripción cancelada
- Nuevo pago recurrente
- Nueva transacción
La única acción implementada fue la de crear un contacto dentro de Edutive, ya que en la mayoría de los flujos más requeridos para automatizar, el disparador resulta ser Edutive y las acciones son registradas en otras plataformas.
De esta forma, una academia puede automatizar diferentes flujos. Algunos ejemplos de automatización utilizados por los clientes son:
- Al registrar una transacción exitosa, dar el alta del alumno al curso en Teachable
- Al registrar una descarga un programa, agregar al prospecto a una lista de Hubspot
- Al registrar un carrito abandonado, enviar un correo con MailChimp para que retome la compra
- Al registrar un nuevo pago recurrente, cargar dicho pago en la hoja de cálculo de Google que registra los ingresos
- Al registrar una nueva suscripción cancelada, dar de baja al alumno del curso en Thinkific
Algunos de los disparadores también cuentan con algunos filtros, de forma de hacer más óptimos los Zaps y no tener que disparar flujos innecesarios para ser filtrados en posteriores acciones. Por ejemplo, para el disparador de una nueva transacción, es posible filtrar por estado de la transacción (y quedarse solo con las exitosas), por un curso, una edición o un precio.
Además de Zapier, se realizó la integración con otra plataforma muy similar llamada Make (formalmente llamada Integromat) por pedido de algunos clientes de Edutive, ya que encontraban esta plataforma como una alternativa más económica que Zapier.
Debido a que las APIs ya fueron implementadas para Zapier, sumar Edutive a Make requirió de un esfuerzo mínimo y se pudieron agregar los mismos disparadores y acciones.
APIs
Si bien inicialmente se desarrollaron las APIs en Edutive con el fin de integrar Zapier, luego se expuso la posibilidad de que los clientes puedan utilizar las APIs de forma directa. Con este fin, se agregó una autenticación a través de Bearer, y se proveyó a todos los clientes de un token en su perfil de usuario para que puedan hacer uso de las APIs con su academia.
Las APIs implementadas son muy similares a las que ya se mencionaron en Zapier, por lo que no amerita volver a repetirlas. La principal diferencia radica en que dentro de Edutive existe el concepto de Ordenes, que son registros de las personas que iniciaron el proceso de compra y que luego pueden ser completadas y generar una transacción. En cambio, dentro de Zapier se especifican sólo las ordenes que pasan a un estado diferente luego de un período de tiempo en el que no son completadas, llamandose carritos abandonados con el fin de facilitar la comprensión de su significado.
Adicionalmente se generó una documentación con una librería de Laravel para que los usuarios puedan acceder a la información de las APIs, los parámetros existentes y los ejemplos de las responses desde su navegador accediendo a una url específica. En esta página también es posible descargar las colecciones para Postman, y copiar un ejemplo de request en bash y en javascript.
Design system
Durante el desarrollo del software se le comenzó a dar cada vez mayor importancia al diseño y a la experiencia del usuario, de forma que surgió la idea de desarrollar un Design System propio, y que este sea transversal al panel de administración, al sitio web y al panel de estudiantes.
Dentro de desarrollo, esto implicó el desarrollo de un nuevo proyecto que agrupaba la implementación de los diferentes componentes a utilizar dentro de los diferentes proyectos de la plataforma, haciendo que sea necesario importarlo como una dependencia en cada uno.
El diseño de cada uno de los componentes fue desarrollado en Figma por la persona encargada del diseño. A continuación se muestran sólo algunas capturas del proyecto en Figma.