Creative Coding Workshops

Creative Coding

Here are some highlights of student project work after they had a sufficient grasp on the fundamentals of programming using the p5js creative coding library. They were required to use the programming methods that were taught in class, and then were allowed to create what ever they could imagine.


"Masterpiece" by Davith.
Davith played around with randomness as well as differences of circle diameters to experiment with the resultant patterns produced. Click on the sketch to change the diameter of the circle. Clicks that are closer to the center set smaller circle diameters.


"Inspector" by Visal.
Visal made an interactive game where the user has to find a hidden ball using the co-ordinate system clues. Click on the game and use the arrow keys on your keyboard to play..


"FIREWORKS" by Dalin.
Dalin created this colourful animation of fireworks


"Maze Print" by Rika.
Rika created a simple algorithm that reveals maze line by line.


Creative Technologies Curriculum

I developed this curriculum in order to expose students to a variety of different ways they could engage creatively with technology, whether it be from an electronic, mechanical or programming perspective. Students were encouraged to create and practice with the technology while following their imagination, rather than making impact and practicality be the main focus.

Data Visualizations

With the advancement of technology in modern times, there is an increasing number of new ways that data will be collected. With this new wave of data coming through, there needs to be better methods to effectively access an understanding of the potential insights they provide. In these studies, my students explored how symbolism, animations and interactions can help in communicating insights from the data sets they used.

We explored how to use the popular Javascript object notation (JSON) data format with the p5.js creative coding library to develop these visualizations.


"U.S Population Data Visualization" by Ketya Nop
Ketya created an interactive data visualization to compare populations sizes, ages and time periods for the United States. Hover the cursor from left to right to reveal the changes of populations. Click and hold on the sketch in order to focus on a specific year in the data set.


"Meteorite Data Visualization" by Vuthy Vey
Using the MapBox API, Vuthy created a visualization of meteorite sightings over a time period from 1780 to 2010.


"Poverty Rate in Cambodia" by Visal
Using the data from the organisation Open Development Mekong, Visal visualized poverty rates of various provinces in Cambodia. Hover your cursor over each circle to reveal the representative poverty rate.