Tag Archive | coding

Unit Rates and Scratch

I’m back to teaching pre-algebra after a long time off – and the more things change, the more they stay the same! A key staple of middle school math is learning about rates – how they work, how to calculate unit rates, how to predict with rates, and different representations of rates – including tables, graphs, equations, and story problems. I love to make the connection between the story problem and the equation by doing a coding activity. For our final project on unit rates, I assigned the students a pair programming project in Scratch. The structure of the activity is really similar to what I’ve done in my 6th grade computer science classes.

  1. The background knowledge. We have a discussion about a specific situation involving rates – I chose “toilet paper math”, because what is a more confounding consumer decision than buying toilet paper? I picked a couple of examples of toilet paper packages from the weekly grocery ad and put them into a Google Doc for the kids here. https://docs.google.com/document/d/1zM4wwf2GDSEEaB31IWDeJPTqibtPsG1zLN_XA_k35uM/edit We had a class discussion about what clues on the package might help me figure out what toilet paper to buy. One class mentioned that I could figure out the number of squares / sheets of toilet paper in each package, and another class wanted to go by the number of square feet in the package. Together, we wrote a Scratch program that would help me figure out what toilet paper to buy. For the class example, I showed them how to use the “ask” block to get input, the “set” block to set variables to values, and operators to do math. We created variables for the price of the toilet paper, the number of square feet in the package, and the number of square feet you can get for a dollar. The main character would then report out the square feet per dollar unit rate to help us figure out our purchasing decision. Our class program is here: https://scratch.mit.edu/projects/291422012/editor
  2. The norms before the worktime launch. I explained to the students that when I was an engineer, we often used a protocol called “Pair Programming” to solve problems. As an adult, this meant I prairie-dogged my head up above the cubicle walls and shouted to my friend Jerry: “Jerry! Can you help me solve a coding problem? I can’t figure it out.” Then I would type at the computer while Jerry stood behind me and read over my shoulder, and we talked together about what the code did – line by line. It was really helpful to have a partner talk it over with me. I explained that in middle school, we can also use Pair Programming and some of the norms are pretty much the same. Then I showed the Code.org pair programming video on YouTube.
    https://www.youtube.com/watch?v=vgkahOzFH2Q After the video, we went over the do’s and don’t’s.
  3. I gave the students a choice of word problems having to do with Unit Rates, and their task was to solve one of them with a partner using the Pair Programming protocol. The choices are in this document: https://docs.google.com/document/d/1h8r2z0o2FtOr8N4IjqGaiNrhn_DGAJLIyNREeg9iR0g/edit  I change up the celebrities in the document every so often. Students love Marshmello and also Ariana Grande this year and I got some cute programs with these characters.I swear the Pair Programming video is magic. Students for the most part peacefully navigate partner work after watching and processing the video. I only had a couple of groups that had any trouble at all. This activity took a whole class period for most classes, and a little longer for one group. All of the students were engaged and trying hard, and most groups enjoyed the creative storytelling part of the project. I wish I had introduced Scratch sooner in this year’s math cohort, but we had a lot of manual math to do and so we’re just now starting to automate things. Now that the kids are on board with it, I can’t wait for the next project.Here are a few example programs the students made for the word problems.
    Marshmello’s road trip: https://scratch.mit.edu/projects/293136380/editor/
    Hagrid’s Animals (these students modified the prompt a little bit, but I really enjoyed how theirs turned out and they had fun with the creative storytelling): https://scratch.mit.edu/projects/292456078/editor/
    Ariana’s Carpet (this group of kids decided to include their favorite K-Pop star and I’m embarrassed to say I don’t know who this guy is): https://scratch.mit.edu/projects/293139904/editor/

    I really believe in computer programming as a modeling tool for math expressions. Students love the instant feedback and the creative storytelling, and I love that they can test many inputs and it is a check on their number sense. Often I see students modify their model when they try plugging in a few numbers and then they say “Wait a minute! That gas mileage doesn’t make sense!”

    Other programming languages work just as well. I’ve had older middle schoolers do a similar task in Processing and it really stretches their brains!

A class on engineering, electronics, and the Maker Mindset

At my school, rather than pass through grade levels, students have levels of autonomy – from “Explorers” who do mostly teacher-directed projects and products, to “Pathfinders” who do almost completely student-created projects and products, and job internships. I’m teaching an “Explorer” level class, so I’m introducing new learners to things they might not have known they would like but we’re asking them to try it. Other teachers with Explorer classes are doing things like creating pollinator boxes, producing a play, and studying floodplains. My venture project is called “Whimsical Inventions” and it’s a class about learning how to be a maker and a tinkerer. I began by presenting content about coding, electronics and circuitry, 3-D design, and doing research… but also teaching about the mindset of an inventor. Inventors solve problems, true, but inventors also make things because making things is joyful. We make stuff that is a little over-engineered because it makes us and others happy. We take everyday things and make them more beautiful, musical, entertaining, weird, or funny. If you’re making a thing to be happy, you’re more likely to take risks, to try something that might not work, to iterate on your design and make it better. This is the premise behind the class. To learn about coding, electronics, design, and engineering for the smiles.

As students finish with their final projects I am just feeling so blessed with the circumstances I got to teach in. The kids have come a long way with coding and Arduino. My makerspace is buzzing with 3-D printers and the laser cutter. Kids solder skillfully and safely. And they are doing a great job cleaning up and putting things away. I was lucky to get a class in which many kids were interested in the topic but many others just got placed there to try something new. My class is evenly split between boys and girls. It’s mixed-age with kids ranging from 6th grade to 10th grade. And I have gifted kids, kids with IEP’s, second-language learners, kids from all areas of town. It is just awesome. When I have a diverse group of learners I am a very happy teacher and this has been a phenomenal group.

And look at some of the fun stuff they’re making! One child is making a 3-D printed ferris wheel with a stepper motor and some LED’s. It’s coming along well! She downloaded the Ferris wheel design from Thingiverse.

