Módulo de lección · Detalle

Defensa celular – Conway contra la invasión

Este módulo combina autómatas celulares, modelado de estados y mecánicas simples de juego en un prototipo funcional HTML/CSS/JS. El foco está en cómo reglas locales, estructuras de datos y extensiones paso a paso conducen a una lógica de juego comprensible.

Tiempo 180 minutos
El prototipo existente crea un punto de partida común donde los estados, reglas y extensiones pueden seguirse inmediatamente. De esta manera, no se trata de configurar un proyecto, sino que el razonamiento y la prueba dirigidos a cambios de código toman protagonismo. Codificación con IA
Idioma HTML
Prueba en línea Demo
Imagen previa: Defensa celular – Conway contra la invasión

Formato del curso

Prototipo primero con codificación por IA

El módulo está integrado en un formato de Prototipo Primero: El punto de partida es un prototipo ya funcional, que se desarrolla posteriormente en pasos de desarrollo claros. El Codificación con IA-apoyo está integrado didácticamente como una herramienta para cambios dirigidos, explicación de errores y desarrollo verificable del estado actual del proyecto.

Desarrollo estructurado

El prototipo existente crea un punto de partida común donde los estados, reglas y extensiones pueden seguirse inmediatamente. De esta manera, no se trata de establecer un proyecto, sino más bien de razonar y probar cambios de código de forma dirigida.

Uso didáctico de la inteligencia artificial

Aquí, el KI-Coding se entiende como un apoyo contextualizado que toma en cuenta archivos, funciones y objetivos visibles existentes. Para la enseñanza, esto crea un marco donde las solicitudes, cambios y versiones pueden reflejarse de forma profesional y conectarse con resultados inmediatamente testables.

Clasificación didáctica

El módulo está clasificado de manera compacta tanto profesional como prácticamente para la enseñanza.

Establecimiento profesional de objetivos

En el centro se encuentra la modelización de una cuadrícula, cuyo estado se describe mediante listas, claves de coordenadas y objetos simples. Las reglas de Conway conducen a cálculos locales del vecindario y están conectadas con estados de juego, energía, movimiento del oponente y reconocimiento de patrones en una simulación que crece paso a paso.

Desarrollo de competencias

  • Pensamiento algorítmico: Conteo de vecindarios, transiciones de estado y reglas simples de movimiento se implementan sistemáticamente.
  • Modelado de datos: Cuadrícula, núcleo, células vivas, oponentes y patrones se representan mediante estructuras de datos adecuadas.
  • Pruebas y reflexión: Cada extensión permanece vinculada al comportamiento visible y puede ser verificada inmediatamente.
  • Trabajo posterior estructurado: El prototipo se amplía en hitos claramente definidos sin perder de vista la lógica subyacente.

Valor añadido para el docente

  • El punto de partida ejecutable reduce las barreras de entrada y crea espacio para el análisis, la variación y la expansión.
  • La secuencia de tareas apoya una organización clara de la lección con resultados intermedios verificables.
  • Extensiones como la biblioteca de patrones, oleadas de enemigos o temporizador permiten diferenciar mediante objetivos adicionales vinculados al contenido del tema.

Flujo de lección

Las tareas se presentan en el orden del JSON y están didácticamente organizadas.

1

La pantalla inicial y el estado del juego complementan entre sí.

Este paso introduce un modelo de estado explícito al separar la preparación, la simulación en curso y la pausa. Esto crea una base para asignar posteriormente funciones como oleadas, temporizador y fin del juego de forma lógica.

2

Celdas con límites de energía

La colocación libre de celdas está limitada por un modelo de recursos. Esto hace claro cómo las variables para valores máximos, reembolsos y reglas de reinicio están consistentemente vinculadas a la interacción en retícula.

3

Preparar la biblioteca de patrones para formas celulares estables

La biblioteca de patrones convierte formas celulares como bloque, tubo, barco y panal en una estructura de datos explícita. El paso vincula patrones visuales con retículas 0/1 y prepara bloques reutilizables para lógica posterior de colocación y reconocimiento.

4

Insertar patrones celulares terminados con un clic

Los patrones preparados se convierten en una acción de retícula verificada. Límites, campos ocupados, núcleo, enemigos y costos energéticos muestran claramente cómo los inputs se validan antes de cambios de estado.

