Skip to content

Latest commit

 

History

History
83 lines (49 loc) · 3.57 KB

README.md

File metadata and controls

83 lines (49 loc) · 3.57 KB
Raw

GA - SEI - PROJECT-01 (Space-Invaders)

Timeframe

  • 5 days

Technologies used

  • JavaScript (ES6).
  • HTML5 + HTML5 Audio.
  • CSS Animation.
  • GitHub.

Installation

  1. Clone or download the repo.
  2. Open the index.html in your browser of choice.

My Game - Space Invaders

Screenshot 2019-04-05 at 11 40 58

You can play the hosted version here: Space Invaders.

Game overview

This is my own re-creation of the classic Space Invaders game.

Space Invaders is one of the most addicting games. The idea of the game is very simplistic. You are a space ship who must destroy the invading enemy space aliens as they descend. Use the [SPACE] bar to fire your gun and the arrow keys to move right and left.

Controls

  • Space ship movements: ← → keys.
  • [SPACE] bar to fire your gun.

Game Instructions

  1. The game begins with a welcome screen and on the bottom of the screen are the game instructions. The game is started by clicking on the "START" button.

Screenshot 2019-04-05 at 11 43 20

  1. After the "START" button has been clicked the game starts. The user starts on 3 lives and a score of zero. The player can stars using the arrow keys left and right to move, and the [SPACE] bar to kill the enemy space aliens.

Screenshot 2019-07-01 at 14 21 12

  1. Points are gained every time player killed an enemy space alien.

Screenshot 2019-07-01 at 14 16 12

  1. A player can have a maximum of 3 lives. If the player loses all their lives the Game is Over. Game is Over is show in a new window with two messages:
    • Game Over: You ran out of lives.
    • Your score: X.

Screenshot 2019-04-05 at 12 04 25

  1. You loose if:
  • The aliens reached planet earth.
  • You ran out of lives.
  1. You win if:
  • You kill all the aliens.

Process

The starting point for this game was creating in html one div with the class name of wrap, in css some style to calc the width 13*13, and the last part was to create the logic in Javascript to create all my game divs. The aliens are generated by an array and the aliens movement are generated by for each. The initial position for my gamer was set up by playerIndex. To obtain the position of my player function move was created to find the square with the class of “player”, remove the class of player from that square and to add the class of player to square the player should move to.

Challenges

The biggest challenge for this project was create the logic to kill my aliens and make them disappear from my array.

Screenshot 2019-07-01 at 14 31 44

Wins

A big win for this game was to get the aliens disappear when they were shot.

Future features

I would like to add:

  • Three difficulty levels.
  • Three types of missile: slow straight ones, fast straight ones and wiggly ones which are the most powerful.
  • A base shelters.