Another student is making a motion-activated Moo machine. You know those cylinders that you tip upside down and it moos? He’s going to attach it to a servo and mount it in a stand with a motion sensor on it. When you walk by it will moo at you! Here’s the base beginning to print. He designed it himself!

A pair of students is making a light-up holder for your Instax photos. They’ve learned to solder and program these RGB LED strips and they’re going to mount some clips here to show off their photos. Another girl is using the same idea to make a light-up phone case. She has printed several iterations of the perfect phone case to make sparkly with the LED strips.

I have one pair of students that decided to make their own battery-powered car. They designed the car chassis themselves and soldered together the battery packs and switch and motors, and they’re doing to attach wheels and I’m just so excited to see how it turns out.

It’s just been fun. Part of our requirement for the project is that kids have to do a research project as well, and I’ve found that they really are engaged in their research which I didn’t expect. Early on in the class we did readings and watched videos on the value of tinkering and inventing useless things – we watched videos from Simone Giertz, Adam Savage, Ayah Bdeir and others. One of my favorites is this TED Talk from Steven Johnson which tells the story of how seemingly useless inventions can change the world. I’ve taught electronics classes before, but this is the first time I’ve really focused on teaching the mindset of an inventor, and I really think it has positively shaped the culture of the class. When I reflected on the times I learned the most and grew the most as a maker, those times tended to happen when I was making something I personally cared about but was just a fun side job, a useless invention. I hoped to give my students that same experience. I really believe most of them are, and it’s a very happy class to teach.

Sometimes when I’ve taught engineering classes before, the classes would end up being not very diverse (kids tend to sign up who already know they will like it, and I tended to have mostly boys in those classes), and I never felt like I had time to teach about maker culture. With a diverse class and making the culture/mindset front and center in the learning, it’s been a very fun experience and I can’t wait to show you how the exhibition products turn out.

Pre-calc, Trig, Physics, and Planetary Motion – a coding project

I mentioned earlier that I get the privilege of teaching pre-calc for the first time this year. As a capstone project for our unit on trig, I created a project on planetary motion. It had been on my radar since we studied conic sections and learned about how planetary motion is a real-world example of an ellipse. I browsed around for some examples of planetary motion simulators, and found this one written in Python.

https://fiftyexamples.readthedocs.io/en/latest/gravity.html

The link above uses real-world values for masses of planets and the value of big G, but I thought the students would enjoy “playing God” and creating their own planets and velocities and creating the big G constant for their little universe. In the process we would learn about the physics of planetary motion and about how trigonometric functions can be used to model periodic motion in a coordinate plane. Yay math!

My pre-calc students have not yet had high school physics, so I had the opportunity to set the groundwork for some basic mechanics. I know I gained a lot by watching these little videos from Crash Course and PBS. I had the students watch them both, and we processed them afterward.

 

After this first video, the main mind-blowing concepts were: a) centrifugal force is kind of a “fake force”, it’s just the balancing force to centripetal force that pulls you inward, b) in a circular path, your velocity is tangent to the circle, and c) students knew that force could be described by the equation: F=ma, but after the video we talked about a special version of the formula that describes circular motion, F=mv²/r.

Together we wrote, earlier in the unit, a basic computer program on Khan Academy that made a little planet orbit around a bigger sun using trig functions to find the x and y coordinates. Fun but not an accurate planetary model. I’m not sure if the computer program playback will work here, but here’s the basic model.

animate

https://www.khanacademy.org/computer-programming/animate/5088658953502720/embed.js?editor=yes&buttons=yes&author=yes&embed=yes

Made using: Khan Academy Computer Science

Since we had briefly learned about Kepler’s laws during our unit on ellipses, I told the kids I wanted the model to change so it actually modeled planetary motion – faster when close to the planet, slower when farther away, making an ellipse with the “sun” at one focus. And to do that, we’d have to learn a little about how planets exert force on each other and how that impacts their motion. So we watched the next video.

 

So from this video, we learned many more mind-blowing things. Among them, there is ANOTHER formula for force: F=GMm/r². These formulas are all related to each other. We would now modify our computer simulation to show how they all work.

Ok so here are the basics of programming an animation. This structure is common to pretty much all game programming as well. You have setup code and then an animation loop, that runs over and over again. Most of the time, the animation loop runs around 60x per second.

In the setup code, we initialize all of our variables. In the animation loop, we’ll calculate all of the forces and accelerations and velocities and positions, and once everything is updated, we’ll re-draw the scene. You always re-draw the whole scene from the objects in the “back” (such as the background) to the objects in the “front” (such as the moving planets). For simplicity, my model doesn’t take into account the planet’s effect on the sun… just the sun’s effect on the planet.

Step 1: In the animation loop, draw the background and the sun. In the Khan Academy programming environment, (200,200) is the center of the canvas since the canvas is a 400×400 grid. This code places a circle, 40 pixels in diameter, right at the center. The fill() and background() commands are used for colors.

var draw = function() {
background(0,0,0);
fill(164, 244, 245);
ellipse(200,200,40,40);

};

Step 2: In the setup code, create variables for the sun’s mass and the planet’s mass. I just told the kids to make up numbers, one a LOT bigger than the other, like 100 times bigger or more. I just made these up on the fly. The units are totally fake. Just have fun making up weird numbers.

var smass = 34782;
var pmass = 7.2;

Step 3: We need to place a planet. We’ll create variables for the planet’s x and y positions and draw a smaller circle at that position. I recommended to the students that they place the planet so that it is directly above, below, or to the left or right of the sun. In other words, the x or y coordinate is the same as the sun’s, but the other coordinate is different. My planet starts out 170 pixels ABOVE the sun (because the y axis is upside down).

Setup code:

var px = 200;
var py = 30;

Animation loop (at the end of the var draw function, before the last curly brace)

fill(153, 242, 126);
ellipse(px, py, 10, 10);

