Part code, part sketchbook
P5JS
AREA OF CODE
01.
Nightsky
My first-ever p5.js project, built while exploring the basics of interactivity and color changes. It begins as a daytime landscape, but as you move the mouse (with the moon attached) toward the sun, the sky gradually darkens, the buildings light up, and the entire scene transforms into night.
02.
Puzzle
A simple jigsaw puzzle built using the ATLAS logo – the department I study under. This project helped me understand image slicing, object mapping, and user interaction through drag-and-drop mechanics.
03.
Poster
This was a basic assignment to create a static poster using text and coordinate placement in p5.js – but I took it a step further. I designed an interactive tear-off poster for dog adoption. Every time you “take” a strip, the dog is one step closer from being released from the cage, turning a simple visual into a tiny emotional moment.
04.
Landscape
This project was about visualizing the passage of time. I created a looping landscape with a car driving through it, where 60 seconds of real time equals one full day. Every 30 seconds, the scene transitions smoothly between day and night – a calm, continuous rhythm that reflects time in motion.
05.
Data Visualizer
This project was about finding creative ways to represent real-world data. I chose to visualize the number of infant deaths due to COVID-19 – 630 in total – by turning each life into a quiet, twinkling star, representing peace and remembrance. The visual doesn’t focus on the exact count, but rather the feeling; the number itself is displayed in the console. It’s a simple piece, but it left a mark on me.
06.
3D
As we began experimenting with 3D in p5.js, I came across a cool 3D illusion reel on Instagram and decided to recreate it from scratch. It was all about learning depth, perspective, and motion within a 3D space – and it was oddly satisfying to bring a flat idea to life with real dimension.
07.
Mood Matcher
Inspired by an anime-style game I saw on YouTube, Mood Matcher is a browser game where you try to mimic the expression of a random emoji using your face. If you don’t match the mood in time, you lose a life – and you’ve only got three. It’s silly, fast-paced, and harder than it looks.
If you click on the credit/instructions button before starting, the game won’t launch. Please refresh the page to restart – I’m working on fixing that!