CSS, videojuegos e inteligencia artificial: la idea detrás de mi tesis
16 de junio de 2026
Cómo desarrollé un videojuego educativo de CSS con Godot, tecnologías web y retroalimentación asistida por inteligencia artificial.
Mi tesis de maestría se titula “Desarrollo de un videojuego educativo del lenguaje de hojas de estilo en cascada con evaluación de código mediante inteligencia artificial”.
La idea nació de una observación muy concreta: CSS suele ser difícil para quienes inician en frontend porque no basta con memorizar propiedades. Hay que entender cascada, herencia, especificidad, modelo de caja, selectores y comportamiento visual.
La propuesta
Desarrollé una demo funcional de un videojuego educativo 2D con estructura tipo metroidvania. El jugador explora, resuelve retos, usa un editor de CSS, crea munición basada en propiedades visuales y recibe apoyo contextual mediante Hemis, un asistente de inteligencia artificial.
El prototipo integró:
- Godot para la lógica del videojuego,
- tecnologías web para escribir y visualizar CSS,
- Node.js y Express.js como backend,
- Wallace CSS para análisis de código,
- modelos de lenguaje para retroalimentación educativa.
Resultados
La evaluación se realizó con 50 estudiantes de Ingeniería en Sistemas Computacionales. El promedio pasó de 5.84 en pretest a 8.12 en postest. La escala SUS obtuvo 81.4 puntos, una valoración favorable de usabilidad.
Más que un juego completo, el proyecto demuestra una posibilidad: usar videojuegos e IA para acompañar el aprendizaje sin sustituir el razonamiento del estudiante.