Step 4: You’ll need to calculate how far away you are from the sun at any time in order to correctly calculate the force. So make a variable to store this distance, and then re-calculate the distance every frame. Normally you would use the distance formula, sqrt((x2 – x1)² + (y2 – y1)²)  however Khan’s math library has a function called “dist” that simply takes the parameters x1, y1, x2, y2 and returns the distance between them.

Setup code:

var pdist;

Animation loop (before you draw the planet. I added a comment above this to show where we are doing all of the math)

//MATH
pdist = dist(px, py, 200, 200);

 

Step 5: Now we have *almost* all of the information needed to calculate the force on our planet. We know the masses of the two planets and we know how far away they are at any time. We do NOT know big G, our gravitational constant. For now we’re going to make up a number. It’ll be wildly wrong. We will fix it in a bit. We’ll calculate force using our wrong constant for now. The students enjoyed thinking about how when you create your own universe you get to decide things like how big the universal gravitational constant is.

Setup code:

var G = 10;  // just make something up
var pforce;

Animation loop (after you calculate distance but before you draw the planet)

pforce = G * smass * pmass / (pdist * pdist);

Step 6: Now we need to explore the relationship between position, velocity, acceleration, and time. We already have variables for the planet’s x and y position. We will need to break velocity and acceleration down the same way. Velocity is how much the planet’s position changes with each time interval. Acceleration is how much the *velocity* changes with each time interval. If our object starts at the top of the circular path, it begins with a fairly large x-velocity and a zero y-velocity. As it moves around the circle clockwise, the x-velocity and y-velocity change so that by the time it gets around 90 degrees, the x-velocity has slowed to zero and the y-velocity is at a maximum. And the cycle repeats around the circle. A periodic function!

So after position is established we will give our planet a starting velocity. Since my planet started at the “top” of its circular path, I will give it an x-velocity but no y-velocity. A student that put their planet to the side would give their planet a y-velocity but no x-velocity.  When you run this code now, you will see the planet move in a straight line tangent to its circular path. It follows Newton’s first law – no force, no change in velocity. Bye!

Setup code:

var vx = 4;
var vy = 0;

Animation loop (put this code right before you draw the planet):

px = px + vx;
py = py + vy;

 

Step 7: We need to calculate the acceleration in the x- and y- direction every frame. This is where the trig comes in. This step really consists of three substeps. First, we need to find the angle of rotation between the planet and sun. Second, we find the x- and y- components of the acceleration. Third, we add the acceleration to the velocity (remember acceleration is the change in velocity every frame). For the first substep, we can calculate the angle of rotation easily – the planet’s position is a certain y-distance and a certain x-distance away from the planet, so if we use inverse-tangent, we can find the angle. Khan’s math library has a function “atan2” that calculates an angle given the y-distance and x-distance. Note the sun is at (200,200) so that’s why those numbers are hard-coded. Substep 1:

Startup code:

var ptheta;


In animation loop:

ptheta = atan2(200-py, 200-px);

 

Substep 2. Calculate acceleration components. Here we use our original force formula: F = ma. We calculated force, we know mass, so acceleration is easy – just Force / mass. Then we have to multiply that acceleration times sin(theta) for the y-component and times cos(theta) for the x-component. These use the definitions of sin and cos as you relate them to a unit circle. The code!

Setup code:

var ax;
var ay;

 

Animation Loop (after you calculate ptheta):

ax = (pforce / pmass) * cos(ptheta);
ay = (pforce / pmass) * sin(ptheta);

 

Substep 3. This part is easy. Add the acceleration to the velocity every frame. Do this before you re-calculate position in the animation loop.

vx = vx + ax;
vy = vy + ay;

 

You’ll run your code. The planet will either fly off into the unknown or crash into the sun. I encouraged the kids to play with the value of G, but sometimes the animation runs so quickly that it’s hard to even tell if you should dial up G or dial it down. So we had to come up with a better way to find a universal gravitational constant that would make our little solar system dance instead of fall apart.

Here’s where our other formulas for Force come in. For uniform circular motion, the centripetal force that keeps a body in a stable circular path is: F=mv²/r.  For planetary motion, the force affecting the planet and sun can be modeled as: F=GMm/r².   We know all of the variables in both equations EXCEPT a value for G that makes the orbit stable. So set one equal to the other and solve for G. I used some contrived numbers in my model and all of my students had different contrived numbers. Mine were:

M = 34782

m = 7.2

r = 170 (since my planet started at y = 30 and my sun was at y=200 and the x-coordinates were the same)

v = 4 (I just made up a velocity of 4 pixels per frame)

When I solved for G, I got a value of 0.078. So I modified my program and plugged in this value for G and guess what happened? Uniform circular motion and the feeling that I AM GOD of my own little universe.

You can make tiny changes to the planet’s initial velocity, for example change it to 2 instead of 4, and see the planet travel in an elliptical comet-like path instead of a circular path.

Here is the entire working program.

PLANETS

https://www.khanacademy.org/computer-programming/planets/5392591280308224/embed.js?editor=yes&buttons=yes&author=yes&embed=yes

Made using: Khan Academy Computer Science

 

When I taught this lesson, we went through the steps as a class just as I went through them in this blog, discussing them along the way. For a final product, the students will write an essay (!) describing their understanding of the physics of planetary motion. I will also give them a brief quiz. I have not yet written a rubric but will share it when I do.

I really enjoyed working on this little coding project and was so pleased that I could connect periodic functions and the physics of motion. If you make any modifications or try this with your students, please let me know.

Learning Python with the micro:bit

This is such a big year for middle school computer science. I think that finally, for grades 6-8, there is a whole menu of really high quality teaching resources – from hardware tools to lessons and tutorials to standards to whole curricula. I’m pretty much changing how I do EVERYTHING, which is exhausting but exhilarating at the same time.

