Upit | Learn about creating the game Fire Animations with gen AI

Play

"Fire animations on camp have tents and mushrooms. sky with stars. some flags colors from tree to tree. in a world imagination, vanishing fire, fire torches with fires with many colors on it".

#test

#game

#fun

#puzzle

#arcade

Creation History

User prompt

Add more colors ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

make the background invisible

User prompt

reorder it to be after fire

User prompt

Make it on the front of the fire ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

Add its asset to the list of assets!

User prompt

Add white asset with same size but on the bottom of the fire ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

Add white color ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

make it more bigger ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

make the fire bigger with more spacing between the assets of fire ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

center it in the screen

User prompt

make your best fire animation with yellow orange red a bit of black from its top of the burning ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

add background1 to the game fullscreen

User prompt

Remove the code and the assets

User prompt

Add speed to the greenarea to dragge it fast

User prompt

Add tween plugin to move the greenarea smoothly ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

Make it follow the cursor in exact same time when i dragge it

User prompt

When i dragge the greenarea move its its duplications at the same time with the cursor.

User prompt

If i drag any image move the other images with it.

User prompt

Add dragge to the duplicated greenareas to drag from it too

User prompt

Move the 9 areas from any point of the greenareas

User prompt

Move the green areas from any green area not just from the original

User prompt

Move the objects smoothly without vibration ↪💡 Consider importing and using the following plugins: @upit/tween.v1

User prompt

Please fix the bug: 'Cannot set properties of undefined (setting 'down')' in or related to this line: 'area.down = function (x, y, obj) {' Line Number: 44

User prompt

let the greenareas move by dragging any greenareafrom any point without teleportaion

User prompt

Remove duplications let only the 9 green areas

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

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

/**** 
* Game Code
****/ 
// Create a new instance of the greenarea asset
var greenArea = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 / 2
});
// Add the greenarea to the game
game.addChild(greenArea);
// Add drag functionality to all green areas
var dragNode = null;
var offsetX = 0;
var offsetY = 0;
function addDragFunctionality(area) {
	if (area) {
		area.down = function (x, y, obj) {
			dragNode = area;
			offsetX = x - dragNode.x;
			offsetY = y - dragNode.y;
		};
		area.up = function (x, y, obj) {
			dragNode = null;
		};
		area.move = function (x, y, obj) {
			if (dragNode) {
				tween(dragNode, {
					x: x - offsetX,
					y: y - offsetY
				}, {
					duration: 200,
					easing: tween.easeInOut
				});
				syncGreenAreas(dragNode);
			}
		};
	}
}
addDragFunctionality(greenArea);
addDragFunctionality(greenAreaTop);
addDragFunctionality(greenAreaBottom);
addDragFunctionality(greenAreaBottomLeft);
addDragFunctionality(greenAreaBottomRight);
addDragFunctionality(greenAreaLeft);
addDragFunctionality(greenAreaTopLeft);
addDragFunctionality(greenAreaRight);
addDragFunctionality(greenAreaTopRight);
// Initialize greenArea variables
var greenAreaTop = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 / 2 - 500
});
game.addChild(greenAreaTop);
var greenAreaBottom = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 / 2 + 500
});
game.addChild(greenAreaBottom);
var greenAreaBottomLeft = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 - 500,
	y: 2732 / 2 + 500
});
game.addChild(greenAreaBottomLeft);
var greenAreaBottomRight = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 + 500,
	y: 2732 / 2 + 500
});
game.addChild(greenAreaBottomRight);
var greenAreaLeft = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 - 500,
	y: 2732 / 2
});
game.addChild(greenAreaLeft);
var greenAreaTopLeft = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 - 500,
	y: 2732 / 2 - 500
});
game.addChild(greenAreaTopLeft);
var greenAreaRight = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 + 500,
	y: 2732 / 2
});
game.addChild(greenAreaRight);
var greenAreaTopRight = LK.getAsset('greenarea', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 + 500,
	y: 2732 / 2 - 500
});
game.addChild(greenAreaTopRight);
// Function to synchronize all green areas
function syncGreenAreas(draggedArea) {
	if (draggedArea) {
		var offsetX = draggedArea.x - 2048 / 2;
		var offsetY = draggedArea.y - 2732 / 2;
	} else {
		console.error("draggedArea is not initialized");
		return;
	}
	greenAreaTop.x = 2048 / 2 + offsetX;
	greenAreaTop.y = 2732 / 2 - 500 + offsetY;
	greenAreaBottom.x = 2048 / 2 + offsetX;
	greenAreaBottom.y = 2732 / 2 + 500 + offsetY;
	greenAreaBottomLeft.x = 2048 / 2 - 500 + offsetX;
	greenAreaBottomLeft.y = 2732 / 2 + 500 + offsetY;
	greenAreaBottomRight.x = 2048 / 2 + 500 + offsetX;
	greenAreaBottomRight.y = 2732 / 2 + 500 + offsetY;
	greenAreaLeft.x = 2048 / 2 - 500 + offsetX;
	greenAreaLeft.y = 2732 / 2 + offsetY;
	greenAreaTopLeft.x = 2048 / 2 - 500 + offsetX;
	greenAreaTopLeft.y = 2732 / 2 - 500 + offsetY;
	greenAreaRight.x = 2048 / 2 + 500 + offsetX;
	greenAreaRight.y = 2732 / 2 + offsetY;
	greenAreaTopRight.x = 2048 / 2 + 500 + offsetX;
	greenAreaTopRight.y = 2732 / 2 - 500 + offsetY;
}

===================================================================
--- original.js
+++ change.js
@@ -29,10 +29,10 @@
 function addDragFunctionality(area) {
 	if (area) {
 		area.down = function (x, y, obj) {
 			dragNode = area;
-			offsetX = x - area.x;
-			offsetY = y - area.y;
+			offsetX = x - dragNode.x;
+			offsetY = y - dragNode.y;
 		};
 		area.up = function (x, y, obj) {
 			dragNode = null;
 		};

Showing 76 to 100 of 198

1 2 3 4 5 6 7 8

Images

camp area. world imagination. magical. wood of fire but without fire on the middle of the screen.
In-Game asset. 2d. High contrast. No shadows

one Wood assets.
In-Game asset. 2d. High contrast. No shadows

Sounds & Music

🎵

Firesound

Sound effect

🎶

GameMusic

Music

Used plugins

@upit/tween

Most played remixes