This blog post will maintain the links to the course, and will grow as I cover more topics.
Check back periodically or follow @algorithmic_art for new projects and updates.
Update - a single website for this course is at https://sites.google.com/view/creative-coding-for-kids
Update - I've started a youtube channel which will include videos associated with this course. The playlist is at https://goo.gl/ZYwXwv
Creative Coding for Kids
The course is designed specifically for young children, especially those who may not have coded before. This means:- the projects are kept as small as possible
- the language used is kept as simple and friendly as possible
- good use is made of pictures
Many projects and courses give children something to type out and observe the results. In contrast, this course will gradually
- introduce and practice computer science concepts
- introduce and explain a programming language
The course will be based on p5js, a language designed to make creative coding easy for artists. It will use openprocessing.org which allows us to code and see the results entirely in the web - no need for complicated software installs and source code files. It also makes use of simple.js which we previously developed to reduce barriers to first time and younger coders.
Projects
The course is divided into a setup and three levels.- Level 0 - getting set up for the first time
- Level 1 - first steps for complete beginners
- Level 2 - gently introducing key ideas like functions and repetition.
- Level 3 - more interesting ideas for more confident coders
Ideas are introduced and then used in later projects, so new coders should try to work through, or at least read through, all the projects.
They projects are designed to be small enough for children to try in a class or code club session. Parents and teachers are welcome to print out the PDFs.
| Level 0 | |
|---|---|
| 00 - Getting Started (PDF) | Getting set up with openprocessing.org. Testing it works. |
| Level 1 | |
|---|---|
| 11 - First Shapes (PDF) | Creating simple shapes - circles and squares. Using shape fill colour. Getting started writing p5js code. |
| 12 - Coordinates & Size (PDF) | Learn to use coordinates to place shapes on the canvas. Setting shape size - circle diameter, square. |
| 13 - Random Numbers (PDF) | Replacing size numbers we've chosen with numbers chosen at random by our computer . Selecting colours from a list at random. Using randomness for shape location. |
| 14 - Simple Variables (PDF) | Challenge of moving a group of shapes, and how remembering numbers can help. Variables imagined as box containing a number. |
| Level 2 | |
|---|---|
| 21 - Simple Functions (PDF) | Idea of functions as reusable recipes of code. Demonstrating how functions can save lots of typing. Seeing how updating a function benefits all uses of it. |
| 22 - Repeating Things (PDF) | Introducing idea of computers as perfect for repetitive tasks. Demonstrating using a function 200 times. |
| 23 - More Functions (PDF) | Passing information (parameters) to functions. |
| 24 - Mixing Colour (PDF) | Introduce RGB colour mixing, and calculating colours. |
| 25 - More Loops (PDF) | Using loops counters to pass as parameters to functions. Use to calculate shape size/location, RGB colour. |
| 26 - Artistic Maths (PDF) | Introduce sine waves, after trying linear and squared functions. Use sine waves to create shape and colour patterns. |
| 27 - More Colour (PDF) | Introduce HSB as an alternative colour model. See how picking colours and calculating combinations is easier than with RGB. |
| 28 - Loops Inside Loops (PDF) | Introduce nested loops, show how they cover 2-dimensions. Practise creative uses of nested loop counters. |
| 29 - See-Through Colour (PDF) | Introduce colour translucency. See how translucency help make busy designs work better. |
| Level 3 | |
|---|---|
| 31 - No So Random Noise (PDF) | Introduce Perlin noise as more natural and less random than pure noise. Explore uses for creating textures and patterns from noise displacement. |
| 32 - Moving Around a Circle (PDF) | Learn how trigonometry can help us move around a circle. See how trigonometry can create interesting orbital patterns. |
| 33 - Patterns Inside Patterns (PDF) | Learn about self-similarity and recursion. See how recursion can easily create intricate patterns. Learn how to think about building recursive functions. |
| 34 - More Flexible Loops (PDF) | Learn about javascript's own for loops. See how they’re more flexible than the repeat instruction. |
| 35 - Classes and Objects (PDF) | Learn about classes and objects. Learn to use objects to model moving things like fireworks or ants. |
| 36 - Code That Creates Code (PDF) | Create our own turtle language, and write an interpreter for it. Evolve turtle code as an l-system to draw interesting patterns. |
Feedback
I'd welcome suggestions for improving the course. You can email me at makeyourownalgorithmicart at gmail dot com.
The first users of the course will be members of CoderDojo Cornwall.
Source Code
The course encourages children to type their own code and not copy large chunks from an existing listing. Where it is helpful to see working code, it will be printed in the course.However, you may find some of the completed code sketches useful:
recently started a CoderDojo in Cornwall for children aged 7-17,