In the standards area, there is a new set of standards released by the Computer Science Teachers’ Association, or CSTA, located here. They are very good overall, building from grade level to grade level, organized by concept and very clear. I think it gives a nice progression for students. Many states, my own included, are involved in efforts to develop statewide standards, curricula and resources. It’s been great to see CS education move forward and the middle-years progression is really coming together.

As far as curricular resources, there are a few great new options. Code.org has a middle school course called CS Discoveries. I didn’t get to attend the training this summer, but one of my co-workers went and although she’s not a programmer by background, she came out feeling excited and confident that she could teach the curriculum and do a good job. It’s very well done so that pretty much anyone can take it and run with it.

The middle years are a great time to introduce kids to physical computing, the idea that you use algorithms and code to program devices in the world around us. It’s such an important tech literacy concept! The CS Discoveries course uses a platform called the Circuit Playground from Adafruit. For a long time, I’ve enjoyed the Sparkfun Inventor’s Kit and its little curriculum. I’ve also noticed a lot of buzz around the UK’s platform for introducing kids to physical computing – the BBC micro:bit. They are cheap and very engaging. I ordered a class pack of them, and from Sparkfun the price is really reasonable.

The BBC micro:bit Go bundle I purchased from Sparkfun.

I teach block-based programming to the sixth-graders and then work with the older middle schoolers on transitioning to text-based programming. For the younger kids, I was thrilled to find an entire CS curriculum for the micro:bit published by Microsoft. It is so good! I love its emphasis on “making” and creativity, and I enjoy the little unplugged activities. I was skeptical of them at first, but every time I try one of the unplugged activities I find the kids really enjoy it and it does help the concepts stick better. The curriculum is easy to follow, and I find the kids love finishing the lesson and then just playing with what they can do on the micro:bit.

I’m finding I can’t do some of the “invention” activities, because I only have one class set of micro:bits and they’re shared throughout the day. I can’t have kids mount the micro:bit in a pet or wearable, for example, because the next class needs them. That’s really a bummer – being a maker involves more than just code. I might try to do an invention project with the kids with the caveat that the enclosure has to let you insert and remove the micro:bit easily. We will see how things go this semester.

As you can see from the title of this post, one of the things I’m playing with is teaching text-based programming via Python to the seventh- and eighth- graders. I was not lucky enough to locate an entire curriculum for this, but there are some good resources out there. I am using the micro:bit python editor. You have to save your files locally instead of in the cloud, and actually this really beneficial. The students I have this year have had laptops in their classrooms since 2012, so they’re “digital natives”. But they’re so used to Google Docs and such that they sometimes don’t have a concept of what a file is or where it is actually stored. So we’re learning about local storage, networked storage, removable storage and cloud storage and figuring out how to access a file from different locations.

There are a lot of tutorials and a good reference at this site: micro:bit Python documentation. It gives a nice introduction to the different features of the micro:bit, but it doesn’t really teach Python. So I’m stitching together my own curriculum and put together these exercises.

In Lesson 1, we just wrote the normal Hello World program and the students were tasked with writing a program that displayed text and images, using some of what they found in the documentation. This task also involved uploading a program to the micro:bit and saving the file in local and networked storage.

# Add your Python code here. E.g.
from microbit import *

display.scroll('Hi!')

while True:
 display.show(Image.HAPPY)
 sleep(1000)
 display.show(Image.HEART)
 sleep(1000)

 

In Lesson 2, we reviewed Python syntax and common mistakes and troubleshooting. We introduced the terms “function” and “parameter” and saved some notes on these. We talked about the “while True:” loop and why the indentation is important. It’s not just picky – the indentation communicates important things to the computer! How will it know which steps to repeat without some way of blocking them off? Then we introduced variables by making a little program that displays text that changes. Students guessed at what it might do, and then we ran it and tested the hypotheses.

from microbit import *

name = 'Dawn'

while True:
 display.scroll(name)
 name = 'Tyrone'

 

Next in Lesson 3 we made a little counter program and demonstrated the difference between the string and text data types. Students could modify it by adjusting the starting value, displaying only evens, only odds, etc.

from microbit import *

# declare a variable and assign it to a value. 
counter = 0

while True:
 display.scroll(str(counter), 50)
 counter = counter + 1

By the end of this lesson, some students were feeling frustrated at how hard it was to load files, save files, upload to the micro:bit, figure out where the errors were and so on. But these are short programs and the debugging isn’t hard once you’re used to it. Students have to read the error on the micro:bit and it tells them which line the problem is on. They need to pay attention to little details and that can be exhausting, but it’s so important to give clear instructions to a machine. The machine can’t guess what you mean! We talked about how hard it was for them to write their names when they were children. If you think about it, it’s a long process! There can be dozens of little steps involved in writing your name and they were pretty bad at it when they first learned. But over time the steps became automatic and they got better, and now writing their name is a very simple task. Same with coding and debugging.

I could tell students were jonesing to make something that looked like a game. I decided to introduce random numbers as our next concept. So in Lesson 4 I had student volunteers pretend to be human variables, and we modeled what it would look like to write a program that multiplied random numbers together. First a random number is assigned to variable a. Then a random number is assigned to variable b. Then a and b report out what they are, and they are multiplied together and the result is stored in variable c. We report the result from variable c. Kids acted this part out.

Then we wrote the program together.

from microbit import *
import random

bob = random.randint(1,10)
jeffrey = random.randint(1,10)
display.scroll(str(bob))
display.scroll("*")
display.scroll(str(jeffrey))
display.scroll("=")
wilma = bob * jeffrey
display.scroll(str(wilma))

 

Many kids wanted to adapt their program to include a “forever” loop and keep producing random math problems as long as the power was switched on. By now they understood why the indentation worked, so when I suggested a “while True:” loop with everything indented after it, they were able to add it on their own.

 

