Create Original Flappy Bird Using JavaScript



DOWNLOAD: Original Flappy Bird In JAVASCRIPT - SOURCE CODE





This is a preview of what we're going to build:

Flappy Bird was a side-scrolling mobile game featuring 2D retro style graphics. The objective was to direct a flying bird, named "Faby", who moves continuously to the right, between sets of Mario-like pipes. If the player touches the pipes, they lose. Faby briefly flaps upward each time that the player taps the screen; if the screen is not tapped, Faby falls because of gravity; each pair of pipes that he navigates between earns the player a single point, with medals awarded for the score at the end of the game. No medal is awarded to scores less than ten. A bronze medal is given to scores between ten and twenty. In order to receive the silver medal, the player must reach 20 points. The gold medal is given to those who score higher than thirty points. Players who achieve a score of forty or higher receive a platinum medal. Android devices enabled the access of world leaderboards, through Google Play.

There is no variation or evolution in gameplay throughout the game, as the pipes always have the same gap between them and there is no end to the running track, having only the flap and ding sounds and the rising score as rewards.

And today you're going to create the Flappy Bird game using JavaScript and HTML (or HTML5 canvas).

We're not using any framework to build the game, Just Vanilla JavaScript.

4 Comments

You're welcome to share your ideas with us in comments.

  1. its too fast how to slow it down??

    ReplyDelete
    Replies
    1. Try these settings in the game.js file

      gravity : 0.14,
      jump : 3.6,

      gap : 120,

      // MOVE THE PIPES TO THE LEFT
      p.x -= this.dx * 1.2;

      Delete
  2. How to change the background and character too? can we add image in background and also add character image?

    ReplyDelete
Previous Post Next Post