sxw031 / Udacity-FEND-Frogger-Game

An HTML5 Canvas powered video game, developed using the best practices in Object Oriented JavaScript.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

FEND-P3-Arcade-game

##Interfaceimage ofinterface

Basic Functionality

In this game, you have a Player and Enemies (Bugs). The goal of the player is to reach the water, without colliding into any one of the enemies. The player can move left, right, up and down. The enemies move in varying speeds on the paved block portion of the scene. Once a the player collides with an enemy, the game is reset and the player moves back to the start square. Once the player reaches the water the game is won.

Additional Functionality

In addition to the basic functionality, you can add more cool functionality to your game. For example, here are some additional features that you can add:

  • Player selection: allow the user to select the image for the player character before starting the game. You can use the different character images provided in the images folder (we’ll get to that below).
  • Score: you can implement a score for the game. For example, the score can increase each time the player reaches the water, and it can be reset to 0 when collision occurs (or it can be reduced).
  • Collectables: you can add gems to the game, allowing the player to collect them to make the game more interesting. Anything else you like!

Adding extra functions

  • multiple vehicle types: randomly passing different type of enemies for different speed.
  • timed games: calculate and display the time one player spending on one game.

How to run the game

  1. clone the repository into your local computer
  2. open index.html in your browser

How to play the game

  1. choose your characters who you want to play with
  2. click 'start' button to start the game
  3. using "up", "down", "left" and "right" arrow key to control the movement of the player to across the road to reach the water on the other side
  4. when you collide the enemy, you lose; if you walk through the enemies and reach the river on the other side, you win.

For detailed instructions on how to get started, check out this guide.

About

An HTML5 Canvas powered video game, developed using the best practices in Object Oriented JavaScript.


Languages

Language:JavaScript 97.8%Language:HTML 1.9%Language:CSS 0.2%