Lastly, I wanted to introduce them to the coordinate plane on the pixel grid. For Lesson 5 I set out 25 pieces of paper in a 5×5 grid shape. I asked for one student to be a “pixel” and another to give directions. The student giving directions had to pick a random piece of paper, and in as few instructions as possible, tell the pixel where to go. We did this a few times and then I suggested that we make the paper in the top-left corner be (0,0). Then we realized we needed a sensible order for the row/column coordinates, so we defined “x” and “y”. We found out quickly that the pixels could only go from 0 to 4 and that 5 was off the grid. Lastly we introduced a “brightness” parameter, so when the instructor student commanded a pixel, they could tell the pixel student to go to an x coordinate, y coordinate, and to squat or stand according to a brightness level. So then we wrote this simple program and I reinforced the terms “function” and “parameter”.

from microbit import *
import random

while True:
 display.set_pixel(2, 3, 9)
 sleep(200)
 display.set_pixel(2, 3, 0)
 sleep(200)

 

And then we modified it to use variables instead of fixed numbers and the kids really liked the pixel dancing around on the grid.

from microbit import *
import random

while True:
 x = random.randint(0,4)
 y = random.randint(0,4)
 display.set_pixel(x,y,9)
 sleep(100)
 display.set_pixel(x,y,0)

Note I haven’t done much in the way of assessment other than conversations and verbal questions.. so we’ll have our first quiz task sometime next week to see how this is coming along. I don’t regret the direct instruction, though. The kids are finding it valuable, and they’re enjoying the micro:bits and learning what they can do with them.  They want to make games such as pong and snake, and I think once we understand how to use the buttons, radio and accelerometer, they’re going to have a really good time making things they haven’t yet envisioned. I’m learning right along with them. They ask me a ton of questions and my stock response is “I just haven’t learned that yet. I guess we will learn it together.”

It’s fun though. It keeps you young.

Some of the younger students enjoying coding.

 

 

 

 

Achievement Mapping in OneNote

So I’ve been thinking a lot about competency-based education – the idea that learners should be able to progress through a flexible map of skills or concepts or dispositions, tracking progress and reflecting as they go, with as much choice as is reasonable on the timing and nature of the learning, on a time scale that’s right for them. Simple… right? I’m playing with some ways of piloting the idea in my classroom and I keep thinking about gaming in this process. Most video games have levels or achievements, and gamifying education is based on the inherent motivation built into video games. Every time you fail a level, you get to try again. You try until you succeed. Success metrics are clear, and when you succeed you go on to the next level. I like playing Minecraft with my kids, and we have fun finding our way through the Minecraft achievement map. The skills are really clear-cut and the achievements have to be done in order.

Anyone who plays Minecraft recognizes this map.

Anyone who plays Minecraft recognizes this map.

I wonder if I can apply the gamification principles to a class I teach. I’m experimenting with OneNote Class Notebook to push an achievement map out to my students. I need the map to be flexible – I don’t have it all written right now, and I’m not sure a competency map should be articulated completely from beginning to end. Do you want your child’s educational path pre-mapped from K through 12 or do you want them to be able to take unexpected turns as needed? I’d like to be able to push achievement challenges to the students as they come up, and maybe assign achievements flexibly depending on student choice and need.

I can push the achievements out as documents that contain a checklist, maybe a place to paste some code, and a reflection from the student. I can respond to their achievements and use this as the basis for conferencing with them about their learning.

For example, as my first two achievements for kids:

achievement1

achievement2

This semester, I wouldn’t use the achievement map as a grade, but I could leave the door open for it as an assessment tool in the future. How far would a student need to progress through the map to “pass” the class and move on to the next one? This is something I hope to answer after this semester.

I really wish I could create a clickable map like the Minecraft one, where you could hover over a box and it would tell you about the achievement, or click on the box to submit an entry to pass the achievement. When you passed one, the following achievements would be enabled. I know this is doable, but time and 217 students and so many preps and…. it’ll have to wait for a break, unless someone has created a tool like this and I just don’t know about it. Any badging or achievement-mapping tools out there that I should learn about?

What do you think? Have you ever gamified a graded class? What structures did you use and what should I fix before diving into this?

Review/Extension Activities for Looping and Conditionals

More than once I’ve finished or half-finished a lesson knowing that some kids understood most of it, some really didn’t get it at all and I didn’t get enough information during class to really understand where I should go with things the next day. If you back up and review, you bore the kids who understood already and run the risk of teaching the same ineffective way you did the previous day. If you plow ahead, you will really lose the students who were barely understanding the day before.

In this situation, I sometimes do a code-analysis card sort.  I write a handful of code snippets and produce output from them. Mix up the code and outputs, partner up the students and ask them to match code to output. It takes less than 10 minutes, and then you have a whole-class discussion where you ask groups to report out. What’s a match you feel confident about and why?  What is a match that gave you trouble and why?

Here are a couple of my card-sorts from this year’s CS Exploration course, in which I have been teaching Processing.

Function Match:

example card from the function card sort.

example card from the function card sort.

In this card sort, there are four function definitions, four function calls, and four descriptions.  The students’ job is to match a definition to a call to a description. Before making copies, I put a letter (A,B,C,or D) on each function defintion, a number (1234) on each call, and a symbol on each description.

https://docs.google.com/document/d/1sEnnMD7T4i_AxqfIyosZ2VCBZOkbtU7yx79fNbBqGNI/edit

The card sort is really simple because each function has a different number of parameters. If a student can recognize that the definition with three parameters matches the call with three parameters, they can do the sort. But it creates good discussion when you talk about why the matches work, what the parameters mean, and how we know the descriptions match the definition and call.

I also created a Function Kahoot! quiz to do before or after.

https://play.kahoot.it/#/k/0aa8f906-3de9-41be-8b9f-ce5b9ced5e97

 

Next I have a card sort on looping. It only focuses on While loops. The task is to match the code with the output.

loop1\

The cards are here:

https://docs.google.com/document/d/1f-OGnz_jCIv_Zh2iNDY0XpTQbK1VjUYTLr9gzh7PHn0/edit

Again before I make copies, I label the code with letters and the outputs with numbers to make it easy to report out what matches the students made.

