Merge pull request #480 from Microsoft/coordinate-leds-updates

Coordinate leds updates

docs/courses/csintro/coordinates.md

@@ -1,11 +1,13 @@
 # Coordinate grid and LEDs
 
-This lesson introduces the use of coordinates to store data or the results of mathematical operations. It gives students practice programming for the LEDs of the micro:bit screen using coordinates. And introduces the basic game blocks of MakeCode.
+![Sample Heart Simulator](/static/courses/csintro/coordinates/cover.png)
+
+This lesson introduces the use of coordinates to store data or the results of mathematical operations. It gives students practice programming for the LEDs of the micro:bit screen using coordinates, and introduces the basic game blocks of MakeCode.
 
 ## Lesson objectives
 
 Students will...
-* Understand that the 5 x 5 grid of LEDs on the micro:bit represent a coordinate grid with the origin (0,0) in the top left corner.
+* 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.

docs/courses/csintro/coordinates/activity.md

@@ -109,7 +109,7 @@ Check the on/off state of an LED
 * If the LED is currently off, the point x y block will return false. 
 
 * For this exercise, we’ll use the two Yes/No built in icons to display the LED’s current status. From the Basic Toolbox drawer, drag 2 'show icon' blocks into each of the 'then' and 'else' clauses.  Select the check mark for Yes, and the X icon for No.
-* For now, we’ll leave the default coordinate values (0,0).  But you can challenge your students to add a loop to test for all coordinates on the micro:bit
+* For now, we’ll leave the default coordinate values (0,0).  But you can challenge your students to add a loop to test for all coordinates on the micro:bit.
 
 Here is the complete program:
 
@@ -195,4 +195,4 @@ basic.showIcon(IconNames.Heart)
 
 ### Try it out!
 
-* What happens if adding 25 or subtracting 25 from the current brightness level would result in a sum or difference outside of the 0 to 255 brightness range? 
+What happens if adding 25 or subtracting 25 from the current brightness level would result in a sum or difference outside of the 0 to 255 brightness range? 

docs/courses/csintro/coordinates/project.md

@@ -19,6 +19,7 @@ Your project might use variables to store the values of sprites, which are speci
 
 ## Project Ideas
 
+![Firework Example](/static/courses/csintro/coordinates/firework.gif)
 ### Firework screensaver
 
 This project uses a for loop with the plot/unplot blocks to create a symmetrical design on the screen. This student used a subtraction operation to get a variable that decreases as the index variable in the loop increases.
@@ -40,6 +41,7 @@ basic.forever(() => {
 })
 ```
 
+![Cascade Example](/static/courses/csintro/coordinates/cascade.gif)
 ### Cascade screensaver
 
 This example creates a diagonal cascading effect across the screen. Note the use of a variable (speed) to allow you to easily change the speed of the animation by changing just one number value.
@@ -80,7 +82,7 @@ basic.forever(() => {
 })
 speed = 10
 ```
-
+![Dodge Ball Example](/static/courses/csintro/coordinates/dodge-ball.gif)
 ### Dodge ball game 
 This is a Dodge Ball game that uses one sprite (dodger) to try to avoid another sprite (ball). You use the A and B buttons to move the dodger to avoid the balls that are falling from the top of the screen.
 
@@ -150,11 +152,7 @@ Have students write a reflection of about 150–300 words, addressing the follow
 
 ### Collaboration reflection
 
-**4 =** Reflection piece includes:<br/>
-`*` Brainstorming ideas<br/>
-`*` Construction<br/>
-`*` Programming<br/>
-`*` Beta testing<br/>
+**4 =** Reflection piece addresses all prompts.<br/>
 **3 =** Reflection piece lacks 1 of the required elements.<br/>
 **2 =** Reflection piece lacks 2 of the required elements.<br/>
 **1 =** Reflection piece lacks 3 of the required elements. 

docs/courses/csintro/coordinates/unplugged.md

@@ -7,7 +7,8 @@ To help us practice using the correct coordinates for the grid of micro:bit LEDs
 Have students make their own sets of 5x5 grids to reinforce the layout of the micro:bit grid.
 
 Each student should make two grids. One grid is for placing their own ships and keeping track of their opponent’s hits and misses and the other grid is for keeping track of their own hits and misses while trying to determine the location of their opponent’s ships.
- 
+
+![Player Grid Example](/static/courses/csintro/coordinates/player-grid.png)
 Player’s grid: Mark where your ships are and keep track of your opponent’s hits and misses.
 
 ```
@@ -18,6 +19,8 @@ Player’s grid: Mark where your ships are and keep track of your opponent’s h
 	(0,4)	(1,4)	(2,4)	(3,4)	(4,4)
 	 
 ```
+
+![Opponent Grid Example](/static/courses/csintro/coordinates/opponent-grid.png)
 Opponent’s grid: Keep track of your hits and misses while trying to locate your opponent’s ships.
 
 ```