Upit | Learn about creating the game Hurdle Jumping with gen AI

Play

Hurdle Jumping

octo

HurdleJumping

1.1K

Playit

Leap over obstacles in a race to glory! Quick reflexes win. Can you jump to the top?

#athletics

#sports

#survival

#hypercasual

#action

#jumping

Creation History

User prompt

when the game starts it takes too long for the first hurdle to spawn, ensure it's spawn as soon as the game starts

Code edit (1 edits merged)

Please save this source code

User prompt

there's a weird visual illusion with the animation when the player returns back to it's running state from the jumping state. when returning back to running from jumping, ensure the running animation always resets back to the first frame

Code edit (1 edits merged)

Please save this source code

User prompt

the running state should have 2 frames that alternate between each other. the first frame is the current player, but the second frame should be the same graphic but reversed on it's x axis. alternate between these 2 every 500 miliseconds. the jumping state should not be affected, that one should remain with asingle frame. only animate the running state

User prompt

the jumping state should not be affected by the running animation. only the running animation should have 2 fraes, jumping only has the regular frame with no alternation

User prompt

the transition between the running and jumping is bugged. while the graphic is correctly replace for the jumping state with the player_jump, the running asset is also visible, which should not be during that state

User prompt

while in the jumping state, replace the player's asset with the player_jump

User prompt

after the score increments by 1 point, decrease both the minspawninterval and the maxspawn interval. for each point decrease the minSpawnInterval by 0.5 and the maxSpawnInterval by 1

Code edit (1 edits merged)

Please save this source code

User prompt

theres a bug where jumping over an obstacle adds more than just 1 point. once a point has been added that obstacle should no longer increase the score

User prompt

each passed obstacle can only add 1 point to the score

User prompt

add a score

Code edit (2 edits merged)

Please save this source code

User prompt

instead of spawning hurdles at a fixed rate, create a range, then randomize a random number between those values. so the minimum spawn rate can be 700 miliseconds and the max range is 1000 miliseconds

User prompt

place the obstacles in the midgroundcontainer and the player in the foreground container

User prompt

create a BackgroundContainer, MidgroundContainer and ForegroundContainer in that order

User prompt

move the player 500 pixels higher

User prompt

now ensure the growing animation duriong jumping is relative to the player's center instead of it's bottom

User prompt

Adjust Progress Calculation: For the second half of the animation, ensure the scale calculation starts from the enlarged size and progresses back to the original size. The current formula might be resetting the progress incorrectly, making it appear as if the character is growing again.

Code edit (1 edits merged)

Please save this source code

User prompt

ok, I can now finally see the jumping animation happening, but it's not working as intended. the entire jumping state lasts for 1 second. this animation has 2 states of itself. an increase in size furing the first hald, and then a decrease in size during the second half. so for the first 500 miliseconds the graphic should slowly enlrage until it becomes 1.5 of it's regular size, when start shrinking back to it's original size during the next 500 millisecs

User prompt

If the current method of applying the scale change isn’t effective, consider using a different method to apply these changes. For example, you could adjust how the player's graphical representation is linked to these scale properties. Sometimes, graphical settings or properties might not directly reflect changes if not properly bound or updated in the game’s rendering logic.

User prompt

Verify that the player’s state changes correctly between 'running' and 'jumping'. If the state doesn’t change correctly, the game might not execute the scaling logic. Make sure the state is set to 'jumping' when the jump starts and reverts back to 'running' when the jump ends.

