Coding Concepts with the Colorful Canvas

Coding has about as many rules as chess

Dr Abstract
12 min readJul 23, 2020


Welcome readers from ◎ Your Guide to Coding Creativity on the Canvas

ZIM Intro example demonstrating aspects of coding

Code contains the instructions that we give the computer to run an app such as a game, tool, art, puzzle, visualization, etc. In this guide we show the basic parts of coding and demonstrate these in a colorful way on the canvas!

We say colorful, because often, people are taught code using a console — so they see only text which can be a little boring for visual learners.

One distinction we should make is that HTML and CSS, which make Web pages, are called code as well. These two are tagging languages and are missing the logic and dynamic aspects that come with traditional coding. This is a reason that we sometimes use the term programming rather than coding.

Overview of Parts of Code

There are three main areas of code. We have listed these and their parts below. The number of things to keep track of as you code is very similar in memory and understanding to that of playing chess. Of course, chess is a game where as code provides a much broader opportunity for expression! You are free to make the world!




Dr Abstract

Inventor, Founder of ZIM JavaScript Canvas Framework and Nodism, Professor of Interactive Media at Sheridan, Canadian New Media Awards Programmer and Educator