5

Expandir datos de enemigos y preparar oleadas

Los enemigos se desarrollan de placeholders fijos a objetos estructurados con propiedades como vida, velocidad o símbolo. Una función de oleada prepara situaciones de juego repetibles y fortalece la comprensión de las listas de objetos creados.

6

Mover enemigos hacia el núcleo

El movimiento de los enemigos introduce una lógica de objetivo simple sobre el raster. Por ronda, se cambia una coordenada para que la distancia al núcleo disminuya y la simulación sea más dinámica.

7

Reconocer bloque 2x2 como patrón escudo

El escáner se amplía de retroalimentación general a reconocimiento de patrones dirigido. El bloque estable 2x2 es adecuado para profundizar las relaciones vecinales y el recorrido sistemático del raster.

8

Reconocer línea de 3 como patrón impulso

El reconocimiento de patrones se amplía con líneas horizontales y verticales. Comparar múltiples tipos de patrones ayuda a distinguir procedimientos similares de prueba y hace que la lógica del escáner sea más diferenciada.

9

Marcar patrones como celdas defensivas

Los patrones reconocidos reciben una representación visible propia sin reemplazar la evolución normal de las celdas. Esto afina la separación entre estado básico y estado derivado.

10

Implementar ataques simples de torres

Los patrones marcados como defensivos reciben efectos en el sistema de juego por primera vez. Una regla deliberadamente simple de alcance y daño muestra cómo una estructura reconocida se convierte en una acción algorítmica.

11

Ganar energía mediante patrones defensivos activos

El sistema de energía se vincula con la defensa exitosa mediante esto. Esto crea un bucle de retroalimentación comprensible de colocación, efecto, impacto y retorno limitado de energía.

12

Se añaden daños al núcleo y el juego termina

El núcleo recibe puntos de vida y, por lo tanto, una condición clara de pérdida. El paso hace evidente cómo las colisiones o el logro del objetivo enemigo se traducen en daño, distancia y parada de la simulación.

13

Mostrar puntos y progreso de oleadas

Los puntos y el progreso de oleadas añaden retroalimentación visible sobre acciones exitosas. La dificultad creciente tras completar oleadas conduce a una lógica de progresión simple.

14

Añadir rondas automáticas con un temporizador

La evolución manual se amplía mediante un mecanismo de inicio-paro con ritmo fijo. Esto hace profesionalmente visible la diferencia entre el control paso a paso y la simulación automatizada.

15

Mejorar dificultad, animaciones y vista móvil

La conclusión agrupa ajustes finos de funcionamiento, retroalimentación visual y presentación en pantallas estrechas. La función profesional radica en considerar la calidad técnica y la usabilidad como parte de un proyecto completado.

Fragmento de código

El fragmento muestra el núcleo profesional del componente: a partir de reglas locales de vecindad, se genera el estado siguiente de la cuadrícula celular.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
function contarVecinosVivos(x, y) {
  let cantidad = 0;
  for (let dy = -1; dy <= 1; dy = dy + 1) {
    for (let dx = -1; dx <= 1; dx = dx + 1) {
      if (dx !== 0 || dy !== 0) {
        if (istLebendig(x + dx, y + dy)) {
          anzahl = anzahl + 1;
        }
      }
    }
  }
  return anzahl;
}
function evolutionAusfuehren() {
  const naechsteZellen = [];
  for (let y = 0; y < hoehe; y = y + 1) {
    for (let x = 0; x < breite; x = x + 1) {
      const nachbarn = lebendeNachbarnZaehlen(x, y);
      const lebendig = istLebendig(x, y);
      if (lebendig && (nachbarn === 2 || nachbarn === 3)) naechsteZellen.push(schluessel(x, y));
      if (!lebendig && nachbarn === 3) naechsteZellen.push(schluessel(x, y));
    }
  }
  lebendeZellen = naechsteZellen;
}
Las reglas de celda, patrones y estados del juego se conectan gradualmente para formar una simulación comprensible.

Este módulo proporciona una estructura clara de tareas para la organización de lecciones, análisis de código y verificación de resultados. Es posible diferenciar mediante extensiones como biblioteca de patrones, oleadas enemigas, temporizador o mejoras de visualización.

Solicitar acceso demo y probar el módulo en tu propio contexto de curso.