← Volver a proyectos

CLA-Kahoot – Plataforma de cuestionarios interactivos

Aplicación web para la creación y ejecución de cuestionarios interactivos en tiempo real con enfoque en gamificación educativa

  • React
  • Firebase
  • Tailwind CSS
CLA-Kahoot – Plataforma de cuestionarios interactivos

Sobre el proyecto

CLA-Kahoot es una aplicación web tipo Single Page Application (SPA) orientada a la creación y ejecución de cuestionarios interactivos en tiempo real, con un enfoque en gamificación, evaluación inmediata y sincronización multiusuario.

El frontend fue desarrollado con React y Tailwind CSS, priorizando una interfaz responsiva, clara y optimizada para distintos contextos de uso (móvil, escritorio y proyección). El backend se apoya en Firebase / Firestore como Backend as a Service (BaaS), eliminando la necesidad de infraestructura propia y permitiendo actualización de datos en tiempo real mediante listeners.

La plataforma gestiona sesiones activas de cuestionarios, temporizadores por pregunta, recolección de respuestas y cálculo dinámico de rankings, ofreciendo retroalimentación inmediata a los participantes y una experiencia fluida para el moderador.

Arquitectura del sistema

  • Frontend: SPA en React con manejo de estado para preguntas, temporizador, progreso del usuario y ranking.
  • Base de datos: Firestore como base de datos NoSQL para cuestionarios, sesiones, respuestas y resultados.
  • Tiempo real: Sincronización instantánea mediante listeners de Firestore para mantener consistencia entre todos los clientes conectados.
  • UI: TTailwind CSS bajo un enfoque utility-first para escalabilidad y mantenibilidad del diseño.

Características técnicas

Sincronización en tiempo real

Sincronización en tiempo real de estado global del cuestionario.

Gestión de estado en React

Control preciso del temporizador por pregunta.

Ranking dinámico

Cálculo automático de puntuación considerando exactitud y tiempo de respuesta.

Diseño responsivo

Diseño responsive optimizado para distintos dispositivos y pantallas compartidas.

Tecnologías utilizadas

React

Componentes reutilizables, manejo de estado y renderizado eficiente.

Firebase / Firestore

Persistencia de datos, sincronización en tiempo real y escalabilidad sin backend propio.

Tailwind CSS

Framework utility-first para una UI moderna, accesible y mantenible.