brickBreaker

The game we are making is Brick Breaker game, which is very familiar with us. You move the bar to hit the moving ball, and the ball hits the blocks until all the blocks disappear. If you do not receive the moving ball and the ball passes the bar, your life decreases one by one. I hope it is a game you played at least once, and even if you never played it before, it is a simple structure, and you will be able to understand soon.
When you make a game, it is better to summarize and express the game with the simplest sentence. Then you can define the core elements of the game in simple terms. Let’s define our Brick Breaker game.

The game player moves the bar to hit the moving ball.
If the ball collides with the block, the block disappears. When all the blocks are removed, the task is completed.
.
Then, let’s define the characters and the roles in the game. In the game, there are bar, ball, blocks, and explosions. The characters appearing in the game are made as the form of Sprite. You don’t have to worry for the unfamiliar term. You will naturally learn it in the process of learning the program.

 Bar (Bar.js): It is a tool for the game player to move left and right to hit the ball. When the ball hits the bar, it is reflected to the opposite direction.
 Ball (Ball.js): It is reflected when it hits the bar, wall, or block. When the ball hits a block and the block is destroyed, the score increases.
 Block (Block.js): It is destroyed when it is hit by the ball, and the ball is reflected. Every time the block is destroyed, score increases, and when all the blocks are destroyed, the game stage is completed.
 Explosion (Explosion.js): It is the effect screen appearing when the ball hits the block, and it is an animation shown with an explosion sound effect.