top of page

Creative Coding Project

The principal idea revolves around creating an engaging and visually captivating interactive particle system that allows users to observe the emergence of new particles with changing colours whilst simultaneously allowing them to control the speed of the particles via mouse hovering.

Timeline

Role

Collaboration

Platform

February 2023-May 2023

Researcher, Coding

a team of three

Visual Studio Code

Project Pitch

The two white circles at the centre of the SVG represent a starting point akin to the dense and initial state of the universe. As these circles touch each other or the edges of the SVG, their colours undergo random changes. Also, as the circles that touch each other will split, it symbolizes the expansion and evolution of the universe, mirroring the cosmic growth from the early stages of the Big Bang. This splitting and colour-generation process continues as the circles touch each other again, leading to further splits and additional random colours. You can control the speed of the circles by the position of the mouse hover, with upward movement increasing the speed and downward movement decreasing it. Furthermore, a round blue or red circle stroke around the mouse serves as a visual indicator of the current speed control mode. When the amount of circles reach the maximum limit, the screen will be reset, this heralds a new phase in everything.

Logical Rules 

Universe Background: 

Create a visually appealing background representing a vast universe, using several small, shining white dots to depict stars or small planets, thus adding to the vastness of the simulated universe. 

Create Balls: 

Position two white balls at the centre of the SVG as the starting configuration. 

Colour Change and Splitting: 

When balls or the edges of the SVG touch together, introduce random colour changes to the balls and split them into two new balls. 

Screenshot 2024-03-26 at 10.25.47 am.png
Screenshot 2024-03-26 at 10.25.53 am.png

Continued Interaction: 

Allow the colour change process, splitting, and particle generation to persist as the balls repeatedly touch the edges. 

Speed Control: 

Use the mouse hover control to regulate the particle speed. Moving the mouse upward should increase the speed, whilst moving it downward should decrease it.

Screenshot 2024-03-26 at 10.26.08 am.png

Visual Feedback: 

Display a round blue or red circle stroke around the mouse to indicate a slow or fast speed control mode visually. 

bottom of page