diff --git a/subjects/ascii-art/README.md b/subjects/ascii-art/README.md index 3485f192f..8acc1c9d2 100644 --- a/subjects/ascii-art/README.md +++ b/subjects/ascii-art/README.md @@ -9,7 +9,6 @@ Ascii-art consists on receiving a `string` as an argument and outputting the `st This project will help you learn about : -- Client utilities. - The Go file system(**fs**) API. - Ways to receive data. - Ways to output data. diff --git a/subjects/ascii-art/color/README.md b/subjects/ascii-art/color/README.md index ab6406696..37c7d0d24 100644 --- a/subjects/ascii-art/color/README.md +++ b/subjects/ascii-art/color/README.md @@ -11,7 +11,6 @@ You must follow the same [instructions](https://public.01-edu.org/subjects/ascii This project will help you learn about : -- Client utilities. - The Go file system(**fs**) API. - RGB color model. - Ways to receive data. diff --git a/subjects/ascii-art/fs/README.md b/subjects/ascii-art/fs/README.md index be4a58b07..e8e274eb7 100644 --- a/subjects/ascii-art/fs/README.md +++ b/subjects/ascii-art/fs/README.md @@ -6,7 +6,6 @@ You must follow the same [instructions](https://public.01-edu.org/subjects/ascii This project will help you learn about : -- Client utilities. - The Go file system(**fs**) API. - Ways to receive data. - Ways to output data. diff --git a/subjects/ascii-art/justify/README.md b/subjects/ascii-art/justify/README.md index 4ba069571..648df8a40 100644 --- a/subjects/ascii-art/justify/README.md +++ b/subjects/ascii-art/justify/README.md @@ -13,7 +13,6 @@ You must follow the same [instructions](https://public.01-edu.org/subjects/ascii This project will help you learn about : -- Client utilities. - The Go file system(**fs**) API. - Ways to receive data. - Ways to output data. diff --git a/subjects/ascii-art/output/README.md b/subjects/ascii-art/output/README.md index 8517d7cce..ec84de5ea 100644 --- a/subjects/ascii-art/output/README.md +++ b/subjects/ascii-art/output/README.md @@ -8,7 +8,6 @@ This project will help you learn about : -- Client utilities. - The Go file system(**fs**) API. - Ways to receive data. - Ways to output data. diff --git a/subjects/ascii-art/reverse/README.md b/subjects/ascii-art/reverse/README.md index d6b617e58..dde0400d3 100644 --- a/subjects/ascii-art/reverse/README.md +++ b/subjects/ascii-art/reverse/README.md @@ -11,7 +11,6 @@ You must follow the same [instructions](https://public.01-edu.org/subjects/ascii This project will help you learn about : -- Client utilities. - The Go file system(**fs**) API. - Ways to receive data. - Ways to output data. diff --git a/subjects/bomberman-dom/README.md b/subjects/bomberman-dom/README.md new file mode 100644 index 000000000..11c5fac68 --- /dev/null +++ b/subjects/bomberman-dom/README.md @@ -0,0 +1,79 @@ +## bomberman-dom + +You certainly know [bomberman](https://en.wikipedia.org/wiki/Bomberman) right? Good good. You will make it. Relax, is not that hard, it is only a multiplayer version of it. Ah and forgot to mention that you will need to do it using the framework you created a while ago. Let me explain. + +### Objectives + +For this project you have to create a bomberman alike game, where multiple players can join in and battle until one of them is the last man standing. + +### Instructions + +In the beginning there was 4 players, and only one came out alive. Each player will have to start in the different corners of the map and only one will be victorious. + +You will have to follow more a less the same principles has the [make-your-game](https://public.01-edu.org/subjects/make-your-game/) project. But we will refresh one of the concepts you will have to respect and deal with: + +- [**Performance**](https://public.01-edu.org/subjects/good-practices/), is one of the most important aspects while developing a game, so lets respect it.\ + Just like make-your-game you will have to respect the policy of: + + - Running the game at least at **60fps** at all time + - No frame drops + - Proper use of [**`requestAnimationFrame`**](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) + - Measuring performance to know if your code is fast + +You must not use canvas neither [Web-GL](https://get.webgl.org/) or other framework. For this project you will use the framework you did on the [mini-framework](https://public.01-edu.org/subjects/mini-framework/) project. + +You will have to make also a chat that enables the different players to talk to each other. As you will have to use [WebSockets](https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API), this **chat can be considered as a "Hello World" of the multiplayer feature** for the **bomberman-dom**. + +#### Game Mechanics + +1. Players + + 1. Nº of players: 2 - 4 + 2. Each player must have 3 lives. Then you are out!! + +2. Map + + 1. The map should be fixed so that every player sees the whole map. + 2. There will be two types of blocks, the ones that can be destroyed (blocks) and the ones that can not (walls). + 1. The walls will be placed always in the same place, while the blocks are meant to be generated randomly on the map. Tip: the optional project [different maps](https://public.01-edu.org/subjects/make-your-game/different-maps) can be useful for this part. + 2. In the starting positions the players need to be able to survive. For example: if the players place a bomb, they will need to have space to avoid the bomb explosion. + 3. The players should be placed in the corners as their starting positions. + +3. Power ups (each time a player destroys a block, a random power up may or may not appear): + + 1. Bombs: Increases the amount of bombs dropped at a time by 1; + 2. Flames: Increases explosion range from the bomb in four directions by 1 block; + 3. Speed: Increases movement speed; + +When the user opens the game, he/she should be presented to a page where he/she should enter a **nickname** to differentiate users. After selecting a nickname the user should be presented to a waiting page with a **player counter** that ends at 4. Once a user joins, the player counter will increment by 1. + +If there are more than 2 players in the counter and it does not reach 4 players before 20 seconds, a 10 second timer starts, to players get ready to start the game.\ +If there are 4 players in the counter before 20 seconds, the 10 seconds timer starts and the game starts. + +#### Bonus + +Although this bomberman already is super cool, it can be always better. Here are some ideas you can implement into the game to make it super awesomely cool: + +- **Solo + Co-Op mode**: You are supposed to develop an AI to play against the players. So once the AI is defeated all players involved win. +- **More power ups**: + - _Bomb Push_: Ability to throw a bomb after it has been placed; + - _Bomb Pass_: Ability to pass through bombs; + - _Block Pass_: Ability to pass through blocks (not walls); + - _Detonator_: Ability to choose when a bomb will explode on a key press; + - _1 Up_: Gives the player an extra life; +- **Release power ups after death**: When a player dies it drops one of it's power ups. If the player had no power ups, it drops a random power up. +- **More than 4 players**: Be able to start a game with more than 4 players +- **Team mode**: Make games with 2v2 or 3v3 (two/three players versus two/three players). +- **After death interaction**: When a player dies, they can reappear as a ghost. If a ghost touches another player they come back to life. If a ghost is caught in a bomb explosion, the player controlling the ghost dies permanently. + +This project will help you learn about: + +- [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) +- [Event loop](https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop) +- FPS +- [Jank/stutter animation](https://murtada.nl/blog/going-jank-free-achieving-60-fps-smooth-websites) +- webSockets +- Synchronization +- Developer Tools + - [Firefox](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools) + - [Chrome](https://developers.google.com/web/tools/chrome-devtools) diff --git a/subjects/bomberman-dom/audit/README.md b/subjects/bomberman-dom/audit/README.md new file mode 100644 index 000000000..4e164dfe6 --- /dev/null +++ b/subjects/bomberman-dom/audit/README.md @@ -0,0 +1,77 @@ +#### Functional + +##### Try to open the game. + +###### Were you able to enter your nickname? + +###### After entering your nickname, were you redirected to a waiting page presenting a player counter? + +###### After entering your nickname, did you have access to a chat? + +##### Try to enter with another user (in another browser or in private browser). + +###### Did the player counter incremented by 1? + +###### After entering with another user, can all users chat with each other in realtime (using websockets)? + +##### Wait 20 seconds with two users in the waiting page. + +###### After 20 seconds did a 10 seconds timer started to begin the game? + +###### After the 10 seconds did the game start? + +##### Try to enter with 4 different users in the waiting page. + +###### As soon as the fourth player entered, did the 10 seconds timer started? + +###### While playing the game, are you able to move and place a bomb? + +###### Can the player see the whole map at once? + +##### Try placing a bomb and standing by it when it explodes. + +###### Did you lose 1 of your 3 lives? + +##### Try to lose all your 3 lives. + +###### Did you lose the game and are not able to play anymore? + +##### Try placing a bomb next to another player. + +###### Did the other player lost a life when the bomb exploded? + +##### Place a bomb next to a destroyable block. + +###### Did the block disappear when the bomb exploded? + +##### Try to destroy every block on the map. + +###### Did the power ups appeared in the places of the blocks? + +###### Can you confirm that there is 4 different types of power ups? + +##### Open the Dev Tool in the Performance tab. + +###### Does it not present frame drop? + +##### Open the Dev Tool in the Performance tab. + +###### Does the game run at or around 60fps? + +##### Open the Dev Tool in the performance tab and select the option rendering with the paint ON. + +###### Is the paint being used as less as possible? + +##### Open the Dev Tool in the performance tab and select the option rendering with the layer ON. + +###### Is the layers being used as less as possible? + +###### Are the creation of the [layers being promoted](https://developers.google.com/web/fundamentals/performance/rendering/stick-to-compositor-only-properties-and-manage-layer-count) properly? + +#### Bonus + +###### +Can the player see how many lives he/she has? + +###### +Is there any display of who won the game? + +###### +Can you play again after the game ends? diff --git a/subjects/forum/README.md b/subjects/forum/README.md index d4b276457..b5bdc114e 100644 --- a/subjects/forum/README.md +++ b/subjects/forum/README.md @@ -71,7 +71,6 @@ For the forum project you must use Docker. You can see all about docker basics o This project will help you learn about: -- Client utilities. - The basics of web : - HTML - HTTP diff --git a/subjects/social-network/README.md b/subjects/social-network/README.md index 810460e54..9941f9117 100644 --- a/subjects/social-network/README.md +++ b/subjects/social-network/README.md @@ -213,7 +213,6 @@ Every other notification created by you that isn't on the list is welcomed too. This project will help you learn about: -- Client utilities - Authentication : - Sessions and cookies - Using and [setting up Docker](https://docs.docker.com/get-started/)