Hour of makecode rps (#579)

* local commit

* More reaction fixex

* Local commit

* Convert 'rock paper scissors' to a make project

* Revert the 'reaction time' stuff

* Add image for project page

* Add finished make image in last step
This commit is contained in:
Galen Nickel 2017-12-01 20:19:10 -08:00 committed by Sam El-Husseini
parent 4d851407f1
commit 30ab1156c7
8 changed files with 217 additions and 151 deletions

View File

@ -18,4 +18,3 @@ That's it!
Code
## ~

View File

@ -1,161 +1,28 @@
# Rock Paper Scissors
# Rock - Paper - Scissors
## Step 1
## @description A beginner maker activity, creating the Rock-Paper-Scissors game.
We want the @boardname@ to choose rock, paper, or scissors when you shake it.
Place a ``||input:on shake||`` block so when you shake the @boardname@, it will run part of a program.
## ~avatar
```blocks
input.onGesture(Gesture.Shake, () => {
Make the Rock-Paper-Scissors game on your @boardname@ and challenge your friends.
})
```
## ~
## Step 2
![Rock Paper Scissors game on wrist](/static/mb/projects/rock-paper-scissors.jpg)
Add a ``weapon`` variable to store a random number computed with ``||math:pick random||``.
## Duration: ~20 minutes.
When you shake the @boardname@, it should pick a random number from `0` to `2`
and store it in the variable `weapon`. (This variable is named `weapon` because
rock, paper, and scissors are the weapons you use to battle your friends!)
## Materials
```blocks
let weapon = 0;
input.onGesture(Gesture.Shake, () => {
weapon = Math.random(3)
})
* @boardname@, battery holder and 2 AAA batteries
* Roll of duct tape (maybe 2 rolls if you want another color)
* Velcro
```
## Activities
In a later step, each of the possible numbers (`0`, `1`, or `2`) is matched to its own picture. The picture is shown on the LEDs when its number is picked.
* [Make](/projects/rock-paper-scissors/make)
* [Code](/projects/rock-paper-scissors/code)
## Step 3
Place an ``if`` block under the ``||math:pick random||`` and
check whether ``weapon`` is equal to ``0``.
```blocks
let weapon = 0;
input.onGesture(Gesture.Shake, () => {
let weapon = Math.random(3)
if (weapon == 0) {
}
})
```
## Step 4
In the ``if`` block, place a ``||basic:show leds||`` block that shows a
picture of a piece of paper.
```blocks
let weapon = 0;
input.onGesture(Gesture.Shake, () => {
let weapon = Math.random(3)
if (weapon == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
}
})
```
## Step 5
Add an ``else if`` block to the ``if`` block and check whether ``weapon``
is equal to ``1``.
Click on the gearwheel icon to open up the ``if`` editor; then drag and drop an ``else if`` block in the ``if`` editor.
```blocks
let weapon = 0;
input.onGesture(Gesture.Shake, () => {
let weapon = Math.random(3)
if (weapon == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
} else if (weapon == 1) {
}
})
```
## Step 6
Place a ``||basic:show leds||`` block under the else if and draw a **rock** image on the screen.
```blocks
let weapon = 0;
input.onGesture(Gesture.Shake, () => {
let weapon = Math.random(3)
if (weapon == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
} else if (weapon == 1) {
basic.showLeds(`
. . . . .
. # # # .
. # # # .
. # # # .
. . . . .
`)
}
})
```
## Step 7
Add a ``||basic:show leds||`` block with a picture of scissors to the ``else`` part.
You don't need to check if `weapon` is `2` because `2` is the only number left out of `0`, `1`, and `2`.
That's why you can use an ``else`` instead of an ``else if``.
```blocks
let weapon = 0;
input.onGesture(Gesture.Shake, () => {
let weapon = Math.random(3)
if (weapon == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
} else if (weapon == 1) {
basic.showLeds(`
. . . . .
. # # # .
. # # # .
. # # # .
. . . . .
`)
} else {
basic.showLeds(`
# # . . #
# # . # .
. . # . .
# # . # .
# # . . #
`)
}
})
```
## Step 8
Your game is ready! Gather your friends and play Rock Paper Scissors!
## ~button /projects/rock-paper-scissors/make
Let's get started!
## ~

View File

@ -0,0 +1,161 @@
# Rock Paper Scissors
## Step 1
We want the @boardname@ to choose rock, paper, or scissors when you shake it.
Place a ``||input:on shake||`` block so when you shake the @boardname@, it will run part of a program.
```blocks
input.onGesture(Gesture.Shake, () => {
})
```
## Step 2
Add a ``tool`` variable to store a random number computed with ``||math:pick random||``.
When you shake the @boardname@, it should pick a random number from `0` to `2`
and store it in the variable `tool`. (This variable is named `tool` because
rock, paper, and scissors are the tools you use to challenge your friends!)
```blocks
let tool = 0;
input.onGesture(Gesture.Shake, () => {
tool = Math.random(3)
})
```
In a later step, each of the possible numbers (`0`, `1`, or `2`) is matched to its own picture. The picture is shown on the LEDs when its number is picked.
## Step 3
Place an ``if`` block under the ``||math:pick random||`` and
check whether ``tool`` is equal to ``0``.
```blocks
let tool = 0;
input.onGesture(Gesture.Shake, () => {
let tool = Math.random(3)
if (tool == 0) {
}
})
```
## Step 4
In the ``if`` block, place a ``||basic:show leds||`` block that shows a
picture of a piece of paper.
```blocks
let tool = 0;
input.onGesture(Gesture.Shake, () => {
let tool = Math.random(3)
if (tool == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
}
})
```
## Step 5
Add an ``else if`` block to the ``if`` block and check whether ``tool``
is equal to ``1``.
Click on the gearwheel icon to open up the ``if`` editor; then drag and drop an ``else if`` block in the ``if`` editor.
```blocks
let tool = 0;
input.onGesture(Gesture.Shake, () => {
let tool = Math.random(3)
if (tool == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
} else if (tool == 1) {
}
})
```
## Step 6
Place a ``||basic:show leds||`` block under the else if and draw a **rock** image on the screen.
```blocks
let tool = 0;
input.onGesture(Gesture.Shake, () => {
let tool = Math.random(3)
if (tool == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
} else if (tool == 1) {
basic.showLeds(`
. . . . .
. # # # .
. # # # .
. # # # .
. . . . .
`)
}
})
```
## Step 7
Add a ``||basic:show leds||`` block with a picture of scissors to the ``else`` part.
You don't need to check if `tool` is `2` because `2` is the only number left out of `0`, `1`, and `2`.
That's why you can use an ``else`` instead of an ``else if``.
```blocks
let tool = 0;
input.onGesture(Gesture.Shake, () => {
let tool = Math.random(3)
if (tool == 0) {
basic.showLeds(`
# # # # #
# . . . #
# . . . #
# . . . #
# # # # #
`)
} else if (tool == 1) {
basic.showLeds(`
. . . . .
. # # # .
. # # # .
. # # # .
. . . . .
`)
} else {
basic.showLeds(`
# # . . #
# # . # .
. . # . .
# # . # .
# # . . #
`)
}
})
```
## Step 8
Your game is ready! Gather your friends and play Rock Paper Scissors!

View File

@ -0,0 +1,39 @@
# Make
## Materials
* @boardname@, battery holder and 2 AAA batteries
* Roll of duct tape (maybe 2 rolls if you want another color)
* Velcro
## Steps
### Step 1 - Cut the pieces of tape
Cut 2 Pieces of Duct Tape about 9-10 inches long. Press the sticky sides together to form one piece of tape (this is tricky!). This makes the band of your wrist cuff.
![Cut and roll the tape](/static/mb/projects/rock-paper-scissors/cut-roll-tape.jpg)
### Step 2 - Attach the micro:bit and battery pack
Mount the micro:bit in the center of your wrist cuff band by looping a piece of duct tape around in a circle.
![Attach a micro:bit](/static/mb/projects/rock-paper-scissors/attach-mb.jpg)
Attach the battery pack to the micro:bit and tape it on the wrist cuff band on the opposite side from the micro:bit.
### Step 3 - Add the wrist fasteners the micro:bit
Attach Velcro tabs at the ends of the wrist cuff as fasteners. You may need to try it on your wrist to adjust the size.
![Add wrist fasteners](/static/mb/projects/rock-paper-scissors/wrist-fastener.jpg)
### Step 4 - Decorate it!
Decorate the wrist cuff with stickers, glitter, markers, etc.
![Rock Paper Scissors game on wrist](/static/mb/projects/rock-paper-scissors.jpg)
## ~button /projects/rock-paper-scissors/code
NEXT: Code the game!
## ~

Binary file not shown.

After

Width:  |  Height:  |  Size: 117 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB