AI game creator

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

No:37218

←

Prev Next

→

Running game
Developer User17028｜Date and time 24/1/20 19:44:31
Build time 10.642 sec｜Game capacity 3.241KB｜

Script

Unfortunately, as an AI text-based model, I cannot directly create or run HTML files or games. However, I can provide you with an example of how you can structure a simple game using HTML and JavaScript. You can then save the following code into an HTML file and run it in your browser.

This example creates a simple game where pictograms appear randomly on the screen, and the player needs to click on them to increase the score. If the player misses a pictogram, the game ends, and they can restart by clicking anywhere on the canvas.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Simple Game</title>
    <style>
      #game-container {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
      }
      #score {
        font-size: 24px;
        text-align: right;
        padding: 10px;
      }
    </style>
  </head>
  <body>
    <div id="game-container">
      <canvas id="game-canvas" width="400" height="400"></canvas>
    </div>
    <script>
      // Store game variables
      let score = 0;
      let gameOver = false;

// Get the canvas element and its 2D context
      const canvas = document.getElementById("game-canvas");
      const ctx = canvas.getContext("2d");

// Create an array of pictograms (replace with your own)
      const pictograms = [
        "🌞", "🌟", "⚽", "🍕", "🎮"
      ];

// Create a function to handle game logic and rendering
      function gameLoop() {
        // Clear canvas
        ctx.clearRect(0, 0, canvas.width, canvas.height);

if (gameOver) {
          // Game over message
          ctx.font = "40px Arial";
          ctx.fillStyle = "red";
          ctx.textAlign = "center";
          ctx.fillText("Game Over", canvas.width / 2, canvas.height / 2);
        } else {
          // Display current score
          ctx.font = "24px Arial";
          ctx.fillStyle = "black";
          ctx.textAlign = "right";
          ctx.fillText(`Score: ${score}`, canvas.width - 10, 30);

// Draw a random pictogram on the canvas
          const randomIndex = Math.floor(Math.random() * pictograms.length);
          const randomPictogram = pictograms[randomIndex];
          const x = Math.random() * (canvas.width - 50);
          const y = Math.random() * (canvas.height - 50);
          ctx.font = "50px Arial";
          ctx.fillStyle = "blue";
          ctx.fillText(randomPictogram, x, y);
        }
      }

// Event listener for canvas click
      canvas.addEventListener("click", function (event) {
        if (gameOver) {
          // Restart the game on click after game over
          score = 0;
          gameOver = false;
        } else {
          // Increase score by clicking on the pictogram
          const rect = canvas.getBoundingClientRect();
          const clickX = event.clientX - rect.left;
          const clickY = event.clientY - rect.top;

// Check if click was inside the pictogram
          if (clickX >= x && clickX <= x + 50 && clickY >= y && clickY <= y + 50) {
            score++;
          }
        }
      });

// Game update function
      setInterval(gameLoop, 1000 / 60); // 60 frames per second
    </script>
  </body>
</html>
```