The new Grade 8 Computer Science class is a semester one. For a whole semester pre-High school students experience a range of computational methods and tools to better understand (and create) the world around them. This typically used to be a programming only course. Given its relevance in being a bridge between Middle and High school years, I felt it apt to convert it to a more IT/Computing offering letting students learn a blend of concepts including cybersecurity, design and development using Google Suite, a quick intro to databases, and of course, my personal favourite – Programming.
For their first unit students worked on their coding unit via P5JS. Why this platform? Well – as I have blogged in the past (Sample 1, Sample 2) P5JS is a fun JavaScript platform with plenty of heavily abstracted functions making it an ideal start for many code beginners. The visual appeal of the outputs, combined with basic reliance on the Math of it, makes it appealing and intuitive to a range of learning approaches.
So this year, we did a couple of interesting projects within the coding unit. Students started off by trying their hand at the Self Portrait Project to get used to using the basic functions.
Students built a range of different representations of themselves using functions like ellipse( ) , text( ) and fill( ). Some of their creations below.
Private details like names and other descriptions removed for data privacy.
The end of unit assessment included some animation with draw( ) function. To keep it in line with the interdisciplinary nature of things, I decided to link it with the idea of telling stories. Students had to come up with a plot, a basic one, and built a small animation around it. They had complete freedom with what kind of story they wanted to tell – genre, characters, setting etc. They would then use P5JS to build an animated version of the plot as a book cover representation. Almost like an animated poster.
Here are some of their creations.
Each book cover was built completely with P5JS code. Each of the shapes you see were developed using a combination of functions available. Parameters sent to them were modified and the correct code sequence was written for the animated bits to happen.
As you can see, the functional programming approach helped students build a sequential algorithm.
Having access to P5JS’s reference library allowed students to quickly check up sample code for a wide range of mathematical functions.
Among the trickiest functions to use, though, were the arc( ) and triangle( ) functions. Plenty of trial and error efforts had to go in before students were able to manage the correct values for their desired shapes.
The draw( ) function allowed for frame based animation to take place (animated samples below) so that the book covers had both movement, interaction (with a button) and audio in the form of background music and/or speech.
Key Takeaways
The teaching structures have changed this year so instead of teaching a trimester of each grade level in middle school – 6 to 8 – I am only teaching Grade 8 for a semester each. My remaining high school classes remain as they were for IGCSE and IB requirements.
What this has meant though is more frequent meetings with students and a better unit based approach which allows for a wider range of skillsets to be covered. This programming unit was a good starting point for us since we began by understanding algorithms and logical design. This has then made way for our second unit on Cyber Security and our current one on the Google Suite and associated tech.
Allowing students the freedom to build any type of solution within the confines of the programming platform allowed for every student to engage in their own way. Even students who have found programming quite challenging as a process were able to create some unique and fascinating designs. Some more examples below.
Compute Thought 