AI game creator

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

No:31619

←

Prev Next

→

Generative Art
Developer User15207｜Date and time 23/12/27 23:08:59
Build time 18.808 sec｜Game capacity 2.357KB｜

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, generative art is created by randomly generating either rectangles or circles with random colors on the canvas. The game continuously generates new shapes in each frame, resulting in a dynamic and ever-changing artwork. The game loop is started as the script is executed, and it runs until the page is closed or refreshed. Feel free to customize the game to your liking by adding more rules, interactivity, or any other features that suit your idea of generative art!

←

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;
         display: block;
         margin: 20px auto;
      }
   </style>
</head>
<body>
   <canvas id="canvas"></canvas>

// Generate random colors
      function generateRandomColor() {
         var r = Math.floor(Math.random() * 256);
         var g = Math.floor(Math.random() * 256);
         var b = Math.floor(Math.random() * 256);
         return 'rgb(' + r + ',' + g + ',' + b + ')';
      }

// Generate random shapes
      function generateRandomShape() {
         var x = Math.random() * width;
         var y = Math.random() * height;
         var size = Math.random() * 100;

if (Math.random() < 0.5) {
            context.fillStyle = generateRandomColor();
            context.fillRect(x, y, size, size);
         } else {
            var radius = Math.random() * 50;
            context.beginPath();
            context.arc(x, y, radius, 0, Math.PI * 2, false);
            context.fillStyle = generateRandomColor();
            context.fill();
         }
      }

// Game loop
      function gameLoop() {
         context.clearRect(0, 0, width, height);

// Generate 10 random shapes per frame
         for (var i = 0; i < 10; i++) {
            generateRandomShape();
         }

requestAnimationFrame(gameLoop);
      }

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

Feel free to customize the game to your liking by adding more rules, interactivity, or any other features that suit your idea of generative art!