You are browsing as a guest. Sign up (or log in) to start making projects!

FLAPPY NYAN CAT

  • 7 Devlogs
  • 9 Total hours

FLAPPY NYAN CAT :D

Ship #1

I made a Flappy Bird clone where you play as Nyan Cat flying through Mario-style pipes. The whole game runs in the browser as a single HTML file with no installs or dependencies, and everything including Nyan Cat, the rainbow trail, the pipes, and the boosters are drawn from scratch every frame using the HTML5 Canvas API.
The hardest part was getting it to actually run in the browser. I originally built it in Python with Pygame but Codespaces has no display so I had to learn how to convert the whole thing to JavaScript using the Canvas API and rewrite all the drawing logic from scratch.
I am most proud of the rainbow trail and the procedural Nyan Cat animation. The legs, tail, and body all animate using sine waves so there are zero image files in the entire project.
To test it just open the link, press SPACE or tap the screen to flap, and try to collect the boosters. The star makes you invincible, the mushroom makes you giant, the lightning bolt slows the pipes down, and the coins give you +5 points.

  • 7 devlogs
  • 9h
  • 5.18x multiplier
  • 48 Stardust
Try project → See source code →
Open comments for this post

1h 50m logged

Game start instructions: Creation of frames and layering the background: Making an RGB color-shifting background: Making score, best score, and active booster timers. : Making the starting scene

0
0
2
Open comments for this post

1h 36m logged

Making the invincible boundary for the cat : Making the pipe spawning system: Making pipe movement and scoring : Booster and pipe Collision : and pipe cleanup after it leaves the screen.

0
0
3
Open comments for this post

36m logged

I was making the pipe and live update system. I noticed that I made a huge error in the code by forgetting to name a variable, and that led to quite a bit of debugging.

0
0
4
Open comments for this post

20m logged

Getting the code for the boosters finished up: Will most likely come back and add more boosters: The stars in the back are going to come out very nice

0
0
2
Open comments for this post

1h 44m 19s logged

This code handles all the basic setup and visual building blocks of the entire game. The draw_nyan_cat function makes the character form very simple shapes every frame. It also scales up and turns yellow when interacting with power-ups. Rainbow_Trail stores the cat’s last 30 positions and draws the layered color ribbon behind it. The Stars function scrolls 60 twinkling dots across the background of the parallax effect. The Pipe function draws the classic green obstacle pairs and has collision rectangles. The booster is a scrolling collectible that bobs and changes the cat’s visual structure when collected.

0
0
3

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…