AI game creator

Click here for free DL of the app version that can save data.

No:42910

←

Prev Next

→

Generative Art
Developer User19015｜Date and time 24/2/13 12:16:24
Build time 6.683 sec｜Game capacity 2.1KB｜

Script

Sure! Here's an example of a simple generative art game implemented as a single HTML file using JavaScript and enclosed in script tags:

In this game, each frame of the animation generates a random shape (either a circle or a rectangle) with a random position and color. The canvas is continuously cleared and the game loop is called repeatedly using the `requestAnimationFrame` method. This creates an animated generative art experience. You can open this file in a web browser on your smartphone to play the game and see the generative art in action.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

Click here for free DL of the app version that can save data.

Sure! Here's an example of a simple generative art game implemented as a single HTML file using JavaScript and enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Generative Art Game</title>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas"></canvas>

// Game logic
    function gameLoop() {
      // Clear canvas
      context.clearRect(0, 0, width, height);

// Generate random positions and colors
      const xPos = Math.random() * width;
      const yPos = Math.random() * height;
      const red = Math.round(Math.random() * 255);
      const green = Math.round(Math.random() * 255);
      const blue = Math.round(Math.random() * 255);

// Draw a random shape at the random position and color
      context.fillStyle = `rgb(${red}, ${green}, ${blue})`;
      const shape = Math.random() > 0.5 ? "circle" : "rectangle";
      if (shape === "circle") {
        const radius = Math.random() * 50;
        context.beginPath();
        context.arc(xPos, yPos, radius, 0, Math.PI * 2);
        context.fill();
      } else {
        const width = Math.random() * 100;
        const height = Math.random() * 100;
        context.fillRect(xPos, yPos, width, height);
      }

// Call game loop again
      requestAnimationFrame(gameLoop);
    }

// Start the game
    gameLoop();
  </script>
</body>
</html>
```