Upit | Learn about creating the game Flappy Drone : Age of Flight with gen AI

Play

Flappy Drone : Age of Flight

burak_07

burakgame07

16d

Playit

Ready to soar through the skies with your drone? Coin Flight takes you on an action-packed journey from mountain landscapes to war-torn battlefields, and finally into a neon-lit cyberpunk city! Each level brings a unique environment, new obstacles, and fresh drone skins. Get ready, fly your drone, and collect those coins!

#FlappyBird

#EndlessRunner

#DroneGame

#CyclingLevels

#MobileGaming

#CoinFlight

#FlappyDrone

#2DGame

#ArcadeGame

#RetroStyle

#GameOn

#FlyingChallenge

#DroneAdventure

#LevelUp

Creation History

User prompt

You need to increase the distance between the obstacles and the distance between the obstacles a little more.

User prompt

slightly increase the spacing of obstacles and the distance between obstacles

Code edit (1 edits merged)

Please save this source code

User prompt

Drone Runner: Endless Flight

Initial prompt

I want to make a flappy bird style game but our character is not a bird but a drone. The game basically consists of 4 sections and after the 4th section is finished it will go back to the 1st section and this will continue forever. In the starting screen, the screen should be asked to touch the screen once to start the drone. The game starts when the screen is touched. The background, obstacles and drones of each section are different. In the 1st section the background is a mountain, the obstacles are trees, the obstacles start from the bottom and the top. The position of the fixed gap changes and we try to pass through that gap. The position of the gap should change according to the size of the tree. In the 2nd section the background is a battlefield, the obstacles are an iron pole surrounded by barbed wire and the 2nd world war level. The game mechanics are the same. In the 3rd section the background is a cyberpunk city, the obstacles are neon poles and the cyberpunk level. In the 4th section the background is the Egyptian pyramids in the desert, the obstacles are ancient Egyptian columns and the ancient Egyptian level. The player earns points when passing through the gap of each obstacle in the game. When you reach 50 points, part 1 ends, and you move on to part 2. When you reach 100 points, part 2 ends, and you move on to part 3. When you reach 150 points, part 3 ends, and you move on to part 4. When you reach 200 points, part 4 ends, and you move on to part 1. And so on.

/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");

/**** 
* Classes
****/ 
var Drone = Container.expand(function () {
	var self = Container.call(this);
	// Current drone graphics
	self.droneGraphics = null;
	self.velocity = 0;
	self.gravity = 0.8;
	self.jumpPower = -12;
	// Set drone type based on current section
	self.setDroneType = function (section) {
		if (self.droneGraphics) {
			self.removeChild(self.droneGraphics);
		}
		var droneType = 'natureDrone';
		if (section === 1) droneType = 'militaryDrone';else if (section === 2) droneType = 'futuristicDrone';else if (section === 3) droneType = 'archeologicalDrone';
		self.droneGraphics = self.attachAsset(droneType, {
			anchorX: 0.5,
			anchorY: 0.5
		});
	};
	self.flap = function () {
		self.velocity = self.jumpPower;
		LK.getSound('flap').play();
		// Flap animation
		tween(self, {
			rotation: -0.3
		}, {
			duration: 200
		});
		tween(self, {
			rotation: 0.3
		}, {
			duration: 300,
			onFinish: function onFinish() {
				tween(self, {
					rotation: 0
				}, {
					duration: 200
				});
			}
		});
	};
	self.update = function () {
		self.velocity += self.gravity;
		self.y += self.velocity;
		// Rotation based on velocity
		self.rotation = Math.min(Math.max(self.velocity * 0.05, -0.5), 0.8);
	};
	return self;
});
var Obstacle = Container.expand(function () {
	var self = Container.call(this);
	self.topObstacle = null;
	self.bottomObstacle = null;
	self.gapHeight = 300;
	self.speed = 4;
	self.scored = false;
	self.createObstacle = function (section, gapY) {
		var obstacleType = 'treeObstacle';
		if (section === 1) obstacleType = 'barbedWireObstacle';else if (section === 2) obstacleType = 'neonPoleObstacle';else if (section === 3) obstacleType = 'stoneColumnObstacle';
		// Top obstacle
		self.topObstacle = self.attachAsset(obstacleType, {
			anchorX: 0.5,
			anchorY: 1
		});
		self.topObstacle.x = 0;
		self.topObstacle.y = gapY - self.gapHeight / 2;
		// Bottom obstacle
		self.bottomObstacle = self.attachAsset(obstacleType, {
			anchorX: 0.5,
			anchorY: 0
		});
		self.bottomObstacle.x = 0;
		self.bottomObstacle.y = gapY + self.gapHeight / 2;
	};
	self.update = function () {
		self.x -= self.speed;
		// Check scoring
		if (!self.scored && self.x < drone.x) {
			self.scored = true;
			LK.setScore(LK.getScore() + 1);
			LK.getSound('score').play();
			scoreTxt.setText(LK.getScore());
			// Check if section should change
			updateGameSection();
		}
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x87ceeb
});

/**** 
* Game Code
****/ 
// Sounds
// Background shapes for each section
// Obstacle assets for each section
// Drone assets for each section
// Game state variables
var gameStarted = false;
var gameSection = 0; // 0-3 for the four sections
var obstacles = [];
var obstacleSpawnTimer = 0;
var backgroundGraphics = null;
// Create drone
var drone = game.addChild(new Drone());
drone.x = 400;
drone.y = 1366;
// Create background
function updateBackground() {
	if (backgroundGraphics) {
		game.removeChild(backgroundGraphics);
	}
	var bgType = 'mountainBg';
	if (gameSection === 1) bgType = 'battlefieldBg';else if (gameSection === 2) bgType = 'cyberpunkBg';else if (gameSection === 3) bgType = 'desertBg';
	backgroundGraphics = LK.getAsset(bgType, {
		anchorX: 0,
		anchorY: 0,
		x: 0,
		y: 0
	});
	game.addChildAt(backgroundGraphics, 0);
}
// Initialize background and drone
updateBackground();
drone.setDroneType(gameSection);
// Create UI
var scoreTxt = new Text2('0', {
	size: 100,
	fill: 0xFFFFFF
});
scoreTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreTxt);
var startPrompt = new Text2('TAP TO START', {
	size: 80,
	fill: 0xFFFFFF
});
startPrompt.anchor.set(0.5, 0.5);
LK.gui.center.addChild(startPrompt);
// Game section management
function updateGameSection() {
	var score = LK.getScore();
	var newSection = Math.floor(score / 50) % 4;
	if (newSection !== gameSection) {
		gameSection = newSection;
		updateBackground();
		drone.setDroneType(gameSection);
		// Increase difficulty slightly
		for (var i = 0; i < obstacles.length; i++) {
			obstacles[i].speed = 4 + Math.floor(score / 100) * 0.5;
		}
	}
}
// Obstacle spawning
function spawnObstacle() {
	var obstacle = new Obstacle();
	var gapY = 400 + Math.random() * (2732 - 800);
	obstacle.createObstacle(gameSection, gapY);
	obstacle.x = 2048 + 300;
	obstacle.speed = 4 + Math.floor(LK.getScore() / 100) * 0.5;
	obstacles.push(obstacle);
	game.addChild(obstacle);
}
// Input handling
game.down = function (x, y, obj) {
	if (!gameStarted) {
		gameStarted = true;
		startPrompt.visible = false;
		drone.flap();
		return;
	}
	drone.flap();
};
// Main game loop
game.update = function () {
	if (!gameStarted) return;
	// Check bounds collision
	if (drone.y < 0 || drone.y > 2732) {
		LK.getSound('crash').play();
		LK.showGameOver();
		return;
	}
	// Spawn obstacles
	obstacleSpawnTimer++;
	if (obstacleSpawnTimer >= 150) {
		// Spawn every 2.5 seconds at 60fps
		spawnObstacle();
		obstacleSpawnTimer = 0;
	}
	// Update and check obstacle collisions
	for (var i = obstacles.length - 1; i >= 0; i--) {
		var obstacle = obstacles[i];
		// Check collision with drone
		if (drone.intersects(obstacle.topObstacle) || drone.intersects(obstacle.bottomObstacle)) {
			LK.getSound('crash').play();
			LK.showGameOver();
			return;
		}
		// Remove off-screen obstacles
		if (obstacle.x < -200) {
			obstacle.destroy();
			obstacles.splice(i, 1);
		}
	}
};

