Katamari Damacy Interactive Game Poster
Walkthrough (click the arrows to navigate!):
- You can go left at the start screen and enter a room to change the color of your ball (press the button with the color you want)
- After you have your color selected go right of the start screen, continue right to collect a cow
- In the forest room you can click the fruits to make them fall to the floor
- When you move to the next room, any fruits on the floor will be collected
- After the forest you enter an open field, click anywhere to build a rocket
- Click on the rocket to launch into space
- The end! (you can hover over stars to make them spin!)
Design Goals and Process:
When making this interactive experience, my main goal was to create a Katamari-like experience out of the old point-and-click games of my childhood (games like Putt-Putt and Freddie Fish). This is where the idea for a color changer and the navigation arrows came from.
To make this game, I used a variety of tools. Photoshop was my primary way to draw, and I learned Adobe Animate to make the animations that play when you move to new rooms. I had never animated before, but a few tutorials got me where I needed to be. I learned to make a few simple animations and stuck with that. Next, I went to Twine to put all the animations and images together. I had used Twine before, so I was familiar with it. However, this time I had to do a lot of transforming and positioning of images which required me to learn a bit of CSS. I also found out that I do not like using CSS. Twine has this funny thing where you cannot see local images unless you build the whole game. So every time I wanted to change the position of an image, I would need to edit it in Twine, build the game, open the game in a web browser, navigate to the room with the image, take note of where it was, and repeat. It took a lot of trial and error to get everything correctly positioned, especially the stars in the final room. Speaking of the stars, the CSS code to get those working took a long time to figure out. At first, I tried writing a time loop in Twine using (live:) and (mouseover:) but after a few hours, I gave up. I later wrote a CSS class and animation for the stars.
Status | Released |
Platforms | HTML5 |
Author | MightyMatt |
Made with | Twine |
Leave a comment
Log in with itch.io to leave a comment.