Upit | Learn about creating the game Kaleidoscope of Music Rhythm with gen AI
Play
game-community-background
game-pic

46

1

2d

Playit
There are various music genres that represents various patterns of kaleidoscope such as electronic, dream pop, dark ambient, dupstep, trap, Chinese traditional, Malay traditional etc. You can read the story for each song before you start the gameplay. Here's some introduction for gameplay, that is tap the note when you see the small notes, hold the note when you see the vertical long notes, and swipe the note when you see the horizontal long notes.
#RhythmGame
#MusicGame
#MobileGaming
#TapAndSwipe
#StoryMode
#UpitMusicContest

Creation History

User prompt

Since the background for Unknown Journey is mostly white, specialize the fonts of display of scoreboard in black color for Unknown Journey only

User prompt

Reduce the fonts size of Unknown Journey selector UI

User prompt

Remove all hold notes and swipes notes in easy mode of Unknown Journey

User prompt

Place Unknown Journey within the SelectorUI, and add Chinese translation for Unknown Journey title as 莫问前程

User prompt

```js { id: 'UnknownJourney', title: 'Unknown Journey', '莫问前程’ cover: 'songCover4', duration: 240000, story: { en: "A song that mix Chinese traditional music with dark ambient music style, depicting the swordswoman making peace with her dark past while maintaining her courage to explore the mysterious and unknown journey.”, zh: “一首混合中华传统音乐与黑暗氛围风格的歌曲,展现出女侠对于黑暗过去的释怀,保持对探索神秘未知前程的勇气。” }, difficulties: ['Easy', 'Medium', 'Hard'],

User prompt

I've identified and fixed the issue with gameplay backgrounds persisting in the final scoreboard and home screen. The problem was that we weren't consistently removing backgrounds during state transitions. Here's the solution: 1. Added a new `gameplayBackground` variable to track the current background 2. Modified `removeGameplayBackgrounds()` to use this reference 3. Ensured proper removal in all state transitions Here are the key changes: ```javascript // Add this at the top with other globals var gameplayBackground = null; // Updated background removal function function removeGameplayBackgrounds() { if (gameplayBackground && gameplayBackground.parent) { gameplayBackground.parent.removeChild(gameplayBackground); gameplayBackground = null; } } // Modified background setup in startGameplay() function startGameplay() { removeGameplayBackgrounds(); // Clear any existing background // Add new background if (selectedSong.id === 'SkyJourney') { gameplayBackground = LK.getAsset('BgSkyJourney', {...}); game.addChildAt(gameplayBackground, 0); } // Similar for other songs... } // Updated setGameState() to include background removal function setGameState(state) { // Always remove gameplay backgrounds first removeGameplayBackgrounds(); // Existing state transition code... if (state === 'HOME') { showHome(); } // Other states... } // Modified showResult() to remove background function showResult() { removeGameplayBackgrounds(); // Existing result screen code... } ``` The complete solution integrates these changes throughout the code: ```javascript // ... (existing code above GLOBALS section) // --- GLOBALS --- var gameplayBackground = null; // Add this to track background var GAME_STATE = 'LANGUAGE'; // ... (other globals remain unchanged) // --- UTILS --- function removeGameplayBackgrounds() { if (gameplayBackground && gameplayBackground.parent) { gameplayBackground.parent.removeChild(gameplayBackground); gameplayBackground = null; } } function clearGameObjects() { removeGameplayBackgrounds(); // Ensure backgrounds are removed // ... (rest of existing clearGameObjects code) } function setGameState(state) { // Always remove gameplay backgrounds from the game scene removeGameplayBackgrounds(); removeGameplayBackgrounds(); // Double-call for safety // ... (rest of existing setGameState code) } // --- GAMEPLAY --- function startGameplay() { removeGameplayBackgrounds(); // Clear previous backgrounds // Background setup - ADD THIS SECTION: if (selectedSong && selectedSong.id === 'SkyJourney') { gameplayBackground = LK.getAsset('BgSkyJourney', { anchorX: 0.5, anchorY: 0, x: 2048 / 2, y: 0, scaleX: 2048 / 2048, scaleY: 2732 / 3640.89 }); gameplayBackground.width = 2048; gameplayBackground.height = 2732; game.addChildAt(gameplayBackground, 0); } else if (selectedSong && selectedSong.id === 'NightPulse') { gameplayBackground = LK.getAsset('BgNightPulse', { anchorX: 0.5, anchorY: 0, x: 2048 / 2, y: 0, scaleX: 2048 / 2048, scaleY: 2732 / 3640.89 }); gameplayBackground.width = 2048; gameplayBackground.height = 2732; game.addChildAt(gameplayBackground, 0); } else if (selectedSong && selectedSong.id === 'SunriseWaltz') { gameplayBackground = LK.getAsset('BgSunriseWaltz', { anchorX: 0.5, anchorY: 0, x: 2048 / 2, y: 0, scaleX: 2048 / 2048, scaleY: 2732 / 3640.89 }); gameplayBackground.width = 2048; gameplayBackground.height = 2732; game.addChildAt(gameplayBackground, 0); } // ... (rest of existing startGameplay code) } // --- RESULT SCREEN --- function showResult() { removeGameplayBackgrounds(); // Explicitly remove backgrounds clearGameObjects(); // ... (rest of existing showResult code) } // --- HOME SCREEN --- function showHome() { removeGameplayBackgrounds(); // Explicitly remove backgrounds // ... (rest of existing showHome code) } ``` This solution ensures that: 1. Backgrounds are properly tracked with a dedicated variable 2. Backgrounds are removed before any state transition 3. Double-removal calls provide extra safety 4. Explicit removal happens in scoreboard and home screens 5. New backgrounds are properly cleaned before gameplay starts The backgrounds will now only appear during actual gameplay and will be completely removed for all other screens and subsequent gameplay sessions.

