Creative Animals, Functions, Parameters, Javascript… All In 60 Minutes!

By Sanjana Shah, Girls Innovate! Teen Committee

To celebrate Computer Science education week, Girls Innovate! wanted to participate in the global movement of ‘Hour of Code’. I was first introduced to programming at an ‘Hour of Code’ event two years back, where my interest in Computer Science sparked, and I wanted to pass it forward to more girls.

After discussing with Uyen, Girls Innovate! founder, we decided to make the curriculum a little challenging for the girls, rather than too easy. We wanted to nurture not only problem solving and analytical skills, but also introduce logic and design thinking to these girls. We desired to inspire creativity in a team-oriented environment and decided to go with Khan Academy’s Hour of Drawing tutorial, where the pace was neither too slow nor too fast. It was perfect for our targeted third to fifth grade audience. The Khan Academy tutorial uses basic Javascript language and the challenge was to draw a favorite animal. No programming experience was needed.

HourOfCode1The tutorial covered different commands with parameters, drawing many shapes using functions like ellipse(), triangle(), rect(), and arc(), seeing how the order of commands affected stacking of shapes, and also coloring and outlining shapes using predefined functions like fill() and stroke().

The 15-20 girls spots allotted for this event filled up very quickly and I was pleasantly surprised. In preparing my presentation, I decided to use Prezi so that it would cover both hands-on teaching and fun! Before my presentation, I practiced each and every tutorial to decide on the right pace and focused on how to explain functions and parameters in easy-to-understand terms.

The day of the event arrived and I was encouraged to see curious eyes. I was also excited by the fact that so many parents chipped in towards the cost of renting the room, which was $140. We raised a little more than the amount before the event ended.

We started coding! I taught them many functions, which allowed the girls to make many shapes. In the first challenge, ‘H for Hopper,’ I led them through the four parameters that go into a rectangle function, mentioning the importance of x-axis, y-axis, width and height, when plotting the rectangle. However, noticing that many of the girls were not familiar with plotting points, I went a step back and taught them about graphs. After completing the first challenge, the girls and I did the second challenge called ‘Crazy Face.’ This challenge involved the girls in making a face of their own creation with a few lines of code. With this, they were introduced to other shapes likes ellipse, triangle and arc. Now was the time to make their shapes colorful, using predefined function fill(). I talked about the RGB color wheel and how values of 3 colors can be used to reproduce many other colors. I stressed the importance of using the range between 0 to 255.HourOfCode3

The next challenge, ‘It’s a Beautiful Day,’ allowed us to take black and white images, that were created earlier, and add colors to them. I stressed that the order, in which the code was put in, matters a lot. For example, the background should be the first line of code, then everything should follow after. Otherwise if the background was the last command, the other components of the image would be masked by the background. After experimenting with this, the final challenge was to create an imaginary ‘Wild Animal.’ The girls started working on it, using the skills they learned in the previous challenges.  The pace for each girl varied but for all, the triangle was the hardest shape to build, so I decided to spend some more time explaining how to draw that shape. Several parents stepped in to help.

The projects were all so beautiful and unique! We had a caterpillar, a snail, a unicorn, a penguin and many more animals bursting with creativity and satisfied looks on the faces of the creators. Each girl received an ‘Hour of Code’ certificate of completion and I sense they felt empowered and more confident about programming than when we began. When we asked, all the girls wanted to do another session of programming in the near future. Many girls wanted to continue on doing more programming tutorials at home. Parents thanked me, I felt accomplished, and I’m grateful to Girls Innovate! for giving me this opportunity.