Cómo se creó “Atrapa el Gato ” con IA

Los videojuegos pueden ser una forma de aprendizaje, especialmente cuando se trata de habilidades necesarias en la vida real. “Atrapa el Gato” es un ejemplo de un juego que requiere reflexión y estrategia para tener éxito. En este juego, debes evitar͏ tocar las paredes en movimiento mientras atrapas al gato. Es simple, pero necesita concentración ͏y reacción rápida. Además, muchos otros juegos dan a los jugadores una posibilidad para pensar sobre lo que necesitan hacer siguiente. Esto puede ayudar a mejorar las habilidades de decisión y͏ estrategia en contextos fuera del juego.  

No todos ͏los tipos de videojuegos son buenos para el aprendizaje; algunos pueden ser ͏demasiado agresivos o confusos͏. Por lo ͏tanto, es importante seleccionar bien los juegos que queremos jugar. Jugar un ͏poco es bueno, pero no debemos obsesionarnos con ellos. Los juegos de vídeo pueden ser una forma de aprendizaje͏, sobre todo cuando se trata de destrezas que͏ necesitamos en la vida diaria. 

La inteligencia artificial ha transformado todo desde que llegó y se pudo implementar en nuestra vida cotidiana, como en la medicina y el entretenimiento. Una de las novedades más destacadas a resaltar es que puede ser usada para la creación o recreación de videojuegos de entretenimiento o serios. El juego “Atrapa el gato”, un juego de estrategia donde debes evitar que el gato se escape encerrándolo, pero cuidado que es muy inteligente. 

Este juego no solo demuestra cómo se utiliza la IA para ofrecer una experiencia de juego desafiante sin la necesidad de intervención del ser humano. Este artículo busca destacar como se puede usar cualquier inteligencia artificial para la creación del código por medio de promts para la programación y diseño. 

“Atrapa el gato” como videojuego serio 

En este juego, debes͏ hacer cuidado con tocar las paredes en movimiento mientras atrapas al gato. Es sencillo, pero puede͏ requerir atención y reacción rápida. También, muchos otros juegos dan a los jugadores una chance para pensar sobre lo que necesitan hacer después. Esto puede ayudar mejorar las habilidades decisión y estrategia en contextos ͏fuera del juego. No todos los tipos de videojuegos son buenos para͏ aprendizaje; algunos pueden ser muy agresivos o confusos. Por eso es ͏importante escoger bien lo que queremos ͏jugar͏. Jugar un poco está bien pero no debemos obsesionarnos con ellos.͏  

Los videojuegos han cambiado desde sencillas formas de divertirse͏ hasta herramientas con finalidades didácticas, simulaciones y preparación ocupacional. Dentro de este cambio los͏ juegos serios han͏ obtenido͏ una importancia grande en varios campos, incluyendo la enseñanza, la salud y el estudio. A diferencia de los videojuegos juegos viejos cuyo͏ fin principal es la diversión. Los videojuegos serios tratan de crear ͏un efecto en el aprendizaje la elección de acciones y adquirir habilidades concretas. Estos juegos están hechos para un objetivo fuera del pasatiempo. Son usados en áreas como la salud para entrenar médicos, en escuelas para enseñar de manera activa, y hasta en mentes humanas para ayuda͏ cognitiva. Su foco es enseñar y practicar destrezas dando lugares donde los jugadores pueden vivir cosas del mundo verdadero con seguridad y control.͏ 

¿Como funciona?

El uso de juegos en los procesos de aprendizaje ha ͏mostrado ͏ser una manera efectiva para mantener la energía y atención de los jugadores logrando ͏hacer que aprender sea más activo y útil.͏ “Atrapa el Gato” como un juego serio. En esta categoría de juegos está “Atrapa el Gato”, que aunque tiene un diseño simple, se vuelve͏ una buena ayuda para el crecimiento del pensamiento estratégico. En este juego, el jugador debe rodear a un gato en una cuadrícula antes que escape, lo que necesita planear, tomar decisiones de prisa y ver patrones. ͏ ͏ Lo que hace que “Atrapa el Gato” sea un juego serio es su habilidad para ayudar a desarrollar habilidades mentales importantes. Cada acción en el juego requiere pensar en la mejor forma de rodear al enemigo, lo que promueve la capacidad del jugador para analizar. ͏ 

