P5JS Programming Sketchbook

Collection of interactive drawings (P5.JS, 2024)

This is a collection of four interactive sketches that I made programming in P5JS which I had no experience in previously. From this project I learnt a lot about programming. For example, I learnt a lot about making functions and variables and it has made me confident enough to start learning a new language, C#! Each one is different and can be interacted with below. There are also a video showcasing each one that you can watch.

Alien Invansion

Alien Invasion is an interactive simulation where you can make a customisable alien to populate the moon. You can modify the alien’s body shape, size, and colour by using sliders. You can even add accessories and create your own typable face using a dropdown and textbox. Make as many aliens as you want to increase the moon’s population and watch them run around. You can even interact with the moon and space around it. Try moving and clicking your mouse to find out what happens.

Mosaic

This program can create a mosaic pattern from any image. Colours of similar shades connect to each other creating unique patterns. The image is randomised every time you load the program. If you want to see another one reload the page!

Draw With a Drip Effect

The canvas has a mirror effect meaning that what is drawn on one side will appear on the other. It is not a perfect mirror with the drips not going in the same directions for an interesting effect. Just click or click and hold to start drawing.

Word Tree

A tree made out of words on a windy day. This program transforms the text to convey new meanings.

What I learnt

How to program in P5JS
Learnt important programming fundamentals such as how to create functions and classes
How to create a program that can save user inputs and use them within the program
Learnt how to create art using code