The discussion on this sort usually hits on two ideas. Is the x-coordinate or y-coordinate changing, and how do you know? How do you know how many times the loop will run? Good tie in with some linear algebra here – the starting value has some connection to y-intercept and the increment each time has a connection to slope or rate if you choose to go there. There is one card that will freeze the program because it gets stuck in an infinite loop, and it’s an important one to discuss as I always have students that take some time to understand the idea of the infinite loop.

 

I also have a Kahoot! quiz on variables and expressions, without loops/conditionals or anything like that. Might be a good review activity.

https://play.kahoot.it/#/k/3ef963cc-0ceb-4c83-9616-fa7c714698f1

I’m working on adapting some of my older Kahoot! quizzes from the Khan Academy Processing JS to the stand-alone Processing, but here they are if you are interested in the Khan version.

Khan Kahoot! on conditionals and booleans:

https://play.kahoot.it/#/k/62584d63-7484-4490-bb23-019c8ee1a7e0

 

I had this one to quiz students on the draw() loop and how it affects variables. I don’t think I’ll adapt it for Processing but it might be useful to someone.

https://play.kahoot.it/#/k/10a75250-560d-4550-a202-b936149173dd

 

 

What are some of your ideas for differentiation, discussion, extension and review?

 

Teaching event-based programming – a traffic light

Recently as I was looking through my blogroll, I read Mark Guzdial’s review of the K12CS.org Framework. I wished I had been able to review the framework with a group – I didn’t feel that I generated great ideas about it on my own, but I did like reading Mark’s. Reading my social media feed sometimes impacts what I’m going to teach. In this case, Mark made a point about models of computing:

Great research by people like John Pane at CMU has shown that novices think of programs as responding to events, being reactive (e.g., think apps, games, GUI interfaces). Thinking of computing as input-processing-output is an older model, difficult to understand, and less common today.

 

Huh. I had been teaching programming as input –> do stuff –> output and wondering to myself what to do when this model broke down. I never really thought about how I teach event-based programming differently. I decided I would give it a try, though. In my 7th-8th grade CS class, my kids had learned about variables, conditionals, and functions. Normally I would plow right into iteration but I decided to take a detour and do some activities with the kids on event-based programming. We did a couple of examples working in Processing with draw() and mouseClicked() and keyPressed(). I decided to introduce an activity involving a state machine to teach the difference between linear programming and event-based programming.

I talked with the kids about how many of us think a traffic light works. We see it as a linear set of steps.

trafficlight_maya

trafficlight1

But in reality, we know the traffic light has a set of sensors. And when a sensor is tripped and other conditions are met, then the traffic light advances to the next state. You can model the state with a variable. In this case, I used “lc” for light color. We can model the sensors with button clicks and key presses.

trafficlight2

We wrote this program together, imagining that the mouse click simulates a timer expiring, and the space bar simulates the sensor that detects your car. I did this as a teacher-led launch. Kids followed along and ran their programs. Easy.

http://www.openprocessing.org/sketch/311664

 

The kids asked about how you simulate a real timer. In Processing, there isn’t an easy implementation of a “delay” function, so you have to poll for a timer. There is a built-in function millis() that returns the number of milliseconds since the program had started. The kids played with the millis() function and had fun writing the time to the screen. So for the next class, I decided a program that used timers would be a good extension and problem-solving activity.

In the second class, we looked at this state machine model.

trafficlight3

My amateurish drawing shows looping arrows where you are polling the timer. As long as the “ready” variable, for example, is 0, then the light stays the same. As soon as the “ready” variable changes to 1, then you can advance to the next state. You can check for “ready” by doing some math on variables that store the value of millis(). One variable stores millis() over and over again. Another variable only stores millis() when the state has just changed.

I put the kids with a partner and made this a pair programming assignment.  We reviewed the norms of pair programming. I gave them a starter program that just showed a red screen and used the millis() function to display the elapsed time. I had some variables in the program but did not tell the kids how to use them. Their task was: turn the program into a timed traffic light. It should turn the red light on for a certain time, then the green light for a longer time, then the yellow light for a very short time, and then go back to red.

This is the starter program.

// 0 is red, 1 is yellow, 2 is green 
int lc = 0; 
int ready = 0; 
int oldms; 
int newms; 
int elapsedms; 
int interval; 

void setup() 
{   
  size(400,400); 
  ready = 0; 
  oldms = millis();
  newms = millis(); 
  elapsedms = newms - oldms; 
  interval = 5000; 
}
void draw() 
{
  if(lc == 0) 
  { 
    background(255,0,0); 
  } 
  else if(lc == 1) 
  { 
    background(255,255,0); 
  } 
  else if(lc == 2) 
  { 
    background(0,255,0); 
  } 
  newms = millis(); 
  elapsedms = newms - oldms; 
  textSize(30); 
  fill(0,0,0); 
  text(elapsedms, 150,150); 
} 



The kids split into pairs and started working. After a while, a few groups were close – they could check for a certain elapsed time and then change the light’s state variable so it switched colors. They didn’t know how to reset the timer, so after about 20-30 minutes, most of the kids could change red-green-yellow and then didn’t know how to get back to red.

So I did a catch-and-release where we talked about the polling loop.  I showed boxes that represented the values of “oldms”, “newms”, and “elapsedms” each time through the draw() function. Some kids figured out on their own that the way to reset the timer is by assigning “oldms” to millis() when you change the light’s color. Others figured out different solutions  and it was interesting to see what they came up with.

The activity took most kids until the end of the class. On the third class, I asked all of the pairs to copy and paste their programs into OneNote. I then called up several groups to do a walkthrough of their solution. They did a really good job presenting. I like OneNote for this kind of sharing because the rest of the class could copy the code and run it to understand what the presenting group did.

Here are some of the solutions! I liked how each group approached it a little differently. Some used my variables and some made up their own. Some used nested “if” statements and some used complicated boolean expressions. Some reset the timer after each state change and some waited until after a complete cycle of the traffic light.

