Final edits and image sizing for csintro.

This commit is contained in:
ganicke 2017-08-09 17:28:43 -07:00
parent b73a5e59e0
commit b2d7682998
62 changed files with 132 additions and 52 deletions

View File

@ -55,6 +55,7 @@
* [About](/courses/csintro/about)
* [Introduction](/courses/csintro/introduction)
* [References](/courses/csintro/references)
* [Acknowledgements](/courses/csintro/acknowledgements)
* [Making](/courses/csintro/making)
* [Introduction](/courses/csintro/making/introduction)
* [Unplugged](/courses/csintro/making/unplugged)

View File

@ -46,9 +46,9 @@ Each of the 12 lessons is structured in this format:
4. [Conditionals](/courses/csintro/conditionals)
5. [Iteration](/courses/csintro/iteration)
6. [Review/Mini-Project](/courses/csintro/miniproject)
7. [Coordinate Grid System](/courses/csintro/coordinates)
7. [Coordinate grid system](/courses/csintro/coordinates)
8. [Booleans](/courses/csintro/booleans)
9. [Bits, Bytes, and Binary](/courses/csintro/binary)
9. [Bits, bytes, and binary](/courses/csintro/binary)
10. [Radio](/courses/csintro/radio)
11. [Arrays](/courses/csintro/arrays)
12. [Independent Final Project](/courses/csintro/finalproject)
12. [Independent final project](/courses/csintro/finalproject)

View File