Funcionamiento con Inteligencia artificial 

Aparte, en la versión hecha con ͏inteligencia artificial,͏ el oponente (el gato) no sigue un ͏camino fijo, sino que cambia según los movimientos del jugador, haciendo͏ que la͏ experiencia sea aún más ͏difícil. La adición de͏ IA al juego no solo mejora cómo se juega sino que también muestra como inteligencia artificial puede ayudar para hacer video juegos serios que apoyen despabilarse y mejora de͏ destrezas cognitivas.͏ En resumidas cuentas, “Atrapa el Gato” es un buen ejemplo de cómo los juegos serios no solo sirven para divertirse, sino que también son útiles para aprender y crecer. Gracias a su forma de jugar, que se basa en pensar bien y resolver problemas, este juego deja que las personas utilicen su cerebro mientras viven una experiencia que es difícil, pero al mismo tiempo novedosa. ͏͏ ͏ 

La Inteligencia Artificial como Instrumento de Desarrollo para el videojuego “Atrapa al gato” ͏ ͏ 

La frase sugiere que los juegos han necesitado el esfuerzo de varios expertos, como codificadores, diseñadores, artistas y otros profesionales, para hacerse y funcionar. Pero con el progreso de programas de inteligencia artificial como ChatGPT, Copilot y otros, ahora hay una nueva opción en el desarrollo de los͏ juegos: la habi͏l͏id͏ad de la IA para crear código,͏ arreglar problemas, y hacer mejor el uso para el usuario en forma automática y rápida. ͏ 

En͏ el juego “Atrapa͏ el gato”, la IA no solo crea las bases del ͏juego, sino que también fija las reglas del juego ͏y ajustó ͏cuán ͏difícil es la prueba que controla al opositor con un poco de ayuda de la mano humana, incluso por parte de alguien sin muchas habilidades en programación, la IA deja mejorar cómo jugamos, haciendo que el rival se mueva de forma estratégica y dura. 

ChatGPT tuvo un papel importante en este proceso, porque no solo hizo partes de código en varios lenguajes de programación, sino que además encontró fallos, dio ideas para arreglarlos y trajo mejoras en cómo el oponente tenía que actuar y hacer elecciones dentro del juego. Con esta herramienta, el hacer juegos se vuelve más fácil, dejando que personas con poco o ningún saber en programación puedan hacer experiencias interactivas más ágil y simple.͏ 

Visual Studio Code ͏es un ambiente͏ importante de desarrollo. 

Para poner en funcionamiento el código arrojado por ChatGPT se hizo uso Visual Studio Code, en un entorno de desarrollo integrado (IDE) que nos deja escribir, probar y corregir programas con facilidad.͏ Su capacidad de trabajar con varios lenguajes, simplicidad de uso y muchas͏ extensiones los hacen una buena opción para crear videojuegos serios con inteligencia artificial.͏ ͏ ͏ 

“Atrapa͏ el gato” es hecho con un idioma de programación para juegos interactivos y serios que ayuden a la habilidad de pensamiento y estrategia, de una manera fácil pero compleja a su vez. La inteligencia crea caminos de movimiento casi imposibles de adivinar, ͏lo que pide͏ a los jugadores de ͏hacer planes y͏ habilidades͏ buenas para analizar antes de que el gato escape.͏

 