Luke and Andrew’s Method

Anna and Kay’s method

Ryan and Parker’s method

I enjoy seeing the students have their lightbulb moments, and it’s also fun to have the overachieving students that can’t resist being a little creative with their programs.

Maya’s Traffic Light

Ben and Anthony’s Traffic Light with car (it stops on red, goes on green, and speeds up on yellow)

I liked this workshop model with the teacher-led launch, the worktime in pairs, and then the student-presented summary. I think it was a good problem-solving activity for the kids, and for me it was a nice departure from the input-stuff-output model of programming.

 

 

 

Computer Science Education Week at Preston

I’m late blogging about this because our days were so busy with CS Ed Week! I owe a huge debt of gratitude to my partner in crime, Tracey Winey (Twitter: @premediawine) , who listened very nicely when I said “I have some ideas about Computer Science Education Week I’d like to brainstorm with someone”, and she agreed to dive right in and plan a bunch of activities with me. She’s an outstanding organizer and is becoming a darn strong engineer as well, so the world better watch out.

We arranged for teachers to do an Hour of Code with their students over the course of the week, in their regular classes. Many students are doing multiple Hours of Code and they love it. The three activities garnering the most positive feedback from students are the Minecraft Hour of Code on code.org, the Anna and Elsa Hour of Code on code.org, and the BitsBox Hour of Code (which actually lets you download your apps to your mobile device!). I love how the Hour of Code makes coding accessible and fun for every student. Tracey and I wanted to infuse coding into a little bit of a cultural celebration at school. We envision that students should not see coding as a niche activity for a geeky few, but as a normal problem-solving tool that everyone uses.

We set up some open houses in the media center and scheduled students to come to them and take tours. We arranged for current CS and Electronics students to be tour guides and take their friends around different “exhibits” having to do with computer science. Tracey managed the open houses as I had classes to teach during most of them. We had:

Interactive Code, Art, and old Video Games on Monday:

That is PONG, people.

That is PONG, people.

Arduino Day on Tuesday:

Experimenting with a reaction-time game and a pac-man simulator on Arduino.

Experimenting with a reaction-time game and a pac-man simulator on Arduino.

Robot day on Wednesday:

Students love NAO robots and Lego EV3 Robots.

Students love NAO robots and Lego EV3 Robots.

Minecraft day on Thursday:

An Hour of Code with Minecraft Turtles in the lab. Very popular workshop.

An Hour of Code with Minecraft Turtles in the lab. Very popular workshop.

On Friday, we had our first annual Preston Middle School Code-a-Thon. I blogged about how we envisioned it working previously.  We were able to accept almost 80 kids, and it came down to 11 beginner teams and 8 advanced teams. The beginner participants were mostly girls, and the advanced groups were half girls. It was busy but a lot of fun.

We recruited some adult volunteers from the community… some Preston parents who are engineers, along with some engineer friends and retired teachers, and a staff member from the Larimer Humane Society. We had four judges and eight technical mentors, and we divided them up to work with beginners or the advanced teams.

Tracey and I gave a presentation about the code-a-thon. We talked about how code-a-thons are also called hackathons, and they are engines of innovation. Google is famous for its hackathons, and hackathons usually have a theme – Virtual Reality, Rural Life, and Social Services are a few. Sometimes, employees even stay overnight and bring their sleeping bags, and code through the weekend to come up with their solution. Everyone presents at the end. We presented the theme:
Animal Welfare!  The kids were very excited. We showed this quick YouTube clip to get the students thinking about different problems they could solve related to animal welfare.

The kids started by brainstorming, and Tracey set them up all over the media center with SMART boards, regular whiteboards, a SMART table, a Kapp, butcher paper, desktop computers and laptops. The kids had to choose a problem or a need to address, and what language they would code in. I had set up some group accounts on Khan Academy, Open Processing, and Scratch. One group of students chose to use MIT App Inventor, one chose BitsBox, and three groups decided to create coding solutions using the NAO humanoid robot.  We offered snacks every hour, and had the kids turn their programs in using Google Classroom. They worked from 8:15 until 11:15, and then they gave presentations to the judges. We saw programs on animal abuse, factory farming, saving penguins, catching poachers, endangered animals, quite a few perfect-pet quizzes, a vet program, and a robot dog trainer. While the judges were deliberating, our Humane Society volunteer gave a presentation about what they do and how they help animals in the community. Finally, the judges returned and we gave out top-four prizes in each category.

It was awesome. The kids who gave us feedback said they loved coding something that had a purpose to it. That they really enjoyed having a reason for coding, learning and being social and of course having snacks. I heard from a couple of parents of beginners that their kids were so proud of their coding and had so much fun. Many kids asked if we could do it again. We are pretty exhausted – but we probably will!

Here is a link to many of the programs created by students during the code-a-thon.

STUDENT PROGRAMS

I hope you like this slideshow of the code-a-thon. We had a great time!

This slideshow requires JavaScript.

First Annual Code-a-Thon for CSEdWeek

Computer Science Education Week is quickly approaching, and this year we want to go a little beyond the classroom hour-of-code events (which we are still doing). My school has decided to host its first mini-hackathon, which we’re calling a code-a-thon! I have seen announcements for hackathons in my area before and the idea is always intriguing, but I’ve never actually attended one – so this is a big leap, hosting one without ever actually seeing what a hackathon is like. Our awesome media specialist and I are pulling it together and hoping to learn from the experience.

