AI game creator

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

No:31217

←

Prev Next

→

particle
Developer User15056｜Date and time 23/12/25 15:03:49
Build time 16.193 sec｜Game capacity 2.189KB｜

Script

Sure! Here's an example of a simple game implemented as a single HTML file, using JavaScript and enclosed within script tags. This game can be played on a smartphone and utilizes pictograms.

In this game, you control a particle represented by a blue circle on a canvas. You can move the particle using the arrow keys on your smartphone. The particle moves at a fixed speed and continues moving in the selected direction until another key is pressed. The canvas is cleared and the particle is redrawn in its new position every frame to create animation.

←

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 game implemented as a single HTML file, using JavaScript and enclosed within script tags. This game can be played on a smartphone and utilizes pictograms.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Particle Game</title>
  <style>
    #canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="canvas" width="400" height="400"></canvas>
  <script>
    const canvas = document.getElementById("canvas");
    const context = canvas.getContext("2d");

const particleSize = 10;
    const particleSpeed = 5;
    const particleColor = "blue";

let particleX = canvas.width / 2;
    let particleY = canvas.height / 2;

function drawParticle() {
      context.clearRect(0, 0, canvas.width, canvas.height);
      context.fillStyle = particleColor;
      context.beginPath();
      context.arc(particleX, particleY, particleSize, 0, Math.PI * 2);
      context.closePath();
      context.fill();
    }

function moveParticle(direction) {
      switch (direction) {
        case "up":
          particleY -= particleSpeed;
          break;
        case "down":
          particleY += particleSpeed;
          break;
        case "left":
          particleX -= particleSpeed;
          break;
        case "right":
          particleX += particleSpeed;
          break;
      }
    }

function handleKeyDown(event) {
      const arrowKeys = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
      if (arrowKeys.includes(event.key)) {
        event.preventDefault();
        moveParticle(event.key.replace("Arrow", "").toLowerCase());
      }
    }

document.addEventListener("keydown", handleKeyDown);

function gameLoop() {
      drawParticle();
      requestAnimationFrame(gameLoop);
    }

gameLoop();
  </script>
</body>
</html>
```