AI game creator

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

No:41305

←

Prev Next

→

Obby Coaster
Developer User18502｜Date and time 24/2/6 21:57:12
Build time 16.522 sec｜Game capacity 4.498KB｜

Script

Sure! Here's an example of a simple game called "Obby Coaster" implemented as a single HTML file using JavaScript. Please note that this is a basic implementation to give you an idea of the structure and concept behind the game. You can customize and optimize the code as per your requirements.

Score: 0

In this game, you control a green square using the right and left arrow keys on your smartphone. Your objective is to avoid the red obstacles falling down from the top of the screen. The score increases as you successfully pass each obstacle. If you collide with an obstacle, the game ends, and your score is displayed. You can then restart the game by tapping the alert message. Note that this is a basic implementation, and you can enhance it further by adding additional features, levels, graphics, sounds, and optimizing the gameplay mechanics based on your preferences.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Obby Coaster</title>
    <style>
        body {
            text-align: center;
        }
        
        #gameCanvas {
            border: 1px solid black;
            margin: 0 auto;
        }
        
        #player {
            width: 50px;
            height: 50px;
            background-color: green;
            position: absolute;
            bottom: 0;
        }
        
        .obstacle {
            width: 50px;
            height: 50px;
            background-color: red;
            position: absolute;
        }
        
        #score {
            font-size: 24px;
            font-weight: bold;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="200"></canvas>
    <div id="score">Score: 0</div>

// Player Constants
        const PLAYER_SIZE = 50;
        const PLAYER_SPEED = 3;

// Obstacle Constants
        const OBSTACLE_SIZE = 50;
        const OBSTACLE_SPEED = 5;
        const OBSTACLE_GAP = 200;

// Game Variables
        let gameCanvas, ctx, player, obstacles, score;

// Initialize the game
        function init() {
            gameCanvas = document.getElementById('gameCanvas');
            ctx = gameCanvas.getContext('2d');

player = {
                x: 0,
                y: GAME_HEIGHT - PLAYER_SIZE
            };

obstacles = [];
            score = 0;

document.addEventListener('keydown', handleKeyDown);
            setInterval(update, 10);
        }

// Handle keydown event to move the player
        function handleKeyDown(event) {
            if (event.code === 'ArrowRight' && player.x < GAME_WIDTH - PLAYER_SIZE) {
                player.x += PLAYER_SPEED;
            } else if (event.code === 'ArrowLeft' && player.x > 0) {
                player.x -= PLAYER_SPEED;
            }
        }

// Update the game state
        function update() {
            ctx.clearRect(0, 0, GAME_WIDTH, GAME_HEIGHT);

// Update player
            ctx.fillStyle = 'green';
            ctx.fillRect(player.x, player.y, PLAYER_SIZE, PLAYER_SIZE);

// Update obstacles
            for (let i = 0; i < obstacles.length; i++) {
                const obstacle = obstacles[i];
                obstacle.y += OBSTACLE_SPEED;
                ctx.fillStyle = 'red';
                ctx.fillRect(obstacle.x, obstacle.y, OBSTACLE_SIZE, OBSTACLE_SIZE);

// Check collision with player
                if (obstacle.y + OBSTACLE_SIZE > GAME_HEIGHT - PLAYER_SIZE) {
                    gameOver();
                }

// Increment score and remove passed obstacles
                if (obstacle.y > GAME_HEIGHT) {
                    score++;
                    obstacles.splice(i, 1);
                }
            }

// Spawn new obstacles
            if (obstacles.length === 0 || obstacles[obstacles.length - 1].y > OBSTACLE_GAP) {
                obstacles.push({
                    x: Math.random() * (GAME_WIDTH - OBSTACLE_SIZE),
                    y: 0
                });
            }

// Display score
            document.getElementById('score').innerHTML = 'Score: ' + score;
        }

// Game over logic
        function gameOver() {
            alert('Game Over! Your score: ' + score);
            init();
        }

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

Note that this is a basic implementation, and you can enhance it further by adding additional features, levels, graphics, sounds, and optimizing the gameplay mechanics based on your preferences.