One suggestion is to discuss your favorite web games or interactive experiences. Games such as agar.io, slither.io, etc. can be made with HTML5 + JS. If you know other games or examples please share them with the youth! Just be sure that you’re familiar and comfortable with any examples that you include.
If you introduce any web games or animations to the youth be aware that they understand that these projects are often made by professional teams, or by people with lots of experience. This course is designed to build their creative confidence with programming. Try to remind them that online games can be a source of inspiration but they shouldn’t compare their own skill levels to those of the developers. The goal is for youth to be inspired and feel confident as their skill develops. Make sure to remind them of this point if they lose focus or motivation.
There are some great walkthrough videos in the lesson that are fun and engaging. Make sure that the youth watch these either as a group or that they’re aware of the resource!
Additionally, you can extend your p5 sketch by creating a web interface that users can interact with. Since p5 creates a canvas element, It’s also possible to have more than one sketch running at the same time on a page, although this is out of the scope of this course.
P5 is becoming extremely popular for creating animations, digital art, games, data visualizations, and interactive web experiences. Several universities are teaching creative coding courses built around p5 and Processing. Dan Shiffman, an educator at NYU, is at the forefront of this community. He presents p5 as a great tool for “creative expression through programming” as you can create images, animations, user interactions, and games with the library. Dan Shiffman has an excellent YouTube channel called Coding Train where he creates p5 content. Some of the videos are about more advanced concepts or coding challenges, but this is a fantastic resource if you’re looking for some inspiration or ideas.
This introduction video is one of Dan Shiffman’s first Coding Train videos. Even though it’s from 2015, the content is still helpful and relevant. Make sure to watch at least the first 6 minutes as he provides a great (and enthusiastic!) introduction to the library.
When you complete this video move on to the next lesson which will get you started with using the p5 editor!