@ -6,7 +6,7 @@ Thank you to the many students who contributed their energy, creativity, and pas
Thank you to Microsoft and to the Micro:bit Foundation for their support of our work. Thank you, as well, to George Saltsman of Lamar University for his original encouragement and support of this project.
Thank you as well to Peli de Halleux for his advice on all sorts of programming questions, as well as for the wonderful Infection Simulation that he created just for this guide. Sam El-Husseini, your advice and wise counsel was instrumental in shaping the format of this book. Richard Knoll, we are so grateful for your help with the Arrays chapter and the Song-Maker example. Galen Nickel, thank you for polishing and formatting our work to look good on the web. To Guillaume, Tom, Brahma, and the entire Microsoft MakeCode team, your caring and support meant so much to our students this year. Thank you!
Thank you as well to Peli de Halleux for his advice on all sorts of programming questions, as well as for the wonderful [Infection](/projects/infection) simulation that he created just for this guide. Sam El-Husseini, your advice and wise counsel was instrumental in shaping the format of this book. Richard Knoll, we are so grateful for your help with the [Arrays](/courses/csintro/arrays) chapter and the [Song-maker](/courses/csintro/arrays/project#song-maker) example. Galen Nickel, thank you for polishing and formatting our work to look good on the web. To Guillaume, Tom, Brahma, and the entire Microsoft MakeCode team, your caring and support meant so much to our students this year. Thank you!
Above all, our sincere thanks to Jacqueline Russell, Project Lead at Microsoft MakeCode. Your patience, advice, and innumerable suggestions and assistance made this curriculum possible.

View File

@ -148,7 +148,26 @@ Remember, MakeCode automatically compiles and runs your program, so all you need
* Feel free to play around with turning LEDs on or off in the show leds blocks until you get the images you want.
* Remember to save your code.
>![Face on micro:bit screen](/static/courses/csintro/algorithms/happy-sad.gif)
```sim
basic.forever(() => {
basic.showLeds(`
. . . . .
. # . # .
. . . . .
# . . . #
. # # # .
`)
basic.pause(800)
basic.showLeds(`
. . . . .
. # . # .
. . . . .
. # # # .
# . . . #
`)
basic.pause(800)
})
```
## Commenting your code
It is good practice to add comments to your code. Comments can be useful in a number of ways. Comments can help you remember what a certain block of code does and/or why you chose to program something the way you did. Comments also help others reading your code to understand these same things.

View File

@ -1,12 +1,14 @@
# Project: Fidget Cube
![Sample fidget cube](/static/courses/csintro/algorithms/fidgetcube.jpg)
A fidget cube is a little cube with something different that you can manipulate on each surface. There are buttons, switches, and dials, and people who like to “fidget” find it relaxing to push, pull, press, and play with it. In this project, students are challenged to turn the micro:bit into their very own “fidget cube”.
Show students some examples of fidget cubes:
* Original Kickstarter Fidget Cube - https://www.kickstarter.com/projects/antsylabs/fidget-cube-a-vinyl-desk-toy (there is a funny video showing the fidget cube in action).
* Original Kickstarter Fidget Cube - [Fidget Cube: A Vinyl Desk Toy](https://www.kickstarter.com/projects/antsylabs/fidget-cube-a-vinyl-desk-toy) (there is a funny video showing the fidget cube in action).
## Discussion questions
* Do any of your students fidget?
* What kinds of things do they fidget with? Spinning pens, fidget spinners, rings, coins?
* There are many different versions of fidget cubes available now. Do any students have any?
@ -18,6 +20,7 @@ Show students some examples of fidget cubes:
Remind students that a computing device has a number of inputs, and a number of outputs. The code that we write processes input by telling the micro:bit what to do when various events occur.
## Project
Make a fidget cube out of the micro:bit, create a unique output for each of the following inputs:
* on button A pressed
* on button B pressed
@ -29,7 +32,7 @@ See if you can combine a maker element similar to what you created in Lesson 1 b
![](/static/courses/csintro/algorithms/fidget-cube.jpg)
Sample fidget cube designs
## Project Mod
## Project mod
* Add more inputs and more outputs - use more than 4 different types of input. Try to use other types of output (other than LEDs) such as sound!
## Assessment

View File

@ -235,7 +235,13 @@ To fix this, we need to do a little math by subtracting 1 from whatever the valu
**Note:** Be sure to hit Refresh a few times on the simulator, because sometimes some stars get hidden behind other stars.
![Random stars](/static/courses/csintro/arrays/random-stars.png)
```block
let list = [5, 2, 1, 3, 4]
for (let index = 0; index < list[0] - 1; index++) {
led.plot(Math.random(5), Math.random(5))
}
```
The above code takes the first value in the array and creates that many stars at random locations. Now, all we need to do is iterate through the entire array and do the same thing for each of the values. We will put the above code inside another loop that will run the same number of times as the length of the array (in this case, 5). You should also use a 'pause' block and a 'clear screen' block in between each constellation.
@ -261,11 +267,17 @@ list = [5, 2, 1, 3, 4]
Traversing an array means proceeding through the elements of the array in sequence. Note that there is a special loop in the Loops Toolbox drawer called for element value of list. This loop automatically takes each element of your array in turn and copies it into a variable called value.
![index loop](/static/courses/csintro/arrays/for-index.png)
```block
for (let index = 0; index <= 4; index++){
}
```
The following code is useful for printing out the values of the elements in your array:
```blocks
let list = [5, 2, 1, 3, 4]
input.onButtonPressed(Button.B, () => {
   for (let value of list) {
       basic.showNumber(value)
@ -279,6 +291,8 @@ However, note that value holds a copy of the element in the array, so changing v
If you run the code below, then print out the array again, you will see that it is unchanged.
```blocks
let list = [5, 2, 1, 3, 4]
input.onButtonPressed(Button.A, () => {
   for (let value of list) {
       value += 1

View File

@ -103,9 +103,9 @@ Have students write a reflection of about 150300 words, addressing the follow
### Maker component
**4 =** Tangible component is tightly integrated with the micro:bit and each relies heavily on the other to make the project complete.
**3 =** Tangible component is somewhat integrated with the micro:bit but is not essential.
**2 =** Tangible component does not add to the functionality of the program.
**4 =** Tangible component is tightly integrated with the micro:bit and each relies heavily on the other to make the project complete.<br/>
**3 =** Tangible component is somewhat integrated with the micro:bit but is not essential.<br/>
**2 =** Tangible component does not add to the functionality of the program.<br/>
**1 =** No tangible component.
### micro:bit program

View File

@ -73,6 +73,8 @@ Now that the virtual CoinA and CoinB have been virtually flipped, we need to com
* Drag the 'if...then...else' block into the 'on shake' block under the 'set' variable blocks
```blocks
let CoinBHeads = false
let CoinAHeads = false
input.onGesture(Gesture.Shake, () => {
CoinAHeads = Math.randomBoolean()
CoinBHeads = Math.randomBoolean()

View File

@ -10,7 +10,7 @@ Students will...
* Understand that the 5 x 5 grid of LEDs on the micro:bit represents a coordinate grid with the origin (0,0) in the top left corner.
* Understand that the values of the x coordinates range from 0 through four and increase from left to right.
* Understand that the values of the y coordinates range from 0 through four and increase from top to bottom.
* Learn how to refer to an individual LED by its x & y coordinates.
* Learn how to refer to an individual LED by its **X** and **Y** coordinates.
* Learn how to plot (turn on) and unplot (turn off) individual LEDs and how to toggle between these two states.
* Learn how to check the current on or off status of an individual LED as well as check and set the brightness level.
* Apply the above knowledge and skills to create a unique program that uses coordinates as an integral part of the program.

View File

@ -9,11 +9,11 @@ Normally, if a show was running, or if someone was actively using the computer,
Your task is to create:
1. A "screen saver" animation using the plot/unplot blocks. You can fill the screen line by line, pausing between each one, or fill it with a random constellation of stars.
* A "screen saver" animation using the plot/unplot blocks. You can fill the screen line by line, pausing between each one, or fill it with a random constellation of stars.
>-- OR --
1. A game that uses sprites to manage the x and y coordinate values of the different objects.
* A game that uses sprites to manage the x and y coordinate values of the different objects.
Your project might use variables to store the values of sprites, which are special structures that contain an x and a y coordinate together that describe the sprite's location as one LED on the screen.

View File

@ -1,6 +1,6 @@
# Review
![Review](/static/courses/csintro/miniproject/review.jpg)
![Review](/static/courses/csintro/miniproject/review.png)
Here is a brief review of the topics we covered in lessons 712.
 

View File

@ -46,12 +46,12 @@ This course takes approximately 14 weeks to complete, spending about 1 week on e
4. [Conditionals](/courses/csintro/conditionals)
5. [Iteration](/courses/csintro/iteration)
6. [Review/Mini-Project](courses/csintro/miniproject)
7. [Coordinate Grid System](/courses/csintro/coordinates)
7. [Coordinate grid system](/courses/csintro/coordinates)
8. [Booleans](/courses/csintro/booleans)
9. [Bits, Bytes, and Binary](/courses/csintro/binary)
9. [Bits, bytes, and binary](/courses/csintro/binary)
10. [Radio](/courses/csintro/radio)
11. [Arrays](/courses/csintro/arrays)
12. [Independent Final Project](/courses/csintro/finalproject)
12. [Independent final project](/courses/csintro/finalproject)
Each of the 12 lessons is comprised of the following parts:

View File

@ -189,7 +189,17 @@ We can use the default values for the rest of the parameters.
You should now see a light moving from left to right along the top row of the micro:bit simulator.
![Moving Dot Top Row](/static/courses/csintro/iteration/moving-dot.gif)
```sim
let index = 0
basic.forever(() => {
   for (let xindex = 0; xindex <= 4; xindex++) {
       led.plot(xindex, 0)
       basic.pause(100)
       led.unplot(xindex, 0)
       basic.pause(100)
   }
})
```
To make our pattern continue through all the leds, we can change the value of the y coordinate as well.
@ -218,7 +228,20 @@ basic.forever(() => {
There! With only a half dozen or so lines of code, we have made our light travel through all the coordinates on the micro:bit screen.
![Moving Dot All](/static/courses/csintro/iteration/moving-dot-all.gif)
```sim
let index = 0
let yindex = 0
basic.forever(() => {
   for (let yindex = 0; yindex <= 4; yindex++) {
       for (let xindex = 0; xindex <= 4; xindex++) {
           led.plot(xindex, yindex)
           basic.pause(100)
           led.unplot(xindex, yindex)
           basic.pause(100)
       }
   }
})
```
**Check:** Make sure the students can read this code.

View File

@ -1,4 +1,4 @@
# Project: Micro:pet
# Project: micro:pet
## Project

View File

@ -1,53 +1,69 @@
# References
We have included some additional reference books and materials if you are interested in learning more about the maker mindset.
##Maker Education, Physical Computing or Design Thinking in the Classroom
## Maker Education, Physical Computing or Design Thinking in the Classroom
![Invent to Learn Book Cover](/static/courses/csintro/references/invent-to-learn.jpg)
* [Invent To Learn](http://inventtolearn.com/)
### [Invent To Learn](http://inventtolearn.com/)
by **Sylvia Libow Martinez and Gary Stager**
> Making, Tinkering, and Engineering in the Classroom By Sylvia Libow Martinez and Gary Stager
Making, Tinkering, and Engineering in the Classroom
![Launch Book Cover](/static/courses/csintro/references/launch.jpg)
* [Launch](http://thelaunchcycle.com/)
[![Invent to Learn Book Cover](/static/courses/csintro/references/invent-to-learn.jpg)](http://inventtolearn.com/)
> Using Design Thinking to Boost Creativity and Bring Out the Maker in Every Student by John Spencer and AJ Juliani
### [Launch](http://thelaunchcycle.com/)
by **John Spencer and AJ Juliani**
![Innovator's Mindset Book Cover](/static/courses/csintro/references/innovators-mindset.jpg)
* [The Innovator's Mindset](http://georgecouros.ca/blog/archives/5715)
Using Design Thinking to Boost Creativity and Bring Out the Maker in Every Student
> Empower Learning, Unleash Talent, and Lead a Culture of Creativity by George Couros
[![Launch Book Cover](/static/courses/csintro/references/launch.jpg)](http://thelaunchcycle.com/)
![Makerspace Projects Book Cover](/static/courses/csintro/references/makerspace-projects.jpg)
* [The Big Book of Makerspace Projects](https://colleengraves.org/bigmakerbook/)
### [The Innovator's Mindset](http://georgecouros.ca/blog/archives/5715)
by **George Couros**
> Inspiring Makers to Experiment, Create, and Learn by Colleen Graves
Empower Learning, Unleash Talent, and Lead a Culture of Creativity
##Code and Computational Thinking
[![Innovator's Mindset Book Cover](/static/courses/csintro/references/innovators-mindset.jpg)](http://georgecouros.ca/blog/archives/5715)
![Code Book Cover](/static/courses/csintro/references/code.jpg)
* [Code](http://www.charlespetzold.com/code/)
### [The Big Book of Makerspace Projects](https://colleengraves.org/bigmakerbook/)
by **Colleen Graves**
> The Hidden Language of Computer Hardware and Software by Charles Petzold
Inspiring Makers to Experiment, Create, and Learn
![Girl Code Book Cover](/static/courses/csintro/references/girl-code.jpg)
* [Girl Code](https://www.girlcodethebook.com/)
![Makerspace Projects Book Cover](/static/courses/csintro/references/makerspace-projects.jpg)
> Gaming, Going Viral, and Getting it Done by Andy Gonzales and Sophie Houser
## Code and Computational Thinking
![Secret Coders Book Cover](/static/courses/csintro/references/secret-coders.jpg)
* [Secret Coders](http://www.secret-coders.com/)
### [Code](http://www.charlespetzold.com/code/)
by **Charles Petzold**
> Secret Coders by Gene Luen Yang and Mike Holmes
The Hidden Language of Computer Hardware and Software
![How to Count Book Cover](/static/courses/csintro/references/how-to-count.png)
* [How to Count](https://stevenf.com/books/)
[![Code Book Cover](/static/courses/csintro/references/code.jpg)](http://www.charlespetzold.com/code/)
### [Girl Code](https://www.girlcodethebook.com/)
by **Andy Gonzales and Sophie Houser**
Gaming, Going Viral, and Getting it Done
[![Girl Code Book Cover](/static/courses/csintro/references/girl-code.jpg)](https://www.girlcodethebook.com/)
### [Secret Coders](http://www.secret-coders.com/)
by **Gene Luen Yang and Mike Holmes**
Get with the PROGRAM!
[![Secret Coders Book Cover](/static/courses/csintro/references/secret-coders.jpg)](http://www.secret-coders.com/)
### [How to Count](https://stevenf.com/books/)
by **Steven Frank**
Programming for Mere Mortals, Vol. 1
[![How to Count Book Cover](/static/courses/csintro/references/how-to-count.png)](https://stevenf.com/books/)
## Feedback
> Programming for Mere Mortals, Vol. 1 by Steven Frank
If you have feedback for the Microsoft MakeCode team, you can fill out their survey form here: https://aka.ms/microbitfeedback
The support site for the micro:bit is located here: [https://support.microbit.org](https://support.microbit.org/)

View File

@ -1,6 +1,7 @@
# Variables
![Variable value](/static/courses/csintro/variables/cover.JPG)
![Variable value](/static/courses/csintro/variables/cover.jpg)
This lesson introduces the use of variables to store data or the results of mathematical operations. Students will practice giving variables unique and meaningful names. We will also introduce the basic mathematical operations for adding, subtracting, multiplying, and dividing variables.
## Lesson Objectives

View File

@ -9,6 +9,7 @@ Ask the students to think of some pieces of information in their daily life that
Constants and variables can be numbers and/or text.
## Examples
In one school day...
* Constants: The day of the week, the year, students name, the schools address

Binary file not shown.

Before

Width:  |  Height:  |  Size: 211 KiB

After

Width:  |  Height:  |  Size: 160 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 202 KiB

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 106 KiB

After

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 71 KiB

After

Width:  |  Height:  |  Size: 92 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 70 KiB

After

Width:  |  Height:  |  Size: 80 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 824 KiB

After

Width:  |  Height:  |  Size: 572 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 211 KiB

After

Width:  |  Height:  |  Size: 157 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 172 KiB

After

Width:  |  Height:  |  Size: 126 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 728 KiB

After

Width:  |  Height:  |  Size: 513 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 203 KiB

After

Width:  |  Height:  |  Size: 132 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 368 KiB

After

Width:  |  Height:  |  Size: 135 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 199 KiB

After

Width:  |  Height:  |  Size: 160 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 135 KiB

After

Width:  |  Height:  |  Size: 118 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 177 KiB

After

Width:  |  Height:  |  Size: 127 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 79 KiB

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 115 KiB

After

Width:  |  Height:  |  Size: 98 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 182 KiB

After

Width:  |  Height:  |  Size: 148 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 158 KiB

After

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 156 KiB

After

Width:  |  Height:  |  Size: 134 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 91 KiB

After

Width:  |  Height:  |  Size: 82 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 182 KiB

After

Width:  |  Height:  |  Size: 124 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 220 KiB

After

Width:  |  Height:  |  Size: 96 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 190 KiB

After

Width:  |  Height:  |  Size: 129 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 181 KiB

After

Width:  |  Height:  |  Size: 129 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 192 KiB

After

Width:  |  Height:  |  Size: 135 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 112 KiB

After

Width:  |  Height:  |  Size: 96 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 181 KiB

After

Width:  |  Height:  |  Size: 148 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 125 KiB

After

Width:  |  Height:  |  Size: 105 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 181 KiB

After

Width:  |  Height:  |  Size: 138 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 83 KiB

After

Width:  |  Height:  |  Size: 77 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 505 KiB

After

Width:  |  Height:  |  Size: 173 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 549 KiB

After

Width:  |  Height:  |  Size: 408 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 234 KiB

After

Width:  |  Height:  |  Size: 169 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 614 KiB

After

Width:  |  Height:  |  Size: 457 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 192 KiB

After

Width:  |  Height:  |  Size: 142 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 73 KiB

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 63 KiB

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 530 KiB

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 MiB

After

Width:  |  Height:  |  Size: 115 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 364 KiB

After

Width:  |  Height:  |  Size: 107 KiB