diff --git a/docs/projects/guitar.md b/docs/projects/guitar.md new file mode 100644 index 00000000..fc7c8273 --- /dev/null +++ b/docs/projects/guitar.md @@ -0,0 +1,36 @@ +# Guitar +![guitar icon](/static/mb/projects/guitar.png) +### @description A beginner-intermediate maker activity, building a guitar with the micro:bit + +### ~avatar avatar + +Make a micro:bit guitar with this guided tutorial! + +### ~ +*playing micro:bit guitar* +https://youtu.be/GYmdTFvxz80 + +## Duration + +5 Activities, approx 30-45 min each based on familiarity with the coding concepts + +## Materials +* Cardboard large pieces (recycle!) +* Tape (masking, duct Tape, and/or packing tape) +* Markers and/or paint +* Aluminum Foil +* Scissors that can cut cardboard +* 1 micro:bit, battery holder and 2 AAA batteries +* 4-5 Crocodile clips +* Headphones + +## Activities +* [Making the Guitar Body](/projects/guitar/making) +* [Buttons, Display & Sound](/projects/guitar/displaybuttons) +* [Light Sensor Tone control](/projects/guitar/lightsensor) +* [Accelerometer Beat control](/projects/guitar/accelerometer) +* [Pin Press Switch](/projects/guitar/pinpress) + +### ~button /projects/guitar/making +Let's get started! +### ~ diff --git a/docs/projects/guitar/accelerometer.md b/docs/projects/guitar/accelerometer.md new file mode 100644 index 00000000..22cad8ea --- /dev/null +++ b/docs/projects/guitar/accelerometer.md @@ -0,0 +1,114 @@ +# Accelerometer Beat control + +### @description micro:bit guitar: using accelerometer to control tempo + +### ~avatar avatar + +Use the Accelerometer to control guitar tempo +* Duration: 30 - 45 minutes +* Concepts: + * Gravity + * Acceleration + * X, Y, Z coordinates + * Tempo + * Beat + * Mapping + * Graphing + * Absolute value + +### ~ + +*accelerometer controlled tempo* +https://youtu.be/h_gPkBaVkoo +TODO: add sound to video +## Blocks + +```cards +input.acceleration(Dimension.Y) +music.setTempo(120) +pins.map(0, 0, 1023,60, 320) +Math.abs(1) +``` + +## Accelerometer, gravity and tilting! + +The micro:bit contains an **accelerometer** sensor that is able to measure forces applied to the board. +On earth, we are subject to the **gravity force** which pulls us to the ground! + +https://youtu.be/0SULoTKmkhI + +When the micro:bit is flat on a table, with the screen pointing up, the gravity force is aligned +with the **Z** axis of the micro:bit. + +![micro:bit x, y, z axis image](/static/mb/projects/guitar/accelleration_axis.png) + +If you tilt it up and down, the force will align with the **Y** axis -- this is how we can detect tilting!!! +If the force along **Y** grows, the micro:bit is tilting more and more vertically! + +## Measuring Acceleration along different coordinates (X, Y, Z axis) + +The acceleration block approximately measures **milli-g**, which is 1/1000 of a **g** or the +acceleration of gravity. + +### Step 1: Graphing acceleration +```blocks +basic.forever(() => { + led.plotBarGraph(input.acceleration(Dimension.Y), 1023) +}) +``` +**Create the code** that measures the change in the Y axis acceleration as a graph on the LEDs + +**Dowload the code** to the micro:bit + +**Test the movements that move the graph from 1 to 5 bars on the LEDs** + +### Extra + +Try graphing the acceleration along the **X** and **Z** axis. Can you explain the differences? + +### ~hint +## Mapping +**It is common to map one standard to another - such as with temperature** +![Fahrenheit to Celsius](/static/mb/projects/guitar/map_analogy.png "Fahrenheit to Celsius") +### ~ + +### Step 2: Mapping acceleration to Beat +**micro:bit sensors produce signal values between 0 to 1023. The *[map block](/reference/pins/map)* converts the signal to a desired range.** +```blocks +basic.forever(() => { + music.setTempo(pins.map(Math.abs(input.acceleration(Dimension.Y)), + 0, 1023, + 60, 320)) + music.playTone(Note.C, music.beat(BeatFraction.Quarter)); +}) +``` + +**Create the code** that *Maps* Y axis acceleration as *tempo* + +**Download the code** to the micro:bit on the guitar + +**Test the movements that speed and slow the tempo** + +### Step 3: Combine with light sensor tone control +**Put it all together!** + +```blocks +basic.forever(() => { + music.setTempo(pins.map(Math.abs(input.acceleration(Dimension.Y)), + 0, 1023, + 60, 320)) + music.playTone( + input.lightLevel() * 25, + music.beat(BeatFraction.Quarter) + ); +}) +``` +**Combine the code above with the light sensor tone control code from the previous activity** + +**Download the code** to the micro:bit on the guitar + +### Now play the guitar adjusting tone and tempo using the light sensor and accelerometer! + +### ~button /projects/guitar/pinpress +NEXT: Pin Press on/off +### ~ diff --git a/docs/projects/guitar/displaybuttons.md b/docs/projects/guitar/displaybuttons.md new file mode 100644 index 00000000..b88da6a3 --- /dev/null +++ b/docs/projects/guitar/displaybuttons.md @@ -0,0 +1,179 @@ +# Buttons, Display & Sound +### @description micro:bit guitar: using buttons with display and sound + +### ~avatar avatar +Use Button Events to control LED Display and play Sound +* **Concepts:** + * Events + * Tone/Note + * Sequence + +### ~ + +## Duration: 30 - 45 minutes + +## Materials + +A micro:bit, battery pack and 2 x AAA batteries + +![battery pack and micro:bit](/static/mb/projects/guitar/microbit.jpg) + +2 to 4 crocodile clips + +![crocodile clips](/static/mb/projects/guitar/crocclips.jpg) + +Headphones + +![earbud headphones](/static/mb/projects/guitar/headphones.jpg) + +## Blocks + +```cards + basic.showLeds(` + . # . # . + . . . . . + . # # # . + . # . # . + . # # # . + `); +input.onButtonPressed(Button.A, () => {}); +music.playTone(Note.C, music.beat(BeatFraction.Quarter)) +music.rest(music.beat(BeatFraction.Whole)) +music.beat(BeatFraction.Quarter) +``` + +## Step 1: Make a Smiley +Open [codethemicrobit.com](https://codethemicrobit.com) in your web browser +```blocks + basic.showLeds(` + . # . # . + . . . . . + . # # # . + . # . # . + . # # # . + `); +``` +From **Basics**, drag a **show LEDs** block into the coding area + * Create a face with LEDs + +![micro:bit USB connection](/static/mb/projects/guitar/connectmicrobit.jpg) +Connect your micro:bit to your computer via USB and click **`Download`**. +Follow the instructions to move the code to your micro:bit. + +## Step 2: Add Smiley LED Button Events +```blocks +input.onButtonPressed(Button.A, () => { + basic.showLeds(` + . # . # . + . . . . . + . # # # . + . # . # . + . # # # . + `) +}) +input.onButtonPressed(Button.B, () => { + basic.showLeds(` + . # . # . + . . . . . + . . . . . + # . . . # + . # # # . + `) +}) +``` + +From **Input**, drag an **on button 'A' pressed** block into the coding area + +* Snap the LED face into the block + +* Create a 'B' button block with a different LED face + +* Download the code to your micro:bit and try the A & B buttons + + +## Step 3: Add Headphone Speakers using Crocodile clips + +![crocodile clips attached to pins 0 and GND](/static/mb/projects/guitar/crocclipintoboard.jpg) + +![crocodile clips attached to headphone jack](/static/mb/projects/guitar/jacktocrocs.jpg) +Connect **GND** to the **base of the headphone jack** using a second crocodile clip (usually black) + +Connect **pin 0** to the **tip of the headphone jack** with a crocodile clip + +*attaching batteries and micro:bit* +https://youtu.be/zwRTmpKIaVU +Attach the micro:bit & battery-pack to the guitar body + +*connecting headphone speaker* +https://youtu.be/ewyEW_U5G9M +Connect the headphones with crocodile clips + +### ~hint +## The micro:bit can play music + +The **play tone** block allows a range letter note tones from **C** to **B5**. +Songs are played using sequences notes. Like the beginning of a birthday song (C, C, D, C, F, E). +```blocks +input.onButtonPressed(Button.A, () => { + music.playTone(Note.C, music.beat(BeatFraction.Quarter)) + music.rest(music.beat(BeatFraction.Whole)) + music.playTone(Note.C, music.beat(BeatFraction.Quarter)) + music.rest(music.beat(BeatFraction.Whole)) + music.playTone(Note.D, music.beat(BeatFraction.Quarter)) + music.rest(music.beat(BeatFraction.Whole)) + music.playTone(Note.C, music.beat(BeatFraction.Quarter)) + music.rest(music.beat(BeatFraction.Whole)) + music.rest(music.beat(BeatFraction.Whole)) + music.playTone(Note.F, music.beat(BeatFraction.Half)) + music.rest(music.beat(BeatFraction.Whole)) + music.playTone(Note.E, music.beat(BeatFraction.Whole)) +}) +``` +### ~ +## Step 4: Add Tone Playing Events for Buttons A & B +```blocks +input.onButtonPressed(Button.A, () => { + basic.showLeds(` + . # . # . + . . . . . + . # # # . + . # . # . + . # # # . + `) + music.playTone(Note.A, music.beat(BeatFraction.Whole)) +}) +input.onButtonPressed(Button.B, () => { + basic.showLeds(` + . # . # . + . . . . . + . . . . . + # . . . # + . # # # . + `) + music.playTone(Note.G, music.beat(BeatFraction.Whole)) +}) +``` +From **Music**, drag **play tone *C* for *1* beat** block under the **show leds** in **Button A Pressed** + + * modify **tone** by choosing a note (*letter*) and experiment with high and low pitches + * set **beat** to 1 + +**Repeat** for **Button B** event + +**Download the code** to the micro:bit + +**Try the A & B buttons** with headphones and power connected + +## Congratulations on completing the basic guitar! +**Challenge:** Create Samples of longer music to play for each button instead of the single tone + * *Tip*: Search for "ABC music notation" or "Easy Music Notes" + the name of a song + +## Extra + +* [Smiley Buttons tutorial](/projects/smiley-buttons) +* [Hack your headphones](/projects/hack-your-headphones) + + +### ~button /projects/guitar/lightsensor +NEXT: Light Sensor Tone Control +### ~ \ No newline at end of file diff --git a/docs/projects/guitar/lightsensor.md b/docs/projects/guitar/lightsensor.md new file mode 100644 index 00000000..d08dbe65 --- /dev/null +++ b/docs/projects/guitar/lightsensor.md @@ -0,0 +1,116 @@ +# Light Sensor Tone control + +### @description micro:bit guitar: using light sensor to control tone + +### ~avatar avatar + +Use the Light Sensor to control guitar Tone +* **Duration:** 30 - 45 minutes +* **Concepts:** + * Inputs + * Light Intensity + * Tone/Frequency + * Ratio Mapping + * Forever Loop + * Math (multiplication) with code properties +* **Resources:** + * This guitar is inspired by the [Theremin](https://en.wikipedia.org/wiki/Theremin) + +### ~ + +*playing tones with light sensor* +https://youtu.be/2cKg9pokVC4 + +## The micro:bit LEDs Light Sensors + +- the micro:bit can detect external light level intensity reaching the LEDs +- the light level block reports a reading of values 0 (*dark*) to 255 (*bright*) +- a **Forever Loop** is required to continually use measure the current light level to control the tone + +## Forever Loop + +The forever loop really does run forever. The forever loop is useful when there is a need to continually check for an event or use a changing value in code. + +## Blocks + +```cards +basic.forever(() => {}) +input.lightLevel() +led.plotBarGraph(0, 255) +music.playTone(Note.C, music.beat(BeatFraction.Quarter)) +``` + +## Step 1: Create a light level detector +```blocks +basic.forever(() => { + led.plotBarGraph(input.lightLevel(), 255) +}) +``` +**Build the blocks** + * From **Basic** drag a **forever loop** block into the coding area + * From **Led** drag a **plot bar graph** block into the **forever loop** + * From **Input** drag a **light level** block into **plot bar graph *of*** + +**Set the *plot bar graph* value *up to* = *255* ** + +## Step 2: Test the light required to move the bar graph height + +*graphing light input* +https://youtu.be/pqU7bTcfQ_s +Experiment to see the effect on graph height when the **plot bar graph** value ***up to*** is changed + +**255 is the maximum light input reading**, try numbers smaller than 255 +**Find a value** that allows the graph to show 1 - 5 bars + +### ~hint +### Frequency +**Frequency** measured in Hz which are cycles per second or vibrations per second + * A healthy human ear can detect frequencies in the range of 20Hz to 20,000Hz. + * The micro:bit + headphones reliably produce detectable output ~50Hz - 6,000Hz. + +**261Hz** represents a C note +```blocks +music.playTone(261, music.beat(BeatFraction.Half)) +``` +**play tone** blocks can specify a specific numeric **Frequency** +by replacing the letter note 261Hz represents a **C** note with a **number** block +```blocks +music.playTone(261, music.beat(BeatFraction.Half)) +``` +### ~ + +## Step 3: Multiply Frequency using Math blocks + ```blocks +input.onButtonPressed(Button.A, () => { + music.playTone(261 * 2, music.beat(BeatFraction.Half)) +}) +``` +create a **play tone** block using a **Math** section, **multiplication** block to set *tone* + +### Next +**Add** a **B** button block that multiplies the **261** tone by a number other than 2 to set tone + +**Download the code to the micro:bit** + +**Test the sound for multiples of the 261Hz *C* frequency** + +## Step 4: Control the Frequency with the light input +```blocks +basic.forever(() => { + music.playTone(input.lightLevel() * 25, music.beat(BeatFraction.Quarter)) +}) +``` +**Create a *forever loop* containing a *play tone* block** + +**Set *tone*, using *Math* multiplication block that multiplies *light level* input by 25** +or experiment with multipliers larger and smaller than 25 + +**Test light tone control on the guitar** +Cover the LEDs with your hand to vary light detected to control the tone + +## Good work, this guitar is sounding good! +**Challenge:** Create a variable for the light level multiplier that you can change using buttons (optional) + +### ~button /projects/guitar/accelerometer +NEXT: Accelerometer Beat control +### ~ diff --git a/docs/projects/guitar/making.md b/docs/projects/guitar/making.md new file mode 100644 index 00000000..0f67e9ea --- /dev/null +++ b/docs/projects/guitar/making.md @@ -0,0 +1,59 @@ +# Making the Guitar Body +### @description Maker Project for Guitar Body for micro:bit + +### ~avatar avatar + +Make the Guitar Body for your micro:bit Guitar + +### ~ + +## Duration: ~45 minutes + +## Materials + * Cardboard large pieces (recycle!) + * Tape (masking, duct Tape, and/or packing tape) + * Scissors that can cut cardboard + * Markers and/or paint + +![Materials: cardboard, tape, scissors, markers](/static/mb/projects/guitar/materials.jpg) + +## Step 1: Design the body +*tracing the guitar design* +https://youtu.be/xMSrWaOZkFg + +* Search for [Guitar Silhouette](https://www.bing.com/images/search?q=Guitar+Silhouettes) design ideas and customize +the shape of your guitar +* Trace the design on a flat piece of cardboard (40-80 cm is best) + +### ~hint + + * Avoid small details that are difficult to cut into cardboard + * Unfolding a box gives longer pieces of cardboard, and creases can be reinforced + +### ~ + +## Step 2: Cut out the body +*cutting the cardboard* +https://youtu.be/aUQkrFoEank + + +## Step 3: Personalize the Guitar + +Create unique styling using tape, markers, paint and other available materials (*calling all artist!*) + +*decorating the guitar* +https://youtu.be/zNAZTJeSxY8 + +Everyone can come up with a unique design! + +![guitar design samples](/static/mb/projects/guitar/otherdesigns.jpg) + +## Extra! +*strengthening the guitar* +https://youtu.be/q0GkQdJmxjE + +Strengthen the guitar next with an angled cardboard strip (*optional*). + +### ~button /projects/guitar/displaybuttons +NEXT: Buttons, Display and Sound +### ~ \ No newline at end of file diff --git a/docs/projects/guitar/pinpress.md b/docs/projects/guitar/pinpress.md new file mode 100644 index 00000000..6e5fb6b2 --- /dev/null +++ b/docs/projects/guitar/pinpress.md @@ -0,0 +1,128 @@ +# Pin Press Switch + +### @description micro:bit guitar: use pin press to toggle guitar play on/off + +### ~avatar avatar +Use pin press to switch guitar play on/off +* **Duration:** approximately 45 minutes +* **Materials:** + * 2-3 Crocodile clips +* Concepts: + * Circuit + * Conductor + * Variable/Global-Variable + * Conditional: **`if`**, **`else`** + * Boolean: **`True`/`False`** +### ~ + +## Blocks + +```cards +var on = false +on; +if (on) { } else {} +input.onPinPressed(TouchPin.P1, () => {}) +``` + + + +### ~hint +## Circuits & Switches +* **Circuits** need a power supply (battery), a resister (like a LED) & a conductor (metal, water, hand) +* **Switches** turn electric power on by closing (completing) a circuit with a conductor so power can flow + +**Metal foil and wires make excellent conductors** + +**In this activity we use YOU to conduct electricity** +**to close the circuit that switches the guitar ON and OFF!** +### ~ + +## Step 1: Pin Press Test + +```blocks +input.onPinPressed(TouchPin.P0, () => { + basic.showNumber(0) +}) +input.onPinPressed(TouchPin.P1, () => { + basic.showNumber(1) +}) +input.onPinPressed(TouchPin.P2, () => { + basic.showNumber(2) +}) +``` +**Create the pin-press code** + +**Download the code** on the micro:bit + +https://youtu.be/PAIU-vHqyGU + +**Hold the micro:bit touching The GND pin with one hand** +**with the other hand alternately touch the 0, 1 and 2 pins** + +### ~hint +**The electric signal traveled from pins, between your hands to `GND` and the micro:bit detected the electric signal!** +### ~ + +## Step 2: Installing conductive foil on the guitar +https://youtu.be/NX0ECcpXFes +**Add foil to the guitar body where it is easy to touch while playing** + +**Connect the foil to `GND` using a crocodile clip** + +https://youtu.be/YkymZGNmkrE +**Add foil to the guitar neck** + +**Connect the foil to `pin 1` using a crocodile clip** + +## Step 3: Add a switch to turn the guitar ON and OFF +**Using the `on` global variable we can switch the message on the micro:bit** +**between ON and OFF** +```blocks +let on = false +basic.forever(() => { + if (on == true) { + basic.showString("ON") + } else { + basic.showString("OFF") + } +}) +input.onPinPressed(TouchPin.P1, () => { + if (on == true) { + on = false + } else { + on = true + } +}) +``` +**Create the ON/OFF switch code** + +**Download the code on the micro:bit** + +**Test by touching `P1` to toggle the LED message between ON and OFF** + +*Final code* +TODO: do we want to use `on = !on;` or be more direct in flipping the switch? `on = true; on = false;` +```blocks +var on = false +basic.forever(() => { + if (on) { + music.setTempo(pins.map(Math.abs(input.acceleration(Dimension.Y)), + 0, 1023, + 60, 320)) + music.playTone( + input.lightLevel() * 25, + music.beat(BeatFraction.Quarter) + ); + } else { + music.rest(music.beat()) + } +}) +input.onPinPressed(TouchPin.P1, () => { + on = !on; +}) +``` +## Now Play! +**Turn the guitar ON and OFF with a pin press on the connected foil** +**touching both pieces of foil at the same time to connect the switches** + +https://youtu.be/GYmdTFvxz80 \ No newline at end of file diff --git a/docs/static/mb/projects/guitar.png b/docs/static/mb/projects/guitar.png new file mode 100644 index 00000000..6866549b Binary files /dev/null and b/docs/static/mb/projects/guitar.png differ diff --git a/docs/static/mb/projects/guitar/accelleration_axis.png b/docs/static/mb/projects/guitar/accelleration_axis.png new file mode 100644 index 00000000..9e620d6b Binary files /dev/null and b/docs/static/mb/projects/guitar/accelleration_axis.png differ diff --git a/docs/static/mb/projects/guitar/connectmicrobit.jpg b/docs/static/mb/projects/guitar/connectmicrobit.jpg new file mode 100644 index 00000000..8f22e8e5 Binary files /dev/null and b/docs/static/mb/projects/guitar/connectmicrobit.jpg differ diff --git a/docs/static/mb/projects/guitar/crocclipintoboard.jpg b/docs/static/mb/projects/guitar/crocclipintoboard.jpg new file mode 100644 index 00000000..23f46b69 Binary files /dev/null and b/docs/static/mb/projects/guitar/crocclipintoboard.jpg differ diff --git a/docs/static/mb/projects/guitar/crocclips.jpg b/docs/static/mb/projects/guitar/crocclips.jpg new file mode 100644 index 00000000..7acdd656 Binary files /dev/null and b/docs/static/mb/projects/guitar/crocclips.jpg differ diff --git a/docs/static/mb/projects/guitar/headphones.jpg b/docs/static/mb/projects/guitar/headphones.jpg new file mode 100644 index 00000000..9b05f0b4 Binary files /dev/null and b/docs/static/mb/projects/guitar/headphones.jpg differ diff --git a/docs/static/mb/projects/guitar/jacktocrocs.jpg b/docs/static/mb/projects/guitar/jacktocrocs.jpg new file mode 100644 index 00000000..4f6520f1 Binary files /dev/null and b/docs/static/mb/projects/guitar/jacktocrocs.jpg differ diff --git a/docs/static/mb/projects/guitar/map_analogy.png b/docs/static/mb/projects/guitar/map_analogy.png new file mode 100644 index 00000000..1235e679 Binary files /dev/null and b/docs/static/mb/projects/guitar/map_analogy.png differ diff --git a/docs/static/mb/projects/guitar/mapanalogy.JPG b/docs/static/mb/projects/guitar/mapanalogy.JPG new file mode 100644 index 00000000..53b2c65e Binary files /dev/null and b/docs/static/mb/projects/guitar/mapanalogy.JPG differ diff --git a/docs/static/mb/projects/guitar/materials.jpg b/docs/static/mb/projects/guitar/materials.jpg new file mode 100644 index 00000000..9df09e04 Binary files /dev/null and b/docs/static/mb/projects/guitar/materials.jpg differ diff --git a/docs/static/mb/projects/guitar/microbit.jpg b/docs/static/mb/projects/guitar/microbit.jpg new file mode 100644 index 00000000..4d4b0495 Binary files /dev/null and b/docs/static/mb/projects/guitar/microbit.jpg differ diff --git a/docs/static/mb/projects/guitar/otherdesigns.jpg b/docs/static/mb/projects/guitar/otherdesigns.jpg new file mode 100644 index 00000000..7bc0d3a1 Binary files /dev/null and b/docs/static/mb/projects/guitar/otherdesigns.jpg differ diff --git a/docs/static/mb/projects/guitar/usbcable.jpg b/docs/static/mb/projects/guitar/usbcable.jpg new file mode 100644 index 00000000..4ec68d1a Binary files /dev/null and b/docs/static/mb/projects/guitar/usbcable.jpg differ diff --git a/package.json b/package.json index ddd9ae28..488820cb 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,6 @@ "typescript": "^1.8.7" }, "dependencies": { - "pxt-core": "0.4.25" + "pxt-core": "0.4.26" } }