Para que el juego fuera accesible y funcional para los lectores en el artículo, se utilizó la plataforma Gibhub como repositorio y medio de distribución. el videojuego fue subido a la plataforma para luego integrarlo directamente en la página a través de un Shortcode con la etiqueta <iframe>. De esta manera los usuarios pueden interactuar de manera directa con el videojuego sin descargar enlaces externos, asegurando así su funcionalidad fácil y fluida.

Funcionalidad del Juego “Atrapa al gato” con IA

El objetivo del juego “Atrapa al Gato” es evitar que el gato (representado por una celda roja) escape del tablero. Para lograrlo, debes hacer clic en las celdas del tablero para bloquearlas (representadas por celdas grises). A medida que bloqueas celdas, el gato intentará moverse hacia una celda adyacente que no esté bloqueada. El juego termina cuando el gato no puede moverse más (has ganado) o si el gato llega al borde del tablero (has perdido). 

Explicación del Código  

La explicación presentada a continuación fue arrojada por la inteligencia artificial al momento de pedirle la realización el código y la explicación de cada código utilizado para la implantación del videojuego serio. Además de dar el código necesitado, la IA también explicó qué hace cada parte del código. Esta información es muy importante para entender la forma de pensar detrás del código del juego, haciendo fácil su revisión, cambio y mejora. Con este proceso, se puede arreglar la forma del juego, quitar errores y hacer cambios que mejoran lo que vive el usuario; así se tiene un avance más rápido͏ y simple.͏ 

Jugabilidad 

• Tablero: El juego se desarrolla en un tablero de 7×7 celdas. 

• Celdas: Las celdas pueden estar en uno de tres estados: libre, bloqueada o con el gato. 

• Movimiento: El gato se mueve automáticamente a una celda adyacente libre después de cada acción de bloqueo, arriba, abajo izquierda, derecha, diagonales. 

• Objetivos: Ganar, bloquear todas las posibilidades de rutas de escape para el gato. 

El desarrollo del juego “Atrapa el Gato” se estructuró en HTML, CSS y JavaScript. Se presenta una descripción de la funcionalidad de cada componente: 

• Estructura HTML:  

• <head> Configura el título de la página, el conjunto de caracteres, la vista y los estilos con TailwindCSS. 

• <style> Define los estilos personalizados para la apariencia del juego, incluyendo el fondo, el color de las celdas y los mensajes de felicitación y derrota. 

• <body> Contiene el contenedor principal del juego y los mensajes de estado (felicitaciones y derrota). 

• JavaScript:  

• DOMContentLoaded Espera a que el DOM esté completamente cargado antes de ejecutar el código. 

• gameSize Define el tamaño del tablero (7×7). 

• gameContainer Referencia al contenedor del tablero en el HTML. 

• congratulationsMessage y gameoverMessage Referencias a los mensajes de felicitación y derrota en el HTML. 

• catPosition Posición inicial del gato en el tablero (centro). 

• Funciones:  

• createBoard() Reinicia y crea el tablero, agrega las celdas y los eventos de clic. 

• addRandomObstacles() Añade celdas bloqueadas aleatoriamente al inicio del juego para aumentar la dificultad. 

• updateCatPosition() Actualiza la posición del gato en el tablero. 

Creación del videojuego “Atrapa al gato” 

Para facilitar la interacción con la inteligencia artificial, es fundamental ser claro en cada promt proporcionando indicaciones específicas. Para darle contexto a la IA se puede indicar lo que se desea al crear un código utilizando HTML, CSS y JavaScript, ya que estos tres lenguajes son esenciales para el diseño y la funcionalidad del programa para luego aclarar que no se tiene experiencia en codificación y que, para cada modificación o actualización que se solicite, deseas recibir todo el código completo. De esta manera, no se tendrán que realizar cambios manuales, sino que simplemente se pueden copiar y pegar el nuevo código en el editor de programación. Ya con esto sólo queda interactuar con la IA especificando de qué tratará el videojuego, sus funciones, acciones, condicionales y para un mejor resultado se puede aclarar la apariencia a la que se desea llegar del videojuego. 

---

---

Conclusiones 

La inteligencia artificial en la creación de videojuegos 

La implementación de IA en la programación del videojuego ofrece oportunidades únicas e innovadoras para desarrollar juegos sin requerir habilidades avanzadas en programación 

La introducción de IA en la creación de videojuegos serios ofrece oportunidades únicas y originales para realizar juegos sin experiencia o habilidades de programación. Con la ayuda de herramientas como ChatGPT, las personas pueden generar códigos de maneras mas sencillas, ahorrando tiempo y haciendo mas fácil la prueba de nuevos modos. Esto hace que el desarrollo de crear o recrear videojuegos sea de una manera mas asequible para los no programadores con mayor libertad de explorar diseños del juego. 

Visual Studio Code como herramienta en el proceso de desarrollo 

El uso de Visual Studio Code favorece la realización de juegos, crea una buena incorporación para la programación con la inteligencia artificial, que ayuda a escribir y arreglar el código. Aquí, por medio de ChatGPT, lo que permite es una implementación rápida y accesible para todos, bajando la barrera de que crear videojuegos es difícil y no es para los no programadores. También, su unión con muchas extensiones y su ambiente amigable mejoran el trabajo y cómo cuidan del código, dando una experiencia más viva y útil. ͏El uso de Visual͏ Studio͏ Code en el desarrollo del͏ juego facilita una integración eficiente con la inteligencia artificial. Esto soluciona el ser más ágil al escribir y arreglar los códigos mejorando la productividad y atención en el desarrollo, dando una experiencia mas dinámica y efectiva.  

Un juego que reta y enseña 

“Atrapa el Gato” remarca cómo los videojuegos pueden ayudar a ser una herramienta de estudios educativos, promoviendo varias habilidades como la estrategia y la toma de decisiones entre los jugadores. Su forma difícil anima a pensar lógicamente y mirar patrones, haciendo esto una vivencia activa que une placer con aprendizaje. Estos tipos de juegos no solo traen alegría, sino que también se pueden usar en lugares de enseñanza para ayudar con el desarrollo mental y animar el pensamiento crítico entre los jugadores. ͏͏ 

Créditos

Autor: Juliana Martinez Rodriguez

Editor: Magister ingeniero Carlos Iván Pinzón Romero

Código: UCVS-9

Universidad: Universidad Central

Fuentes

Bostrom, N. (2014). superinteligencia: Caminos, Peligros, Estrategias. Oxford University Press.Goodfellow, I., Bengio, Y., & Courville, A. (2016). Deep learning. MIT Press.

Ilustración de Dall-e. (febrero). Ilustración sobre el papel de la IA en los videojuegos [Imagen]. FOQUM. https://foqum.io/blog/ia-videojuegos-npcs-creacion-contenidos/

Martínez Rodríguez. J. (2025). Código del videojuego "Atrapa el gato" en VS Code [Imagen]. Archivo personal.

Martínez Rodríguez. J. (10 de marzo de 2025). Atrapa el Gato - Un Videojuego generado por IA .YouTube.https://www.youtube.com/watch?v=YXdoRJ6qw9M

Microsoft. (2023). Visual Studio Code: Features and extensions.Microsoft.https://code.visualstudio.com

Morales. E.(10 de abril de 2019). algunos-beneficios de los serious games en las empresas [Imagen]. https://fococonsultores.es/10-beneficios-de-los-serious-games-que-no-te-puedes-perder/

OpenAI. (2025). ChatGPT-4 [Modelo de lenguaje de IA]. https://openai.com

ReposteraGamer. (13 de diciembre del 2024). Inteligencia artificial en los videojuegos | ¿Error o acierto? | Pros y contras [Video]. YouTube. https://www.youtube.com/watch?v=EU9uNqi3aPU

Web del Maestro.(s.f.). Atrapa al gato. Web del Maestro. https://webdelmaestro.com/educacion/atrapa-al-gato/