User prompt

Adjust Chinese words display problems which is overlapping with song covers, and for the extra words off screen, split them into next paragraph too

User prompt

Adjust Chinese words display problems which is overlapping with song covers, and for the extra words off screen, split them into next paragraph too

User prompt

Adjust the words display too for Chinese words after fullstop split into paragraph, to prevent off-screen and overlap with song cover

User prompt

Can you adjust it to the Chinese words after comma continue to the next paragraph so that they are not off screen and overlap with song cover?

User prompt

Chinese words still off screen

User prompt

Some of the Chinese words still display off screen, fix this problems

User prompt

Fix the Chinese story display problems and rearrange them in the paragraph form, preventing the words display

User prompt

Rewrite the code to ensure that the background of gameplay like BgSkyJourney, BgNightPulse and BgSunriseWaltz disappear after the gameplay finished and appearing the scoreboard, and they'll not reappear at the homepage and the next songs

User prompt

Make the tempo flowing stops as the music ends in the hard mode for all songs, and the scoreboard appear immediately after the gameplay ends without waiting for a long time

User prompt

Also apply it to medium mode, as I found sometimes hold notes is easier to be handled in hard mode than in medium mode

User prompt

Make hold notes rules player friendly

User prompt

Remove gameplay backgrounds immediately after the scoreboard is appeared, transitioning gameplay into scoreboard without gameplay backgrounds after the game is end

User prompt

Still occurring the same errors that the gameplay backgrounds still appear at the homepage and the next songs

User prompt

Please fix the bug: 'removeGameplayBackgrounds is not defined' in or related to this line: 'removeGameplayBackgrounds();' Line Number: 516

User prompt

Apply runnable cleanup code to remove gameplay backgrounds after exit is clicking to avoid appearing at the homepage and the next songs

User prompt

Remove gameplay backgrounds after clicking exit, and make sure they aren't appear again at the homepage and the next song

User prompt

Still occurring gameplay backgrounds displaying error, remove the background when the scoreboard pop out

User prompt

Tempo flowing for all songs suddenly didn't appear when the songs are nearly to be ended

User prompt

Rewrite Sky Journey, Night Pulse and Sunrise Waltz hard mode with continuous tempo flow

===================================================================
--- original.js
+++ change.js
@@ -1872,12 +1872,17 @@
 	accuracyText.setText("Accuracy: " + acc + "%");
 	// End of song - check if song duration has been reached since music only plays once
 	if (t > getSongEndTime() && isPlaying) {
 		isPlaying = false;
-		// Music will stop automatically since it only plays once
-		resultTimeout = LK.setTimeout(function () {
+		// If Hard mode, show result immediately after music ends (no tempo flow wait)
+		if (selectedDifficulty === 'Hard') {
 			setGameState('RESULT');
-		}, 1200);
+		} else {
+			// Music will stop automatically since it only plays once
+			resultTimeout = LK.setTimeout(function () {
+				setGameState('RESULT');
+			}, 1200);
+		}
 	}
 };
 function getSongEndTime() {
 	// Use the full song duration from the song data
Showing 26 to 50 of 214
123456789

Images

Game design for Kaleidoscope of Music Rhythm without game title, just the design for opening screen background. In-Game asset. 2d. High contrast. No shadows Cyberpunk style design empty selector UI. In-Game asset. 2d. High contrast. No shadows Cyberpunk style hold note for music rhythm game. In-Game asset. 2d. High contrast. No shadows Cyberpunk style swipe note for music rhythm game. In-Game asset. 2d. High contrast. No shadows Cyberpunk style tap note for music rhythm game. In-Game asset. 2d. High contrast. No shadows Cyberpunk style kaleidoscope pattern design for homepage. In-Game asset. 2d. High contrast. No shadows Cyberpunk style lane divider for music rhythm game that is horizontal and used for judging the touching of rhythm In-Game asset. 2d. High contrast. No shadows Empty cyberpunk style storybox design in which it's size enable song cover, difficulty level and song description to be added in the storybox. In-Game asset. 2d. High contrast. No shadows Round shape of song cover of anime style with Sky Journey theme. In-Game asset. 2d. High contrast. No shadows Round shape song cover of cyberpunk anime style with the themed “Night Pulse”. In-Game asset. 2d. High contrast. No shadows Round shape of anime style song cover with the themed Sunrise Waltz. In-Game asset. 2d. High contrast. No shadows Anime style design for the round shape song cover of New Era Malay Style Round shape, Replace Chinese word from “不知途”to“莫问前程”,others remaining the same Empty cyberpunk style menu design. In-Game asset. 2d. High contrast. No shadows Cyberpunk style pause symbol. In-Game asset. 2d. High contrast. No shadows

Sounds & Music

🎶

NightPulse

Music

🎶

SunriseWaltz

Music

🎶

SkyJourney

Music

🎶

KaleidoscopeMusicRhythm

Music

🎵

Touch

Sound effect

🎶

NewEraMalayStyle

Music

🎶

UnknownJourney

Music

Used plugins

@upit/tween@upit/storage
Home
Discover
Play
Profile