Here is what we have decided so far.

  • We will have two categories: Beginner and Advanced. Beginners can be complete newcomers who have never coded before. Advanced coders have a semester of computer science or the equivalent.
  • Teams will be 3-5 students.
  • First thing in the morning, we’ll make introductions, set up norms, and reveal the theme. The theme will be very broad (the examples I use with students are “sports” or “space exploration”).
  • Students will have 20 minutes or so to brainstorm what they would like to make.
  • They can make anything they want as long as it has to do with the theme, and it is created with code. Any coding language is fine. We will provide access to robots and Arduinos if they wish to use them. Students can use Scratch or Code Studio, or Python or JavaScript or any other language. Web design tools such as Weebly do not count as “code” but can be used to enhance their project. Some ideas include games, interactive flash cards, simulations, trivia, animations, educational programs, etc.
  • We will provide some technical mentors that can help students. Students will get a token or a flag they can turn in to receive a certain amount of time with a technical mentor. They should use it when they really need it!
  • We’ll have breaks for snacks and drinks and movement.
  • Students will get to present their projects to the judges for a short amount of time (3-5 minutes depending on number of teams).
  • Judges will score projects in these categories: Problem Identification / Requirements, Usefulness of Solution, Creativity, Teamwork, and Technical Quality.
  • Winners will receive prizes. Everyone will get food and publicity.

I teach a required sixth-grade tech class so I’m able to pump it up and give the code-a-thon some good publicity in class. I have also appeared on the morning announcements to advertise and give computer science trivia questions. I set up a table at lunch with some signs and sign-up forms.

The turnout was amazing! 116 kids signed up!  63 of them were girls! We are going to need to actually cut some kids from the code-a-thon… what a bummer, but what a great problem to have!

Signing up for the code-a-thon. Groups of friends registered together.

Signing up for the code-a-thon. Groups of friends registered together.

We’re excited to see how the event goes and what kinds of programs the students create. My vision is to create a culture at the school where computer programming is seen as a normal problem-solving tool used by everyone, and not a fringe activity for supersmart kids. I’m so, so encouraged by what I have seen with the code-a-thon signups. Really fun to see kids round up friends at the lunch tables and bring everyone over to register to spend a morning coding. I hope the event goes well, and I will definitely post updates as we get closer!

 

Learning to Code in MinecraftEDU with Turtles

I haven’t posted about my Minecraft class / experiment in a while, but this has been a really interesting class to work with. My Minecraft class is a 40-minute period every other day, for a semester. Our enrichment period is not graded and is intended to be a time when teachers and students learn something interesting together. For example, teachers have classes on knitting, beading, Lego robots, ultimate frisbee, fly fishing, creative writing, and film. I have Minecraft. I wanted to use the class to explore the question “what can you learn from Minecraft?”

Since I’m a CS teacher, one interesting teaching tool that jumped out at me was the ComputerCraft mod (See a Video here) and the Turtles. I could see them as a unique introduction to programming and computational thinking. I had my class do the Turtle Island mission (which took four classes) and Turtle Canyon (which took two).  We enjoyed these pre-created missions. As a busy teacher, I was happy someone else took the time to create them and that they were so engaging and interesting for the kids. Many of the kids “died” multiple times and just kept trying to use their turtles to solve the puzzles.

The spawn point for Turtle Island. We had to install the CustomNPC mod on everyone's machine before we could use it, but the payoff was worth it because the characters help you with the missions and give you rewards.

The spawn point for Turtle Island. We had to install the CustomNPC mod on everyone’s machine before we could use it, but the payoff was worth it because the characters help you with the missions and give you rewards.

Next, I downloaded a world from the server that had ten building areas (Actually, it was this Volume Challenge with the extra buildings and things removed). I assigned the students to a numbered area with a small group. The world was set up so the students could not build or dig – but turtles could. I filled their inventories with supplies and gave them a short program to copy, and for three or four classes they could build whatever they wanted with the turtles. When you give middle-schoolers a prompt to “build whatever you want”, you get some fascinating things.

Many students used turtle remote mode almost exclusively. Some wrote very simple programs. But then some got a little more courageous with programming and made some interesting things with the turtles.

Houses, farms, pyramids, a strange creation of black wool, all made by turtles.

Houses, farms, pyramids, a strange creation of black wool, all made by turtles.

One group seemed to have a program to build a level of a house, and they ran it twice to get this weird structure with floating walls. Another group had a program to create walls and another program to create stairs. They ran this program anywhere they could.

One group seemed to have a program to build a level of a house, and they ran it twice to get this weird structure with floating walls. They also leveled their ground with the turtles. Another group had a program to create walls and another program to create stairs. They ran this program anywhere they could.

Most of the programs were very simple, but I did see some experimentation with nested loops, and with programs calling other programs. I wonder what kind of reasoning skills we’re building here. Why 19? Why 40? So many questions.

2015-10-28_18.03.10

Nested “Repeat” blocks in the graphical turtle language in Minecraft. This program uses move and place blocks to build… four walls?

I am currently teaching some turtle lessons to my Robotics class, justifying it by telling myself “they’re virtual robots”!  This has some advantages over real robots – no parts to throw or break, for example. This is a graded class and so I have to approach it differently. I’m still working out how I am going to assess their knowledge of robotics principles via Minecraft. I will create a final project assignment. What should the guidelines and expectations be for a Minecraft robotics project? I am making the class more academic by including lessons like this one.

WARM UP LESSON ON TURTLES

Kids used the link above and analyzed the programs, and made predictions about what they do. Then I opened Turtle Canyon and found each of the turtles with the programs in the document, and we ran them. We took another look at the code to match what the turtle did with the code. The group discussions helped me understand the programs a lot, and I hope to see the robotics kids being more adventurous with their coding as a result of the lessons.

You learn other things too, besides programming – and it’s what makes Minecraft such a confusing, but enriching, world to play in. I love it when lessons are nice and tidy and you have a certain goal and you’re laser-focused on that goal. But in Minecraft, you have to stay flexible with your goals. Some days, you’ll learn about robotics. On some days, you will learn anger management. Some days, teamwork. Some days, resource management. Self-advocacy. Information literacy. Conflict resolution. General persistence and resourcefulness. So I have to keep in mind that if a kid didn’t make much progress with programming, it was because their learning was happening in another area.

I leave you with this picture of my pixelated students interacting with their turtles building a house.

Turtles... so darn cute and programmable

Turtles… so darn cute and programmable