===================================================================
--- original.js
+++ change.js
@@ -168,9 +168,9 @@
 function spawnObstacle() {
 	var obstacle = new Obstacle();
 	var gapY = 400 + Math.random() * (2732 - 800);
 	obstacle.createObstacle(gameSection, gapY);
-	obstacle.x = 2048 + 200;
+	obstacle.x = 2048 + 300;
 	obstacle.speed = 4 + Math.floor(LK.getScore() / 100) * 0.5;
 	obstacles.push(obstacle);
 	game.addChild(obstacle);
 }
@@ -194,10 +194,10 @@
 		return;
 	}
 	// Spawn obstacles
 	obstacleSpawnTimer++;
-	if (obstacleSpawnTimer >= 120) {
-		// Spawn every 2 seconds at 60fps
+	if (obstacleSpawnTimer >= 150) {
+		// Spawn every 2.5 seconds at 60fps
 		spawnObstacle();
 		obstacleSpawnTimer = 0;
 	}
 	// Update and check obstacle collisions

Showing 26 to 30 of 30

1 2

Images

drone side view.
In-Game asset. 2d. High contrast. No shadows

light brown mountain background.
In-Game asset. 2d. High contrast. No shadows

barbed iron pole.
In-Game asset. 2d. High contrast. No shadows

column pillar belonging to ancient Egypt. the top and bottom are the same. symmetrical.
In-Game asset. 2d. High contrast. No shadows

neon turquoise pole. covered with neon pink frame.
In-Game asset. 2d. High contrast. No shadows

World War II, gloomy weather, just ground.
In-Game asset. 2d. High contrast. No shadows

cyberpunk city for back ground. Dark blue
In-Game asset. 2d. High contrast. No shadows

ancient egypt for background.
In-Game asset. 2d. High contrast. No shadows

wood pole rectangular flat.
In-Game asset. 2d. High contrast. No shadows

drone side view military drone. light camouflage
In-Game asset. 2d. High contrast. No shadows

drone side view drone. Silver Color.
In-Game asset. 2d. High contrast. No shadows

drone side view drone. cyberpunk theme, has yellow light. neon green color
In-Game asset. 2d. High contrast. No shadows

flat black framed silver coin
In-Game asset. 2d. High contrast. No shadows

Used plugins

@upit/tween