/**** 
* Classes
****/ 
// Hurdle class
var Hurdle = Container.expand(function () {
	var self = Container.call(this);
	var hurdleGraphics = self.attachAsset('obstacle', {
		anchorX: 0.5,
		anchorY: 0.0 // Anchor at the top for easier sky alignment
	});
	self.speedY = 10;
	self.move = function () {
		self.y += self.speedY;
	};
	self.isOffScreen = function () {
		return self.y > game.height;
	};
});
// Assets are automatically created based on usage in the code.
// Player class
var Player = Container.expand(function () {
	var self = Container.call(this);
	var playerGraphics = self.attachAsset('player', {
		anchorX: 0.5,
		anchorY: 1.0 // Anchor at the bottom center for easier ground alignment
	});
	// Removed gravity-related properties
	self.state = 'running'; // Add a new state variable to the player
	self.update = function () {
		// Update method now only handles state changes
	};
	self.jump = function () {
		if (self.state === 'running') {
			self.state = 'jumping';
			var totalDuration = 1000; // Total duration of the jump state
			var halfDuration = totalDuration / 2;
			var currentTime = 0;
			var updateSize = function updateSize() {
				var progress = currentTime / halfDuration;
				if (currentTime <= halfDuration) {
					// Growing
					playerGraphics.scale.x = 1 + progress * 0.5; // Scale up to 1.5x original size
					playerGraphics.scale.y = 1 + progress * 0.5;
				} else {
					// Shrinking
					progress = (totalDuration - currentTime) / halfDuration;
					playerGraphics.scale.x = 1.5 - progress * 0.5; // Scale back to original size
					playerGraphics.scale.y = 1.5 - progress * 0.5;
				}
				currentTime += 1000 / 60; // Update currentTime based on frame rate
				if (currentTime >= totalDuration) {
					LK.clearInterval(sizeInterval);
					playerGraphics.scale.x = 1; // Reset scale to original size
					playerGraphics.scale.y = 1;
					self.state = 'running'; // Reset state to running after jump
				}
			};
			var sizeInterval = LK.setInterval(updateSize, 1000 / 60); // Set interval based on frame rate
		}
	};
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x87CEEB // Light blue background to simulate the sky
});

/**** 
* Game Code
****/ 
var player = game.addChild(new Player());
player.x = game.width / 2; // Position at the middle of the screen
player.y = game.height - 100; // Start position near the bottom of the screen
var obstacles = [];
var spawnObstacleTimer = 0;
var spawnObstacleInterval = 120; // Frames until next obstacle spawns
game.on('down', function (obj) {
	player.jump();
});
LK.on('tick', function () {
	player.update();
	// Handle obstacle movement and cleanup
	for (var i = obstacles.length - 1; i >= 0; i--) {
		obstacles[i].move();
		if (obstacles[i].isOffScreen()) {
			obstacles[i].destroy();
			obstacles.splice(i, 1);
		} else if (player.intersects(obstacles[i]) && player.state === 'running') {
			// Game over logic
			LK.effects.flashScreen(0xff0000, 1000);
			LK.showGameOver();
		}
	}
	// Spawn hurdles
	spawnObstacleTimer++;
	if (spawnObstacleTimer >= spawnObstacleInterval) {
		var hurdle = game.addChild(new Hurdle());
		hurdle.x = game.width / 2; // Position at the middle of the screen
		hurdle.y = 0; // Position at the top of the screen
		obstacles.push(hurdle);
		spawnObstacleTimer = 0;
	}
});

===================================================================
--- original.js
+++ change.js
@@ -30,10 +30,9 @@
 		// Update method now only handles state changes
 	};
 	self.jump = function () {
 		if (self.state === 'running') {
-			// Only allow jump if player is in 'running' state
-			self.state = 'jumping'; // Set the player's state to jumping
+			self.state = 'jumping';
 			var totalDuration = 1000; // Total duration of the jump state
 			var halfDuration = totalDuration / 2;
 			var currentTime = 0;
 			var updateSize = function updateSize() {

Showing 101 to 125 of 152

1 2 3 4 5 6 7

Images

8-bit pixelated cheering group of young fans at the olympics holding signs, Vuvuzelas and confetti.
Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.

Sounds & Music

🎵

Jump

Sound effect

🎵

Land

Sound effect

Main