Cloud Project

With the success of the 3rd grade Superhero Scratch project in March, I decided to see if 2nd graders could make a similar project and be successful.  They study cloud types as part of their science curriculum so that’s the direction I went.

Screen Shot 2016-05-04 at 7.17.20 PM

This project was very similar to the 3rd grade project but the drawing was easier – simple background and a white cloud – although even that turned out tricky.  I trimmed down the code required to 5 lines.  Still it took a while to complete.  I have 2 of the 3 class videos completed.  The other class just needs to Record Project Video and I’ll have all of their clips ready to put together.

Step 1:  Introduction to the project:  I showed the class what the project was going to look like and laid out the steps we were going to take.  Many were excited that they were going to be on YouTube.

Step 2:  Draw the Background: In the computer lab we used Paint to draw the background.  I modeled drawing a horizon line, then using the fill bucket to fill in the sky and the ground. This could be done in Scratch as well.  Save the Paint project and research clouds while everyone finishes up.

Step 3: Draw the Cloud: We used Paint to draw the cloud.  I modeled filling in the background with gray or light blue and then using different Paint brush types in white to draw the cloud they had chosen: cumulus, stratus or cirrus were the 3 types that we ended up using.

Screen Shot 2016-05-04 at 7.13.45 PM

 

Here’s where Paint and the different brush types helped add texture to the clouds.  Save again.  (I basically did one step per lab time, just so I didn’t lose anyone)

Step 4:  Import the Assets into Scratch 2.0 (offline editor) – this was their first time in Scratch so we had to look around and notice the Stage and Sprites, code blocks… etc.  Then we “cut” the Scratch Cat away and imported our background to the Stage (our Paint file didn’t quite fill the Stage, but that turned out not to be important when the video was cropped to  wide-screen in production)   Next we added our cloud Sprite.  The Sprite included the gray or blue background but we removed that with the fill bucket by filling in “nothing” or “invisible” over the background.  I’m not sure what is the best term to give to setting the alpha channel. This was a bit of a tricky part.  Also resizing the cloud. Save the Scratch project – I had them save it in their picture folder where the background and cloud files were.

Screen Shot 2016-05-04 at 7.12.58 PM

Step 5: Coding the Animation: It’s only 5 lines of code.  When the green flag is clicked, the clouds says it’s name and then floats to the left or right forever (bouncing off the edges). When I modeled this, we noticed that 10 steps at a time is too fast for a cloud.  1 step is more cloud-like. I made half-sheet printouts of the 5 lines of code.  I wrote the cloud names on the board so they could spell correctly.  Saving really seemed to be our biggest issue.  I did spend some time troubleshooting clouds not to flip upside-down or go off screen.

Screen Shot 2016-05-04 at 7.18.18 PM

Step 6: Record Project Video:  The last step.  I wrote up a detailed step-by-step for my sub, hoping it would happen. The other two classed did a great job but occasionally would forget to click the green flag, so we got 20 seconds of a un-animated cloud.  Having the 2nd graders do this step is a big time saver for video production.

Screen Shot 2016-05-04 at 7.14.47 PM

The next step was for me to convert the project files from .flv to .mov or .mp4, (I used Free MP4 Converter  software) put them together in movie making software (I use a iMovie at home, but WinMovieMaker at work), find some cloud music –Ferde Grofé’s Grand Canyon Suite seemed to fit the bill. And finally, upload to YouTube.  I showed one class their video today and they were pleased, although some couldn’t pick their cloud out of the group.  -hmmm, maybe a bit more customization of the background…

 

Here are the links to the YouTube videos:  MacNeil’s Class Video & Horne’s Class Video

I will see next year when these students are 3rd graders if making the Superhero project is easier or if we can do more with it.  I wasn’t able to do this project with all the 2nd grade classes, but it is a start.

Advertisements

Health-o-meter Sprite and Stamping

Last week I introduced my Health-o-meter sprite to the students.  It’s based on the Health Meter sprite Colleen Lewis, the professor of the Scratch Programming MOOC on edX, shared in the class.  I noticed a couple of students adding the sprite to their project or making their own version.  It will be interesting to see it in action.

Health-o-meter script and costumes

Health-o-meter script and costumes

In general, Code Club went well again last week.  Students are making progress on their individual projects and the number of issues that crop up are not overwhelming.

Although one student’s query had Alex, my high school volunteer, and I stumped.  The student is making a paint program similar to Paint Box, a Code Club World project we worked on earlier in the term.  She has taken the basic project and is adding more colors and features to it.  One addition she is working on is a stamp tool.  She has drawn a few sprites: rainbow, present, balloon, lightning and wants the user to be able to place copies of the stamp on their drawing. Scratch 1.4 has a stamp block in the Pen menu but she was having trouble getting it to work.  Alex and I both looked for help on Scratch Wiki, but were not successful in getting any code to work in the moment.

I spent some time today researching and testing some code and I think I have a couple of different algorithms for her to try tomorrow.  I did find a good resource through the Scratch Wiki – a Stamping tutorial and explanation, which helped get me started.

One way to work the stamp tool would be to have the sprite “stamp” itself in a random location on the stage.  Here I have a ball sprite and when the sprite is clicked, a copy of the sprite will appear on the stage in a random position.

stamp tool, version 1 -random placement

stamp tool, version 1 -random placement

That’s okay, but I’m sure the “painter” would like to pick the place where the stamp will go.  So I worked again to improve my solution.  Here the ball sprite moves with the mouse when clicked.  When the painter presses the “s” key, it makes a stamp of itself and the sprite returns to its original position on the toolbar.

Screen Shot 2015-03-24 at 7.49.02 PM

Stamp tool, version 2 – click and press “s”

That is better.  Now, though, I have to instruct the “painter” to press the “s” key to stamp. So I took one more try at the code.

Stamp tool, version 3 - on click

Stamp tool, version 3 – on click

This seems to work in my simple case, but I know in her paint program a lot of drawing happens with mouse down, for example, the pencil goes to the mouse-pointer. She will have to try it and test it.

Screen Shot 2015-03-24 at 7.58.06 PM

Something else could go in the repeat until – like the sprite could say “click to place”.  As always with code – different algorithms can give similar results.  One way may more pleasing to the coder than another.

I can’t believe there is only two more weeks of Code Club.  Students will need to finish up tomorrow and we all need to prepare for Showcase #2.