AI game creator

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

No:30689

←

Prev Next

→

Generative Art
Developer User14916｜Date and time 23/12/23 22:59:13
Build time 10.753 sec｜Game capacity 1.916KB｜

Script

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

This game creates unique generative art on a canvas, where a new randomized shape is generated every time the user touches the canvas on their smartphone. The canvas is cleared before drawing each new shape, creating an interactive generative art experience.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's 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="myCanvas" width="300" height="300"></canvas>

// Generate random colors for the generative art
    function getRandomColor() {
      const letters = '0123456789ABCDEF';
      let color = '#';
      for (let i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
      }
      return color;
    }

// Generate random positions for the generative art
    function getRandomPosition() {
      const x = Math.random() * canvas.width;
      const y = Math.random() * canvas.height;
      return { x, y };
    }

// Draw a randomized shape on the canvas
    function drawShape() {
      const { x, y } = getRandomPosition();
      const color = getRandomColor();

ctx.fillStyle = color;
      ctx.beginPath();
      ctx.arc(x, y, 20, 0, 2 * Math.PI);
      ctx.closePath();
      ctx.fill();
    }

// Capture touch events on smartphones
    canvas.addEventListener('touchstart', function(event) {
      event.preventDefault();
      const touch = event.touches[0];
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      drawShape();
    });

// Start the game by drawing the initial shape
    drawShape();
  </script>
</body>
</html>
```