Insights Pro Report design + sample report
2022 - 2023
Get on Board
Ver sitio de muestra (landing)
🎁 ¿Qué es Insights Pro? - El Producto
Insights Pro es una poderosa herramienta creada por Get on Board que proporciona análisis detallados y estadísticas sobre los empleos publicados en su plataforma. Está diseñada específicamente para ayudar a las empresas a obtener información valiosa sobre la efectividad de sus empleos y tomar decisiones estratégicas para mejorar sus resultados.
🌟 Proyecto
Para comenzar la venta de Insights Pro, nos dimos cuenta de la necesidad de crear una versión pública y navegable del reporte, conocido como "Sample Report". El objetivo principal era compartir el producto con los usuarios de una manera más visual y accesible, lo que nos llevó a emprender el proyecto de integrar el Sample Report y el landing page en una sola web.
Objetivos:
Los objetivos clave del proyecto fueron los siguientes:
- Crear el Sample Report público: Desarrollar una versión del reporte que pudiera ser compartida con potenciales clientes y demostrar los beneficios y capacidades de Insights Pro.
- Diseñar una landing page atractiva: Crear una página de destino que incluyera el Sample Report junto con información relevante y de contacto para campañas de marketing y ventas.
- Mantener la agilidad en la edición y iteración: La landing page debía ser fácil de editar y permitir cambios rápidos para adaptarnos a las necesidades cambiantes del mercado y las demandas de los usuarios.
☀️ El proceso
El landing: desafíos con Tecnología y UX
Nos enfrentamos al desafío de iterar rápidamente y probar nuevo contenido de manera constante. Para superar este desafío implementé la landing en 11ty, un generador estático web, que permitía hacer cambios y deploys rápidos en un repositorio indepenidiente conectado a Netlify. Utilicé Nunjucjks para el templating y JavaScript para la funcionalidad.
Uno de los retos técnicos más importantes fue encontrar una solución efectiva para capturar los leads que llegaban a la landing page.
Desde un punto de vista de UX, necesitabamos mantener la experiencia del usuario similar a la de Get on Board, así que implementé pop-ups que permitían recopilar la información de contacto de los usuarios interesados. Esta parte del proyecto pasó por varias iteraciones, comenzando con un formulario externo conectado a automatizaciones a través de Zapier y finalmente utilizando los formularios del sistema interno de Get on Board para la recopilación de leads.
En el camino, pasamos por varias estrategias, como hacer el reporte visible solo después de que el usuario llenara su infomación o tener un link a un webinar explicando el producto para una secuencia de mail. Al final, logramos internalizar completamente la landing page en otro proyecto para mejorar la gestión de los leads.
En cuanto al contenido, a medida que avanzaba el proyecto, añadimos una explicación más larga y profunda del producto, sus características y sus variantes. Experimentamos con distintas formas de mostrar esta información y nos acercamos al objetivo con cada iteración.
El reporte: Generando Gráficos Dinámicos y Mejorando la Experiencia
Antes de la creación de esta landing page, el Sample Report existía únicamente en estructura. Para dar vida al reporte, desarrollé gráficos dinámicos utilizando la biblioteca de JavaScript D3. Estos gráficos se generaron a partir de archivos CSV extraídos de los datos de Get on Board, lo que permitió presentar información real de manera visualmente atractiva y comprensible. Los gráficos en D3 también se implementaron en la versión final del reporte ya en el codebase, con mejoras significativas en su presentación y capacidad de análisis.
Me preocupé por que los gráficos reflejaran tanto la identidad de Get on Board como el concepto de Insights Pro
En términos de diseño y estructura, nos esforzamos por garantizar una presentación clara y coherente con la información en el sample report. Establecimos secciones distintas para proporcionar una experiencia de usuario fluida. Además, nos aseguramos de que la información más relevante y los puntos clave del Sample Report estuvieran resaltados, utilizando elementos visuales como iconos y gráficos para transmitir de manera efectiva los datos y las estadísticas.
🧠 Aprendizajes
A lo largo de este proyecto, adquirí valiosos aprendizajes en términos de gestión de contenido, integración de tecnologías y diseño de experiencia de usuario. Aprendí a aprovechar las herramientas como 11ty, D3 y Netlify para crear una web dinámica y funcional, así como a implementar estrategias efectivas de captura de leads. También desarrollé habilidades en la interpretación y presentación visual de datos, utilizando gráficos y elementos visuales para transmitir información de manera clara y concisa.