Play
#AnimeClicker
#IncrementalGame
#AnimeMobile
#ClickerGame
#AnimeCharacters
Creation History
User prompt
make the character sprites look bigger ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Make the character sprite last a few seconds longer when touched ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Could you remove the eyes and mouths from the characters and just leave the sprites
User prompt
Okay. Now make the characters the player clicks on have two sprites. One that shows when not touched, and another that only shows when the character is touched. This applies to all characters the player clicks on. ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Okay. Now when the player presses the "Warning" button, a window should appear with a message saying, "This game is in beta, so it may have bugs." ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
The reset button doesn't work. Pressing it would require a complete restart of the game. Relocking unlocked characters and resetting the score ↪💡 Consider importing and using the following plugins: @upit/storage.v1
User prompt
Now, add a main menu before starting the game. It should display the game title and three options: "Play," "Options," "Warning." In the "Options" section, add a red button that, when tapped, completely resets the game, erasing all saved data. ↪💡 Consider importing and using the following plugins: @upit/storage.v1, @upit/tween.v1
User prompt
Very good. Now the gameplay is more important. It adds animations every time a character is unlocked. And it adds many more characters to unlock. ↪💡 Consider importing and using the following plugins: @upit/tween.v1
Code edit (1 edits merged)
Please save this source code
User prompt
Anime Clicker Paradise
Initial prompt
Make a clicker game with an anime theme. Each time you reach a certain number of clicks, unlock more characters to click on and earn more points faster.
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1");
/****
* Classes
****/
var AnimeCharacter = Container.expand(function (characterId, pointValue) {
var self = Container.call(this);
self.characterId = characterId;
self.pointValue = pointValue;
self.isActive = false;
var characterGraphics = self.attachAsset('character' + characterId, {
anchorX: 0.5,
anchorY: 0.5
});
// Character face elements
var leftEye = self.addChild(LK.getAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 0.2,
scaleY: 0.2
}));
leftEye.x = -40;
leftEye.y = -60;
var rightEye = self.addChild(LK.getAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 0.2,
scaleY: 0.2
}));
rightEye.x = 40;
rightEye.y = -60;
var mouth = self.addChild(LK.getAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 0.3,
scaleY: 0.15
}));
mouth.x = 0;
mouth.y = 20;
self.playClickAnimation = function () {
// Main character bounce with higher intensity
tween(self, {
scaleX: 1.3,
scaleY: 1.3
}, {
duration: 80,
easing: tween.elasticOut
});
tween(self, {
scaleX: 1,
scaleY: 1
}, {
duration: 120,
easing: tween.bounceOut
});
// Character color flash based on point value
var flashColor = self.pointValue > 100 ? 0xFFD700 : self.pointValue > 50 ? 0xFF6347 : self.pointValue > 10 ? 0x32CD32 : 0xFFFFFF;
tween(characterGraphics, {
tint: flashColor
}, {
duration: 100,
easing: tween.linear
});
tween(characterGraphics, {
tint: 0xFFFFFF
}, {
duration: 100,
easing: tween.linear
});
// Enhanced eye blink animation
tween(leftEye, {
scaleY: 0.05,
scaleX: 1.2
}, {
duration: 60
});
tween(leftEye, {
scaleY: 0.2,
scaleX: 0.2
}, {
duration: 80
});
tween(rightEye, {
scaleY: 0.05,
scaleX: 1.2
}, {
duration: 60
});
tween(rightEye, {
scaleY: 0.2,
scaleX: 0.2
}, {
duration: 80
});
// Mouth smile animation
tween(mouth, {
scaleX: 0.4,
scaleY: 0.25
}, {
duration: 150,
easing: tween.easeOut
});
tween(mouth, {
scaleX: 0.3,
scaleY: 0.15
}, {
duration: 150,
easing: tween.easeIn
});
};
self.setActive = function (active) {
self.isActive = active;
if (active) {
characterGraphics.alpha = 1.0;
} else {
characterGraphics.alpha = 0.7;
}
};
self.down = function (x, y, obj) {
if (self.isActive) {
totalClicks += self.pointValue;
LK.setScore(totalClicks);
scoreText.setText(totalClicks);
clickValueText.setText('+' + self.pointValue);
self.playClickAnimation();
LK.getSound('click').play();
checkUnlocks();
}
};
return self;
});
var CharacterSlot = Container.expand(function (characterId, unlockThreshold) {
var self = Container.call(this);
self.characterId = characterId;
self.unlockThreshold = unlockThreshold;
self.isUnlocked = false;
var slotBackground = self.attachAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5
});
var characterIcon = self.addChild(LK.getAsset('characterIcon' + characterId, {
anchorX: 0.5,
anchorY: 0.5
}));
characterIcon.alpha = 0.3;
var lockText = self.addChild(new Text2('?', {
size: 40,
fill: 0xFFFFFF
}));
lockText.anchor.set(0.5, 0.5);
lockText.y = 60;
self.unlock = function () {
if (!self.isUnlocked) {
self.isUnlocked = true;
characterIcon.alpha = 1.0;
lockText.setText('');
// Create spectacular unlock animation sequence
// First: Scale up dramatically
tween(self, {
scaleX: 2.0,
scaleY: 2.0
}, {
duration: 300,
easing: tween.elasticOut
});
// Second: Spin while scaling
tween(self, {
rotation: Math.PI * 2
}, {
duration: 500,
easing: tween.easeOut
});
// Third: Flash the icon color
tween(characterIcon, {
tint: 0xFFFFFF
}, {
duration: 100,
easing: tween.linear
});
tween(characterIcon, {
tint: 0xFFFF00
}, {
duration: 150,
easing: tween.linear
});
tween(characterIcon, {
tint: 0xFFFFFF
}, {
duration: 100,
easing: tween.linear
});
// Fourth: Return to normal size with bounce
tween(self, {
scaleX: 1,
scaleY: 1,
rotation: 0
}, {
duration: 400,
easing: tween.bounceOut
});
// Flash screen effect
LK.effects.flashScreen(0xFFD700, 500);
LK.getSound('unlock').play();
}
};
self.updateLockText = function () {
if (!self.isUnlocked) {
var remaining = self.unlockThreshold - totalClicks;
if (remaining > 0) {
lockText.setText(remaining);
}
}
};
self.down = function (x, y, obj) {
if (self.isUnlocked) {
setActiveCharacter(self.characterId);
}
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x2C3E50
});
/****
* Game Code
****/
var totalClicks = storage.totalClicks || 0;
var currentCharacterId = storage.currentCharacterId || 1;
var characters = [];
var characterSlots = [];
var unlockedCharacters = storage.unlockedCharacters || [1];
// Character data
var characterData = [{
id: 1,
points: 1,
unlockAt: 0
}, {
id: 2,
points: 2,
unlockAt: 50
}, {
id: 3,
points: 5,
unlockAt: 200
}, {
id: 4,
points: 10,
unlockAt: 500
}, {
id: 5,
points: 20,
unlockAt: 1000
}, {
id: 6,
points: 35,
unlockAt: 2000
}, {
id: 7,
points: 60,
unlockAt: 4000
}, {
id: 8,
points: 100,
unlockAt: 7500
}, {
id: 9,
points: 175,
unlockAt: 12000
}, {
id: 10,
points: 300,
unlockAt: 20000
}, {
id: 11,
points: 500,
unlockAt: 35000
}, {
id: 12,
points: 850,
unlockAt: 60000
}, {
id: 13,
points: 1400,
unlockAt: 100000
}, {
id: 14,
points: 2500,
unlockAt: 175000
}, {
id: 15,
points: 5000,
unlockAt: 300000
}];
// UI Elements
var scoreText = new Text2(totalClicks.toString(), {
size: 80,
fill: 0xFFFFFF
});
scoreText.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreText);
var clickValueText = new Text2('+1', {
size: 60,
fill: 0xF1C40F
});
clickValueText.anchor.set(0.5, 0.5);
clickValueText.x = 2048 / 2;
clickValueText.y = 800;
clickValueText.alpha = 0;
game.addChild(clickValueText);
var titleText = new Text2('Anime Clicker Paradise', {
size: 50,
fill: 0xE74C3C
});
titleText.anchor.set(0.5, 0);
titleText.y = 100;
LK.gui.top.addChild(titleText);
// Create characters
for (var i = 0; i < characterData.length; i++) {
var charData = characterData[i];
var character = new AnimeCharacter(charData.id, charData.points);
character.x = 2048 / 2;
character.y = 1200;
character.visible = false;
characters.push(character);
game.addChild(character);
}
// Create character selection slots
var slotsPerRow = 5;
var slotSpacing = 140;
var rowSpacing = 150;
var startY = 2100;
var totalRows = Math.ceil(characterData.length / slotsPerRow);
var slotStartX = (2048 - slotsPerRow * slotSpacing) / 2 + 70;
for (var i = 0; i < characterData.length; i++) {
var charData = characterData[i];
var slot = new CharacterSlot(charData.id, charData.unlockAt);
var row = Math.floor(i / slotsPerRow);
var col = i % slotsPerRow;
var rowWidth = Math.min(characterData.length - row * slotsPerRow, slotsPerRow);
var rowStartX = (2048 - rowWidth * slotSpacing) / 2 + 70;
slot.x = rowStartX + col * slotSpacing;
slot.y = startY + row * rowSpacing;
characterSlots.push(slot);
game.addChild(slot);
}
function setActiveCharacter(characterId) {
// Hide all characters
for (var i = 0; i < characters.length; i++) {
characters[i].visible = false;
characters[i].setActive(false);
}
// Show and activate selected character
var character = characters[characterId - 1];
character.visible = true;
character.setActive(true);
currentCharacterId = characterId;
// Update click value display
clickValueText.setText('+' + character.pointValue);
// Save progress
storage.currentCharacterId = currentCharacterId;
}
function checkUnlocks() {
for (var i = 0; i < characterData.length; i++) {
var charData = characterData[i];
if (totalClicks >= charData.unlockAt && unlockedCharacters.indexOf(charData.id) === -1) {
unlockedCharacters.push(charData.id);
characterSlots[i].unlock();
}
}
// Update lock text on all slots
for (var i = 0; i < characterSlots.length; i++) {
characterSlots[i].updateLockText();
}
// Save progress
storage.totalClicks = totalClicks;
storage.unlockedCharacters = unlockedCharacters;
}
// Initialize unlocked characters
for (var i = 0; i < unlockedCharacters.length; i++) {
var charId = unlockedCharacters[i];
characterSlots[charId - 1].unlock();
}
// Set initial active character
setActiveCharacter(currentCharacterId);
// Initialize score
LK.setScore(totalClicks);
// Click value text animation
var clickValueAlpha = 0;
var clickValueFadeTimer = 0;
game.update = function () {
// Animate click value text
if (clickValueAlpha > 0) {
clickValueFadeTimer--;
if (clickValueFadeTimer <= 0) {
clickValueAlpha -= 0.02;
if (clickValueAlpha < 0) clickValueAlpha = 0;
clickValueText.alpha = clickValueAlpha;
}
}
// Check for new unlocks periodically
if (LK.ticks % 60 === 0) {
checkUnlocks();
}
};
// Show click value when character is clicked
var originalDown = game.down;
game.down = function (x, y, obj) {
clickValueAlpha = 1;
clickValueFadeTimer = 30;
clickValueText.alpha = clickValueAlpha;
if (originalDown) {
originalDown(x, y, obj);
}
}; ===================================================================
--- original.js
+++ change.js
@@ -41,43 +41,77 @@
}));
mouth.x = 0;
mouth.y = 20;
self.playClickAnimation = function () {
+ // Main character bounce with higher intensity
tween(self, {
- scaleX: 1.2,
- scaleY: 1.2
+ scaleX: 1.3,
+ scaleY: 1.3
}, {
- duration: 100,
- easing: tween.easeOut
+ duration: 80,
+ easing: tween.elasticOut
});
tween(self, {
scaleX: 1,
scaleY: 1
}, {
+ duration: 120,
+ easing: tween.bounceOut
+ });
+ // Character color flash based on point value
+ var flashColor = self.pointValue > 100 ? 0xFFD700 : self.pointValue > 50 ? 0xFF6347 : self.pointValue > 10 ? 0x32CD32 : 0xFFFFFF;
+ tween(characterGraphics, {
+ tint: flashColor
+ }, {
duration: 100,
- easing: tween.easeIn
+ easing: tween.linear
});
- // Eye blink animation
+ tween(characterGraphics, {
+ tint: 0xFFFFFF
+ }, {
+ duration: 100,
+ easing: tween.linear
+ });
+ // Enhanced eye blink animation
tween(leftEye, {
- scaleY: 0.1
+ scaleY: 0.05,
+ scaleX: 1.2
}, {
- duration: 50
+ duration: 60
});
tween(leftEye, {
- scaleY: 0.2
+ scaleY: 0.2,
+ scaleX: 0.2
}, {
- duration: 50
+ duration: 80
});
tween(rightEye, {
- scaleY: 0.1
+ scaleY: 0.05,
+ scaleX: 1.2
}, {
- duration: 50
+ duration: 60
});
tween(rightEye, {
- scaleY: 0.2
+ scaleY: 0.2,
+ scaleX: 0.2
}, {
- duration: 50
+ duration: 80
});
+ // Mouth smile animation
+ tween(mouth, {
+ scaleX: 0.4,
+ scaleY: 0.25
+ }, {
+ duration: 150,
+ easing: tween.easeOut
+ });
+ tween(mouth, {
+ scaleX: 0.3,
+ scaleY: 0.15
+ }, {
+ duration: 150,
+ easing: tween.easeIn
+ });
};
self.setActive = function (active) {
self.isActive = active;
if (active) {
@@ -123,22 +157,54 @@
if (!self.isUnlocked) {
self.isUnlocked = true;
characterIcon.alpha = 1.0;
lockText.setText('');
+ // Create spectacular unlock animation sequence
+ // First: Scale up dramatically
tween(self, {
- scaleX: 1.3,
- scaleY: 1.3
+ scaleX: 2.0,
+ scaleY: 2.0
}, {
- duration: 200,
- easing: tween.bounceOut
+ duration: 300,
+ easing: tween.elasticOut
});
+ // Second: Spin while scaling
tween(self, {
+ rotation: Math.PI * 2
+ }, {
+ duration: 500,
+ easing: tween.easeOut
+ });
+ // Third: Flash the icon color
+ tween(characterIcon, {
+ tint: 0xFFFFFF
+ }, {
+ duration: 100,
+ easing: tween.linear
+ });
+ tween(characterIcon, {
+ tint: 0xFFFF00
+ }, {
+ duration: 150,
+ easing: tween.linear
+ });
+ tween(characterIcon, {
+ tint: 0xFFFFFF
+ }, {
+ duration: 100,
+ easing: tween.linear
+ });
+ // Fourth: Return to normal size with bounce
+ tween(self, {
scaleX: 1,
- scaleY: 1
+ scaleY: 1,
+ rotation: 0
}, {
- duration: 200,
- easing: tween.bounceIn
+ duration: 400,
+ easing: tween.bounceOut
});
+ // Flash screen effect
+ LK.effects.flashScreen(0xFFD700, 500);
LK.getSound('unlock').play();
}
};
self.updateLockText = function () {
@@ -192,8 +258,48 @@
}, {
id: 5,
points: 20,
unlockAt: 1000
+}, {
+ id: 6,
+ points: 35,
+ unlockAt: 2000
+}, {
+ id: 7,
+ points: 60,
+ unlockAt: 4000
+}, {
+ id: 8,
+ points: 100,
+ unlockAt: 7500
+}, {
+ id: 9,
+ points: 175,
+ unlockAt: 12000
+}, {
+ id: 10,
+ points: 300,
+ unlockAt: 20000
+}, {
+ id: 11,
+ points: 500,
+ unlockAt: 35000
+}, {
+ id: 12,
+ points: 850,
+ unlockAt: 60000
+}, {
+ id: 13,
+ points: 1400,
+ unlockAt: 100000
+}, {
+ id: 14,
+ points: 2500,
+ unlockAt: 175000
+}, {
+ id: 15,
+ points: 5000,
+ unlockAt: 300000
}];
// UI Elements
var scoreText = new Text2(totalClicks.toString(), {
size: 80,
@@ -227,14 +333,23 @@
characters.push(character);
game.addChild(character);
}
// Create character selection slots
-var slotStartX = (2048 - characterData.length * 140) / 2 + 70;
+var slotsPerRow = 5;
+var slotSpacing = 140;
+var rowSpacing = 150;
+var startY = 2100;
+var totalRows = Math.ceil(characterData.length / slotsPerRow);
+var slotStartX = (2048 - slotsPerRow * slotSpacing) / 2 + 70;
for (var i = 0; i < characterData.length; i++) {
var charData = characterData[i];
var slot = new CharacterSlot(charData.id, charData.unlockAt);
- slot.x = slotStartX + i * 140;
- slot.y = 2200;
+ var row = Math.floor(i / slotsPerRow);
+ var col = i % slotsPerRow;
+ var rowWidth = Math.min(characterData.length - row * slotsPerRow, slotsPerRow);
+ var rowStartX = (2048 - rowWidth * slotSpacing) / 2 + 70;
+ slot.x = rowStartX + col * slotSpacing;
+ slot.y = startY + row * rowSpacing;
characterSlots.push(slot);
game.addChild(slot);
}
function setActiveCharacter(characterId) {
Showing 1 to 11 of 11
Images
:quality(85)/https://cdn.frvr.ai/6864a68ffc154f57a61d90c3.png%3F3)
Beautiful anime style girl, with white hair and gray eyes. In-Game asset. 2d. High contrast. No shadows. Pixel art
:quality(85)/https://cdn.frvr.ai/6864a6dffc154f57a61d90cd.png%3F3)
Make her blush and put on a shy expression
:quality(85)/https://cdn.frvr.ai/68654bc1682961abc48b10ff.png%3F3)
Beautiful anime-style girl with black hair and red eyes. Game image. 2D. High contrast. No shadows. Pixel art.. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/68654bfe682961abc48b110a.png%3F3)
Make her blush and put on a shy expression
:quality(85)/https://cdn.frvr.ai/68654ef2682961abc48b1114.png%3F3)
Beautiful anime-style girl with gray hair and light blue eyes. Game image. 2D. High contrast. No shadows. Pixel art.. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/68654fd1682961abc48b111d.png%3F3)
Make her blush and put on a shy expression
Sounds & Music
Used plugins
@upit/tween@upit/storage
