Trabajamos junto con el centro de investigación MIK de la Universidad de Mondragón para digitalizar por completo su herramienta de triple impacto. El principal reto de este proyecto consistía en crear un cuestionario ad-hoc, dividido en múltiples pasos, que permitiese a cada empresa evaluar de forma sencilla su desempeño ambiental, social y de gobernanza. El resultado final se representa de forma gráfica en la web y, además, se genera un PDF que se envía automáticamente por email, lo que hace que la experiencia sea completa en todos los sentidos.

Además de toda la lógica funcional, nos encargamos del diseño completo de la landing, así como de toda la experiencia de usuario del cuestionario y de la visualización de resultados. Diseñamos las gráficas, los indicadores y las transiciones entre pasos, creando una interfaz clara, estética y totalmente responsive. Todo el sistema visual sigue la identidad corporativa de MIK Mondragón y las directrices proporcionadas por su equipo, asegurando coherencia, accesibilidad y una experiencia agradable de principio a fin.

Para la creación del formulario multi-step utilizamos Formly, lo que nos permitió construir un flujo ordenado y totalmente adaptado a la metodología de MIK. Esto permite al usuario avanzar paso a paso, completando cada bloque del cuestionario, mientras sus respuestas se van codificando en la propia URL mediante urlParams.

En la página de resultados, el sistema lee los parámetros incluidos en la URL y los cruza automáticamente con los datos almacenados en Google Sheets, donde se encuentran las referencias y las medias sectoriales. A partir de ahí, Google App Scripts procesa toda la información y realiza los cálculos correspondientes. Finalmente, se renderiza el informe completo, incluyendo gráficas de barras, indicadores porcentuales de colores y comparativas sectoriales que permiten al usuario entender de un vistazo dónde se sitúa su empresa en cada temática de triple impacto.

Para completar la experiencia usamos Printable.js para generar el PDF. Su función es capturar el HTML completamente renderizado, prepararlo para impresión y enviarlo a una función serverless alojada en Vercel. A continuación, conecta con Resend, que envía el archivo por correo electrónico al usuario como adjunto, cerrando así un flujo totalmente automatizado y sin intervención manual.

Durante todo este proceso nos hemos apoyado en Cursor AI para ir generando los archivos JS que finalmente hemos alojado en Netlify.

El resultado final es una herramienta robusta y completamente digitalizada, capaz de guiar a cualquier empresa a través del proceso de evaluación ESG, mostrarle de forma visual y precisa sus resultados y entregarle un informe profesional en cuestión de segundos. Una experiencia integral que combina metodología, diseño y tecnología para hacer que un proceso complejo se sienta simple.

‍