Upit | Learn about creating the game A Journey through Time: A Zebra Puzzle Game with gen AI

Play

A Journey through Time: A Zebra Puzzle Game

Each time you play this game it has a different set of clues, and a different solution. The goal of this puzzle, is to find a solution where each element within a category is uniquely paired with an element from another category, satisfying all the given clues. Zebra Puzzles are often used as a benchmark for evaluating algorithms designed to solve constraint satisfaction problems.

#MusicalAdventure

#TimeTravel

#PuzzleGame

#HistoricalJourney

#RhythmGame

#ZebraPuzzle

#Puzzle

#EinsteinPuzzle

Creation History

User prompt

Make instruments bigger

User prompt

When dots 1 -5 are clicked they are to scroll through the saxophone, drum, flute, harp and gutair images

User prompt

When dots 1 -5 are clicked they are to scroll through the instrument, saxophone, drum, flute, harp and gutair images

User prompt

Make instruments bigger

User prompt

When dots 1 -5 are clicked they are to scroll through the saxophone, drum, flute, harp and gutair images

User prompt

Make dot 2 invisible

User prompt

Make dot 1 invisible

User prompt

Make dots larger

User prompt

Make dots larger

User prompt

Make dots larger

User prompt

Add Dot class for interactive dots 🔄 Add 25 interactive dots to Puzzle and arrange in 5x5 grid over 4x5 asset

User prompt

Make 4x5 asset 2048 wide

User prompt

Make 4x5 asset fill top half of screen

User prompt

Add puzzle when game starts

User prompt

Add 4x5 asset to puzzle class

User prompt

Create a character class

User prompt

Create a location class

User prompt

Create a puzzle class

User prompt

Create a scene class

User prompt

Make image high definition

User prompt

Replace the name Lyra with Harmony

User prompt

Move text up 100

User prompt

Move text down 200

User prompt

Make text bold

User prompt

Change text font to times new Roman

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

/**** 
* Game Code
****/ 
// Add the first scene background image, scaled to fit the game area
var firstSceneBg = LK.getAsset('First', {
	anchorX: 0,
	anchorY: 0,
	x: 0,
	y: 0,
	width: 2048,
	height: 2732
});
game.addChild(firstSceneBg);
// Add the story asset to the bottom of the screen, scaled to fit the width of the game
var storyAsset = LK.getAsset('Story', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2732,
	width: 2048,
	height: 800 // Show a band at the bottom, adjust as needed for visibility
});
game.addChild(storyAsset);
// Add introductory text for the first scene, positioned inside the story asset at the bottom
var introText = new Text2("A Journey through Time\n\nHarmony's adventure begins in her quiet village, where a mysterious melody echoes through the night...", {
	size: 80,
	fill: 0x000000,
	align: "center",
	wordWrap: true,
	wordWrapWidth: 1800,
	font: "Times New Roman",
	fontWeight: "bold"
});
// Center the text horizontally within the story asset, and place it with some padding from the top of the story band
introText.anchor.set(0.5, 0);
introText.x = storyAsset.x;
introText.y = storyAsset.y - storyAsset.height + 140;
game.addChild(introText);
;
;

===================================================================
--- original.js
+++ change.js
@@ -28,9 +28,9 @@
 	height: 800 // Show a band at the bottom, adjust as needed for visibility
 });
 game.addChild(storyAsset);
 // Add introductory text for the first scene, positioned inside the story asset at the bottom
-var introText = new Text2("A Journey through Time\n\nLyra's adventure begins in her quiet village, where a mysterious melody echoes through the night...", {
+var introText = new Text2("A Journey through Time\n\nHarmony's adventure begins in her quiet village, where a mysterious melody echoes through the night...", {
 	size: 80,
 	fill: 0x000000,
 	align: "center",
 	wordWrap: true,

Showing 376 to 400 of 575

1 ...14 15 16 17 18 ...23

Images

Make this scene more modern like in the present

A 4x5 grid in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Saxophone in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Harp in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Drum in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Flute in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Question mark professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

12yo blonde girl in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Cute little10yo girl brown hair in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Cute little 7yo girl with blonde curly hair. Professor Layton game style
In-Game asset. 2d. High contrast. No shadows

15 yo boy with short scruffy blonde hair professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

18yo girl with short brown hair professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Cat in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

White dog with brown patch on eyes professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Turtle in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Frog in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Goldfish in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Basketball ball professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Lego bricks professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Video game console professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Teddy bear professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

These dolls in professor Layton game art style

Hot chips or fries in professor Layton game style artwork.
In-Game asset. 2d. High contrast. No shadows

Bowl of spaghetti in professor Layton game style artwork.
In-Game asset. 2d. High contrast. No shadows

Pizza in professor Layton game style artwork.
In-Game asset. 2d. High contrast. No shadows

Chocolate donut in professor Layton game style artwork.
In-Game asset. 2d. High contrast. No shadows

Ice cream cone in professor Layton game style artwork.
In-Game asset. 2d. High contrast. No shadows

The word "correct" in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

The word " incorrect" in professor Layton game style.
In-Game asset. 2d. High contrast. No shadows

Green tick in professor Layton gamestyle.
In-Game asset. 2d. High contrast. No shadows

Button with RETRY PUZZLE on it in professor Layton game style artwork
In-Game asset. 2d. High contrast. No shadows

Information symbol in professor Layton game style artwork.
In-Game asset. 2d. High contrast. No shadows

Number 1 button professor Layton game style artwork.
In-Game asset. 2d. High contrast. No shadows

How to play button in professor Layton game style font.
In-Game asset. 2d. High contrast. No shadows

Make robe hang lower so you can't see it's feet

Sounds & Music

🎵

Harp

Sound effect

Used plugins

@upit/tween@upit/storage