For this assignment, I explored how a structured geometric system can respond to external interaction using physics. I created a symmetrical pattern that extends across the canvas, composed of small elements that are held in place through soft constraints. The goal was to simulate a system that feels stable and balanced, but still capable of disruption.
As the user moves their mouse across the canvas, the pattern begins to distort. The elements are pushed away from the cursor, creating a temporary break in the symmetry. Once the mouse moves away, the system gradually restores itself, returning to its original configuration. This creates a continuous loop between order and disruption, where interaction introduces instability, and the system’s internal structure restores balance.
This project is loosely inspired by responsive systems and generative patterns where structure is not fixed, but maintained through underlying rules. I was particularly interested in how symmetry can be preserved even when temporarily disturbed, and how small forces can create large visual changes.
Code Highlight
One part of the code I focused on was how the particles return to their original positions. Instead of manually animating them back, I used constraints in Matter.js to connect each particle to a fixed anchor point. This allows the system to naturally restore itself after being disturbed.
let spring = Constraint.create({
pointA: { x: x, y: y },
bodyB: body,
length: 0,
stiffness: 0.06,
damping: 0.08
});
This approach made the motion feel more organic, since the particles are not directly controlled but instead react to forces within the system.
Final Sketch
Milestones and Challenges
1. Building the initial pattern The first step was creating a grid that felt structured but still visually interesting. I experimented with spacing and conditions to create a pattern that extends across the canvas while maintaining symmetry.
2. Introducing interaction through forces I then added a repulsion force from the mouse. One challenge here was finding the right balance, since too much force made the system chaotic, while too little made the interaction barely noticeable.
3. Making the system return to form A key part of the project was ensuring the pattern would restore itself. Using constraints instead of manual positioning allowed the system to behave more naturally and maintain consistency.
Reflection
This assignment helped me understand how physics engines can be used beyond simple motion. Instead of focusing on collisions or gravity alone, I explored how forces and constraints can create a system that feels both reactive and stable.
I found it interesting that the interaction is temporary, but the structure persists. This creates a dynamic where the user can influence the system, but not completely control it.
Future Improvements
Introduce more complex symmetrical structures
Add variation in particle size or behavior
Experiment with different types of forces (attraction instead of repulsion)
Refine the visual output to emphasize the symmetry more clearly
This project explores a flocking system that evolves over time, not just in movement but in behavior and structure. Instead of keeping the system stable, I wanted to push it toward moments of tension, where the agents begin to compress, lose balance, and then break apart before reorganizing again.
The core idea is to treat flocking not as a natural simulation, but as a system under pressure. At certain moments, the swarm pulls inward and becomes dense, almost like it is being compressed into a single point. At other moments, that pressure releases and the system fractures outward.
In the prototype, I approached flocking as a kind of signal network, where agents connect through proximity and form temporary constellations. In the final version, I pushed this further into a more aggressive visual language, where the agents behave like fragments moving through cycles of compression and release.
Inspiration
In unfold by Ryoichi Kurokawa, visual structures emerge from data and gradually distort, fragment, and reorganize. This sense of systems building toward instability and then collapsing influenced how I approached the tension and release within my flocking system.
In the first prototype, I focused on building a flocking system that reads as a network rather than a group of individual agents.
Each agent connects to nearby agents, creating temporary lines that appear and disappear as the system moves. This produces a constantly shifting constellation-like structure. The motion is relatively stable, but the visual output is already starting to move away from traditional flocking representations. However, there is no strong sense of progression yet. The system exists in a continuous state without clear tension or release.
Final Sketch
In the final version, I introduced a time-based system that pushes the flock through cycles of compression and release.
The agents are no longer rendered as points, but as elongated shards, which changes how motion is perceived. Instead of reading as individuals, they begin to feel like fragments of a larger structure.
The system moves through phases:
Compression: agents are pulled toward the center, increasing density and tension
Instability: movement becomes more chaotic and tightly packed
Fracture: agents are pushed outward, breaking the structure apart
Reformation: the system reorganizes and the cycle repeats
These transitions are continuous rather than abrupt, allowing the system to feel more natural and performative over time.
Code Highlight
One part of the system I focused on was controlling the transition between compression and explosion:
let cycle = (sin(t * 0.6) + 1) * 0.5;
let compress = pow(sin(cycle * PI), 2.2);
let explode = pow(sin((cycle + 0.5) % 1.0 * PI), 2.2);
This allows the system to move through phases smoothly instead of switching behaviors on and off. The forces applied to each agent are then adjusted based on these values:
let alignW = lerp(1.2, 0.35, compress);
let cohesionW = lerp(0.7, 1.6, compress);
let separationW = lerp(0.9, 2.5, explode);
By shifting these weights over time, the same flocking rules produce very different behaviors, which creates the sense of development.
Milestones and Challenges
1. Breaking away from the “boids look” At first, everything still looked like a standard flocking simulation. Changing the rendering from points or triangles into lines and shards made a big difference in how the system is perceived.
2. Creating actual tension Early versions just moved smoothly without any variation. Introducing compression toward a central point made the system feel more unstable and intentional.
3. Balancing forces When separation was too strong, everything scattered too quickly. When cohesion was too strong, the system became static. The challenge was finding a balance that allowed both buildup and release.
4. Making transitions feel continuous Abrupt changes felt artificial. Using sine-based modulation allowed the system to evolve gradually, which made the motion feel more cohesive.
Reflection + Future Improvements
This project shifted how I think about generative systems. Instead of focusing only on movement, I started thinking about how a system can develop over time and create a sense of rhythm.
The most important change was moving from a stable simulation to a system that goes through cycles of tension and release.
If I were to continue developing this, I would:
Introduce sound so the system reacts to audio input
Explore depth by moving into a 3D space
Add trails to visualize past movement and build memory into the system
Refine the pacing so that each phase feels more intentional
Right now, the system loops continuously, but it could be pushed further into a more defined narrative structure.
For this assignment, I created a system of multiple vehicles that interact through different steering behaviors. The goal was to move away from simple motion and build something that feels alive, where each agent reacts to both the environment and the other agents around it.
The system is inspired by flocking behavior and Craig Reynolds’ steering behaviors, especially seek, flee, separation, alignment, cohesion, and wander. What interested me most is how a few simple rules can create complex and unpredictable motion when combined.
Instead of representing real-world objects like birds or cars, I kept the visuals abstract. This shifts the focus to movement itself. The vehicles behave like particles with intention, constantly adjusting their direction based on nearby agents and the mouse. The result is a system that feels dynamic and slightly unpredictable.
First Prototype
The first prototype focused only on seek behavior. Each vehicle moved toward the mouse using velocity, acceleration, and steering force.
At this stage, the system worked technically, but it felt very predictable. All vehicles behaved the same way and moved toward the same point, so there was no interaction between them. The motion looked flat and repetitive.
This version helped me understand:
how to structure the Vehicle class
how steering works using desired velocity minus current velocity
how to limit speed and force for smoother motion
It was a necessary step, but it did not yet feel like a system.
Final Sketch
In the final version, I combined multiple steering behaviors. The vehicles no longer only seek the mouse. They also separate from each other to avoid crowding, loosely align with neighbors, move toward a local center through cohesion, and wander slightly to avoid rigid motion.
The mouse interaction also became more dynamic. Vehicles are attracted to the mouse from a distance, but when they get too close, they flee. This creates a push and pull effect that keeps the system constantly shifting.
Because each vehicle balances multiple forces at once, the motion feels more organic and emergent.
Code Highlight
applyBehaviors(vehicles, mouse) {
let sep = this.separate(vehicles);
let ali = this.align(vehicles);
let coh = this.cohesion(vehicles);
let wan = this.wander();
let mouseDist = dist(this.pos.x, this.pos.y, mouse.x, mouse.y);
let mouseForce;
if (mouseDist < 90) {
mouseForce = this.flee(mouse);
mouseForce.mult(2.2);
} else {
mouseForce = this.seek(mouse);
mouseForce.mult(0.35);
}
sep.mult(1.8);
ali.mult(0.8);
coh.mult(0.7);
wan.mult(1.1);
this.applyForce(sep);
this.applyForce(ali);
this.applyForce(coh);
this.applyForce(wan);
this.applyForce(mouseForce);
}
This part of the code is the core of the system. Each behavior is calculated separately and treated as a force, then scaled using multipliers before being applied. This allows the system to balance multiple influences at once.
From a technical perspective, each behavior returns a steering vector based on desired velocity minus current velocity. These vectors are then combined through applyForce(). Adjusting the weights changes how dominant each behavior is, which directly affects how the system feels visually.
Milestones and Challenges
The first milestone was getting the basic vehicle system working with position, velocity, and acceleration. After that, I implemented seek behavior so agents could move toward the mouse.
The next challenge was that everything felt too uniform. All vehicles behaved the same way, which made the system predictable. I fixed this by adding separation, which prevented the vehicles from collapsing into a single cluster.
After introducing alignment and cohesion, the system became more structured, but also too rigid. To fix that, I added wander, which introduced small random changes and made the motion feel more natural.
Balancing the behaviors was the biggest challenge. If separation was too strong, the system spread out too much. If cohesion was too strong, everything clustered. If wander was too strong, the system became chaotic. A lot of the process involved fine-tuning these weights.
Reflection + Future Improvements
This project showed me how complex behavior can emerge from simple rules. The final motion is not directly designed. It comes from the interaction between behaviors, which makes the system feel more alive.
What worked well is the layering of multiple forces. Each vehicle is simple on its own, but together they create a dynamic system that constantly changes.
For future improvements, I would introduce different types of agents with different behaviors, such as leaders or more reactive agents. I would also add environmental constraints like obstacles so the system reacts to space in a more complex way.
Another direction would be to develop the visual side further, such as adding trails, color variation, or changes based on speed and proximity.
I tried to attach the video I recorded but it takes so long to download. but here is a picture instead 🙂
Reason for Choosing This Visual
I chose Massless Suns and Dark Suns because it looks simple at first, but the more you observe it, the more complex it becomes. The installation is built from glowing spheres of light, yet it feels immersive and almost physical. What interested me most was how interaction affects the space. When someone approaches a sphere, it responds, and that response spreads to nearby spheres.
I was drawn to how minimal the elements are, but how much atmosphere they create. There is no complex geometry or detailed objects, just light, spacing, and behavior. That made it a strong candidate to recreate in code because the challenge is not modeling objects, but recreating a feeling.
Highlight of Code
The part of the code I am most proud of is the “energy propagation system.”
Instead of triggering all spheres at once, each sphere influences nearby ones based on distance. This creates a ripple effect that moves through the system rather than a flat reaction. I also modified this logic so that once a sphere becomes a dark sun, it reverses the behavior and starts removing energy instead of spreading it.
This small change made the interaction feel more dynamic and gave the system two different modes of behavior.
Embedded Sketch
First Prototype
The first prototype focused only on basic glowing circles and mouse interaction. At that stage, the spheres would brighten when the mouse was nearby, but there was no propagation or system behavior. Everything reacted individually.
This version helped me understand how to create the glow effect using layered transparency, but it felt flat and disconnected. That is what led me to introduce interaction between the spheres.
Milestones and Challenges
Milestones
1. Visual Breakdown I started by analyzing the installation and identifying the key elements I wanted to recreate: glowing spheres, soft pulsing, and spatial interaction.
2. Orb System I created a class for the spheres so each one could store its own position, size, and energy. This made it easier to control them individually.
3. Glow Effect I experimented with multiple layered circles to simulate light. This was important because a single circle did not create the same visual depth.
4. Interaction I added mouse proximity detection so the spheres respond when the viewer moves near them.
5. Ripple Behavior I introduced energy propagation between nearby spheres, which created the chain reaction effect.
6. Creative Twist Finally, I added the dark sun transformation, where some spheres change behavior after repeated activation.
Challenges
One of the main challenges was making the spheres feel like they emit light rather than just being colored shapes. This required layering multiple transparent shapes and adjusting opacity carefully.
Another challenge was controlling the ripple effect. If the energy spread too quickly, everything would activate at once and lose the sense of flow. If it was too slow, the interaction felt unresponsive. Finding the right balance took multiple iterations.
The biggest conceptual challenge was adding a twist without losing the original inspiration. I wanted the system to evolve, but still clearly relate to the original installation.
Reflection and Future Improvements
This project helped me understand how much of an artwork can be recreated through behavior rather than exact visuals. The installation is not defined by specific shapes, but by how those shapes respond and interact. Translating that into code required focusing on motion, timing, and relationships between elements.
The addition of dark suns made the system feel less predictable and more alive. Instead of always returning to a stable glowing state, the system changes over time based on interaction. This made the piece feel more dynamic and slightly unstable.
For future improvements, I would like to explore adding depth, possibly by introducing a 3D space or parallax movement. I would also experiment with more complex interaction, such as tracking multiple users or using sound input to influence the system.
Proliferate is a generative visual system inspired by the behavior of bacteria growing inside a petri dish. The project explores how simple rules of division, movement, and environmental influence can produce complex and aesthetically varied visual outcomes. The system simulates colonies that expand outward in generations, referencing the biological process of binary fission, where organisms divide and multiply over time.
The composition is centered around a circular dish that frames the interaction space. Within this space, colonies emerge, expand, and drift, creating layered visual trails. While the initial intention was to simulate a blooming effect similar to organic growth patterns, this proved difficult to achieve. I attempted to incorporate molding behavior based on feedback from a project check-in, but this was only partially successful. Instead, the system evolved toward a balance between structured growth and organic motion.
The project is designed to feel slightly gamified. Users can interact with the system by introducing new colonies and adjusting environmental conditions in real time, which directly influence how the system evolves visually. The name Proliferate comes from the rapid division of bacteria and reflects the way visual elements multiply across the canvas.
Generative System Design
The system operates through interactive and evolving states rather than fixed outputs. Each interaction produces a different visual result, ensuring variation across compositions.
These variations are driven by:
User interaction through mouse input
Adjustable environmental parameters
Generational growth of colonies over time
Each colony grows in stages, where the number of cells doubles with each generation. This creates radial formations that feel structured, while the movement of individual cells remains fluid and unpredictable.
The system combines multiple techniques:
Noise-driven motion to create organic wandering behavior
Force-based movement, including attraction and damping
Generational expansion using exponential growth patterns
Real-time parameter mapping through interactive controls
Together, these elements create a system that balances control and unpredictability.
Interaction and Environmental Controls
The system includes four sliders that act as environmental conditions influencing the behavior of the colonies. These are designed to feel like variables within a biological system.
Energy increases the movement of the cells. It can be understood as adding nutrients to the environment, causing the bacteria to become more active and spread further.
Growth controls how many times a colony divides. Higher values create dense and complex formations, while lower values result in minimal structures.
Air affects the speed of movement by influencing how quickly the noise changes. Higher values create more chaotic and dynamic motion.
Pull controls how strongly cells are drawn toward the center of the dish. Increasing this value creates tighter clustering, while lower values allow the system to expand outward.
These controls allow the user to experiment with different “conditions,” producing a wide range of visual outcomes from calm and contained to chaotic and dispersed.
Implementation and Process
This project builds on an earlier midterm progress version, which initially explored generative motion without a strong structural system. In that version, the movement had a more fluid and wiggly quality, creating trailing, tail-like forms that I found visually interesting. However, this behavior relied on continuous accumulation and became a major performance issue, causing the system to lag significantly over time.
Additionally, the particles were not constrained within a defined boundary, so they would drift across the entire canvas rather than staying within the petri dish. While this created more chaotic and expressive visuals, it further contributed to performance issues and reduced control over the composition.
Because of these limitations, I shifted toward a more structured approach. The updated system constrains all movement within the dish and introduces a generational growth model, which significantly improves performance and stability. As a result, the system feels less laggy and more controlled.
Through iteration, the work developed into a more defined system centered around colonies and generational growth. Instead of relying purely on continuous motion, I introduced a structured expansion model where colonies grow outward in rings, allowing the system to remain stable while still feeling dynamic.
Each colony consists of cells arranged in expanding rings. These cells maintain a base position but are continuously influenced by motion and forces, allowing them to shift, drift, and create layered visual traces over time without overwhelming the system.
A key challenge was attempting to replicate organic blooming or molding behavior. While I explored this direction and attempted to implement it based on feedback from a project check-in, the result was not fully realized within the timeframe. This led to a shift toward a hybrid approach that combines structured radial growth with organic motion.
While the current system is more stable and responsive, it does feel slightly less visually expressive than the earlier version. However, this trade-off allowed for a more reliable and interactive experience. I believe there is a way to achieve both performance and richer organic behavior, but I have not fully reached that solution yet.
The interface was intentionally kept minimal and clean to prioritize the visuals. Buttons for restarting, saving, and toggling information were designed to feel simple and unobtrusive, supporting the interaction without distracting from the system itself.
Sound is triggered when a new colony is introduced. The audio was sourced from freesound.org and adds a subtle layer of feedback to the interaction, reinforcing the moment of activation within the system.
The project evolved significantly from its initial version. Early experiments focused on movement but lacked compositional clarity and structure.
Key developments include:
Introducing generational growth patterns
Adding environmental controls through sliders
Establishing a clear composition using the dish as a boundary
Refining motion through the combination of forces and noise
Although the original goal of achieving a blooming effect was not fully met, the current system reflects a stronger balance between control and emergence.
Final Outputs
The following images represent selected outputs from the system:
High energy and growth settings produce dense, overlapping colonies, with movement constrained within the petri dish boundary.Lower energy and growth settings produce sparse, evenly distributed colonies, with movement constrained within the petri dish boundary.Moderate energy and growth settings produce a balanced colony distribution, where controlled movement and expansion create a layered yet readable system within the constrained dish.
Reflection
Proliferate demonstrates how simple behavioral rules can generate complex and visually engaging systems. The combination of structured growth and dynamic motion creates a space for continuous variation, where each interaction produces a unique outcome.
One of the strongest aspects of the project is the ability to control environmental conditions in real time. This encourages experimentation and allows the user to actively shape the visual result.
Future improvements would focus on developing more convincing organic behaviors, particularly in relation to blooming or molding, as well as expanding the system to include additional modes of interaction or evolution over time.
References and AI Disclosure
Inspirations:
Bacterial growth and binary fission
Petri dish cultures and laboratory environments
Sound:
Audio sourced from freesound.org
AI Disclosure: AI tools were used as support throughout the development process, primarily for debugging, refining specific parts of the code, and understanding how certain behaviors could be implemented more effectively. AI was also used to help improve the interface design, including the structure and responsiveness of buttons and controls.
All core ideas, system design decisions, visual direction, and experimentation were developed independently. AI functioned as a technical aid rather than a generator of the project itself.
This project explores bacterial life inside a petri dish through the logic of binary fission. I was drawn to the simplicity of exponential growth. One cell becomes two. Two become four. Four become eight. That pattern is mathematically precise, yet visually it can feel organic and alive.
The petri dish acts as both a laboratory setting and a contained world. From the perspective of the bacteria, this circular boundary is their entire universe. Growth is not aggressive. It is natural, repetitive, and inevitable.
Through this project I am trying to visualize how simple systems can produce complex spatial transformation. The tension between geometric symmetry and organic movement is central to the concept.
System Design
The system is built around exponential growth using 2ⁿ logic.
It starts with one cell at the center. Each click doubles the generation. Each generation forms a new ring.
Everything is placed radially so the growth feels intentional and structured. At the same time, each cell has slight motion driven by noise so it does not feel like a static diagram.
I also introduced generational color shifts and soft background fades so the system leaves trails, almost like activity inside a petri dish.
The interaction is simple. Click and it divides. The simplicity is important to me. I did not want complicated controls. I wanted the act of division to feel immediate.
Prototype 1
The first prototype was very minimal.
It only tested the binary fission logic and radial placement. No sound. No complex motion. Just structure.
Visually it looked clean but almost too perfect. It felt more like a scientific chart than something alive. But it helped me understand how strong the doubling pattern actually is. Even in its simplest form, it already had presence.
That prototype gave me confidence that the system itself was strong enough to build on.
Current Version
The current version feels more alive.
Each cell now wiggles slightly within a constrained space. The trails create a sense of time passing. Multiple colonies can grow at once, which makes the space feel like an ecosystem rather than a single event.
The aesthetic has shifted away from realistic biology and more toward a luminous, speculative petri dish. It feels less clinical and more atmospheric.
I am excited about how something so rule based can still feel organic.
Concerns
I am still figuring out how to balance symmetry and irregularity.
Sometimes the radial placement feels too perfect. Real biological systems are not perfectly spaced. I may experiment with slight offsets to make the growth feel less mechanical.
Performance also becomes a concern at higher generations. The exponential logic is beautiful, but it scales quickly.
I also want the motion to feel softer and less jittery. I want it to feel intentional, not random.
Improvements for Final Midterm
For the final submission, I want to:
Refine the motion so it feels more like soft bodies. Experiment with subtle asymmetry. Introduce multiple modes, possibly a strict geometric mode and a more organic mode. Test higher resolution rendering for A3 printing.
I feel like the core idea is strong. Now it is about refinement and sensitivity.
AI Disclosure
I used AI briefly to help refine parts of the exponential logic and tune motion parameters while troubleshooting performance.
This project was created in response to the assignment requirement to use Memo Akten’s exploration of Simple Harmonic Motion as a starting point. The goal was to understand how oscillation can function as a generative system rather than just a repetitive mechanical movement.
What I found most interesting in Memo Akten’s work is how simple sine functions can create complexity when layered together. Instead of treating harmonic motion as a physics simulation, I treated it as a compositional structure. I used multiple oscillators with different frequencies and phase shifts so that interference patterns would emerge naturally from the system.
Rather than keeping the study abstract, I translated the oscillatory behavior into a tidepool ecosystem. Each anemone is driven by overlapping harmonic functions that simulate tidal pull, organic sway, and micro-movements within the tentacles. A slower oscillator controls the bloom intensity, which creates a bioluminescent effect that feels ecological instead of mechanical.
I was mainly inspired by their bioluminescence and the way they sway so beautifully in the water, this is the image the drew the majority of the inspiration and what I’ve tried to mimic. However when I was done, I realized that this looks like the small lights in the new near by gas station “the hub”, makes me wonder if the inspo was more subconscious??
Code I Am Particularly Proud Of
One section of code I am particularly proud of is the multi-layer harmonic interference that drives the tentacle motion:
// I used AI to help achieve this :)
let oscA = sin(this.t * 1.55 + p);
let oscB = sin(this.t * 0.92 + p * 0.7 + this.phase);
let oscC = sin(this.t * 0.45 + p * 1.9);
let sway = (0.75 * oscA + 0.45 * oscB + 0.25 * oscC + this.current) * 0.65;
I used AI to help refine this blending logic. My intention was to create layered oscillation instead of a single sine-driven movement. The AI-assisted refinement helped structure the interference in a way that felt balanced without becoming chaotic.
This section is important to me because it shifts the system from predictable motion to something that feels organic. By combining oscillators with different frequencies and phase relationships, the movement becomes more ecological and less mechanical while still remaining mathematically grounded in Simple Harmonic Motion.
The Sketch
Milestones and Challenges
The first milestone was building a single anemone driven by one primary harmonic function. The focus at this stage was verifying that the tentacle sway behaved consistently and that amplitude, frequency, and phase shifts were functioning correctly.
Challenge: The motion initially felt mechanical and repetitive. With only one oscillator driving the movement, the behavior was too predictable and visually flat. This prototype helped me understand the limitations of a single harmonic source.
[gif to be added but the upload time is sooooo looooooonnnnggg :/]
instead here is a video:
The second milestone introduced multiple oscillators and expanded the system into a grid of anemones. This is where interference patterns began to emerge. I layered harmonic functions with different frequencies and phase offsets to create more complex sway.
Challenge: Balancing complexity without losing control. When too many oscillators were layered equally, the movement became chaotic. I had to adjust weight values so the system felt organic rather than noisy.
This stage also introduced the idea of a global tide and a directional current controlled by mouse movement.
Reflection and Ideas for Future Work
Through this project, I began to understand how Simple Harmonic Motion can function as a structural system rather than just a visual effect. Layering oscillators changed the behavior significantly, and small adjustments in frequency and phase created noticeable shifts in organic quality. The process reinforced how sensitive generative systems are to parameter balance.
One of the main insights was that complexity does not require complicated formulas. It requires intentional relationships between simple ones. When I reduced or reweighted oscillators, the motion became more coherent. When I over-layered them, the system lost clarity. This balance became central to the final result.
For future development, I would like to explore local interaction between anemones instead of having them behave independently. Introducing neighbor-based influence could allow wave propagation across the field. I am also interested in integrating audio input so harmonic frequencies respond dynamically to sound.
Finally, I would experiment with scaling the system for projection or installation, where viewer proximity could influence tide intensity or bloom cycles. Expanding the system spatially would shift it from a screen-based study into an environmental experience.
This project explores how small particles in nature respond to invisible forces in their environment. I was inspired by drifting pollen, spores, and algae suspended in water. These natural elements do not move randomly. They respond to forces such as gravity, air currents, and nearby bodies.
Using the attractor and mover structure introduced in class, I reinterpreted the system as an ecological field. The attractors function as environmental centers of influence. The movers behave like pollen particles that continuously respond to these forces. Instead of presenting a physics demonstration, the system is used to generate an evolving visual pattern.
The visual accumulation of trails transforms the physical simulation into a generative design.
Code Highlight
One section I am particularly proud of is the gravitational force calculation inside the attractor. This formula controls how each particle responds to distance and mass, and it was important to balance it so that movement felt stable but still dynamic.
This part connects directly to the force and acceleration principles explored in class.
let force = p5.Vector.sub(this.pos, mover.pos);
let distance = constrain(force.mag(), 20, 250);
force.normalize();
let strength = (this.G * this.mass * mover.mass) / (distance * distance);
force.mult(strength);
return force;
Code
Milestones and Challenges
Scaling the system from a single mover to many movers was an important milestone, as it shifted the focus from isolated motion to collective behavior. Maintaining stability while multiple forces acted simultaneously required careful adjustment, especially to ensure smooth and continuous motion across the canvas. Refining the visual output so that movement accumulated into a coherent pattern was also part of the development process. The main challenge was balancing the strength of attraction. When the force was too strong, particles collapsed into tight clusters, and when it was too weak, the system lost cohesion. Fine tuning the relationship between force strength and distance was necessary to achieve controlled but organic motion.
Reflection and Future Improvements
This project demonstrates how simple force based rules can generate complex collective behavior. Even though each particle follows the same physical logic, their interactions create layered and evolving patterns.
In the future, I would explore introducing interaction or additional forces to create more spatial variation. I am also interested in experimenting with alternative visual mappings to further strengthen the natural aesthetic.
For this assignment, I chose to simulate the movement of a moth attracted to a lamp, inspired by how insects behave around light sources in nature. When observing moths, their motion is rarely direct or smooth; instead, it feels hesitant, wobbly, and slightly chaotic.
The goal of this sketch was to recreate that behavior using only acceleration-based forces, without relying on complex visuals. The personality of the moth comes entirely from how it moves rather than how it looks.
The lamp acts as a constant attractor, while a subtle wobble force gives the moth an organic, fluttering quality.
Code Highlight
The part of the code I am most proud of is the wobble (flutter) force, which adds personality to the moth’s movement without making it feel random:
This small oscillating acceleration creates a natural, insect-like flutter. Combined with the attraction to the lamp, it makes the moth feel alive and slightly unpredictable, rather than robotic. And, this is where I used ChatGPT’s to help.
The Code
Reflection & Future Work
This project helped me better understand how simple rules can create believable natural motion. Using acceleration alone forced me to think carefully about how each force affects the behavior over time.
What worked well:
The combination of attraction and wobble felt natural and readable.
Limiting speed and force helped keep the movement smooth.
Keeping visuals simple allowed the motion to stand out.
If I were to continue developing this sketch, I would:
Add a “panic zone” near the lamp where the moth starts circling instead of approaching directly.
Introduce multiple moths with slightly different parameters to give each one a unique personality.
Experiment with a pulsing or moving light source to see how the behavior adapts.
The concepts explored in this reading were very central to how we view things and analyze not only nature but also human-made systems like the stock market. What left a strong impression on me is how important it is to analyze interaction in order to truly understand what something is. At the beginning of this chapter, Flake introduces the idea of reductionism, which is the process of reducing something into increments to better understand its true nature.
In my understanding, we are invited to look at this from a rather “scientific” lens in order to see how we could apply a similar concept in computing. This leaves me with the impression that it is very important for us to first understand how dissecting something in terms of meaning can then help us introduce that understanding to a computer.
The Concept
My concept is inspired by fireflies. Having never experienced them, I have always been curious about what it would feel like to interact with one, so why not simulate it?
For the sake of simulating human-to-firefly interaction, I did not want the firefly to simply float around randomly. I wanted it to follow the mouse around the sketch in order to translate a sense of curiosity between both the firefly and the user.
I implemented a Gaussian random walk (List 1) and mapped the motion to color and brightness to create a firefly glow effect (List 2).
I’m proud of this part of the code because I wanted the firefly’s glow to feel as natural as possible. Using Gaussian randomness makes the brightness fluctuate gently instead of jumping unpredictably, and constraining the values keeps the light within a realistic range.
The Sketch
Reflection
Initially, I wanted to mimic bacteria and binary fission, but that idea felt a bit too ambitious at this stage. I decided to step back and focus on exploring motion in a simpler way, which led me to this firefly concept. I was interested in creating something that felt organic and calm rather than complex.
For future work, I wanted to place the firefly over an image of a forest, but I realized that doing so would either cause the firefly’s trail to disappear or require the background to fade over time. I think finding a way to balance a real forest image with the artificial movement of the firefly could be an interesting direction to explore further.
:max_bytes(150000):strip_icc()/growing_bacteria-5b56347ac9e77c0037c64487.jpg)
