BOIDS Tool

BOIDS Tool is a parametric generative playground built with p5.js, based on Daniel Huang’s original Boids demo ↗. It lets you dive into emergent flocking dynamics through real-time parameter adjustments and direct interaction. Each “boid” is a simple agent that recalculates its movement every frame by following three fundamental rules:

Separation: steer away from boids that get too close.
Alignment: match the average heading of nearby boids.
Cohesion: move toward the average position of neighboring boids.

So, to put it simply - there’s no central controller, each agent only “sees” others within its vision radius and runs these vector calculations locally.

---

Behavior Parameters:

• Move Accuracy: Limit the number of neighbors each boid considers. Lower values make each boid “focus” on fewer peers; higher values give a fuller, but heavier, calculation.
• Boid Vision: Radius around each boid in which it looks for neighbors. A larger vision makes the flock more coherent over distance; a smaller one yields tighter local groups. High values greatly affect performance.
• Alignment Force: How strongly boids steer to match the average direction of their neighbors.
• Alignment Bias: An extra multiplier that boosts alignment when neighbors’ headings are already similar. Affects how stronger the boid sync with similar velocities.
• Cohesion Force: Strength of the pull toward the group’s center of mass, determining how eagerly boids cluster together.
• Separation Force: Intensity of the push to avoid crowding, preventing boids from overlapping or clumping too tightly.
• Steering Force: Maximum turning force per frame (how sharply a boid can adjust its direction).
• Turning Reaction: Controls how quickly a boid’s orientation interpolates toward its new velocity direction (for visually smooth rotation).
• Boid Speed: Minimum and maximum speed thresholds. These caps ensure boids don’t crawl too slowly or dash unrealistically fast.
• Velocity Drag:  A minor slowdown applied each frame. It’s like a friction or air resistance, that keeps velocities from spiraling out of control.
• Noise Angle: A small random rotation added to each boid’s heading every frame. This introduces subtle wobble and natural variation.

---

Main Features:

• Preset System: Browse a collection of ready-made behaviors and looks, save your own combinations of parameters and textures, and load them back at any time.
• Shape Library & Mixing Mode: Choose from built-in squares, circles, or triangles - or flip on Mix Mode to blend all three shapes together in your flock.
• Texture Mapping: Load your own textures by dropping them right onto the sketch. You can apply them as a backdrop or sample them per boid shape.
• Color Controls: Choose a single solid color or set up a dynamic blend between two colors that shifts over time - driven by each boid’s speed, turning rate, or random noise. Adjust fill and/or stroke separately, with fine-tuning for opacity and line weight.
• Flexible Exports: Capture high-resolution PNGs for stills,  or record MP4 loops and frame sequences (PNG/WebP) to bring your boid swarms to life in motion.
• Interactive Controls: Left-click to attract the flock, right-click to push it away - dive in and steer the swarm yourself.

BOIDS Tool turns a classic demo into a versatile playground for generative art, educational demos, and visual experimentation. Explore how simple rules give rise to stunning flock dynamics.

Performance and compatibility

Here are some technical considerations to keep in mind when using the tool:

• Browser Performance: Simulation speed can vary widely depending on your hardware and browser. If you notice significant slowdowns, try switching to a different browser - Chrome and Firefox tend to offer the best performance.
• Video Export: During export to video, the process may stop due to insufficient memory, especially with high resolution or long videos. If this happens, try reducing the resolution or length of the video. For large or high-resolution videos, consider exporting as a PNG sequence and later converting it to a video using the FFmpeg library.
• MP4 Lag: When exporting to MP4 format, a library-related lag can lead to performance drops, causing the program to slow down noticeably after capturing and exporting the animation. Refreshing the page resolves this issue.
• Mobile Support: The tool isn’t optimized for mobile devices. You’ll need at least an 800×600 display to run it reliably.

Please let me know if you're running into any issues or discover a bug while using the program.

Credits

I would like to acknowledge the use of several third-party libraries and materials within this project and express my sincere gratitude to their creators for making these resources available:

• The p5.js ↗ Creative Coding Library, a product of the collective efforts of an incredible team;
• The Boids Demo ↗, interactive 2D bird flocking simulation developed by Daniel Huang;
• The Tweakpane ↗ interface library, ingeniously developed by Hiroki Kokubun;
• The HME Library ↗ for encoding directly to H264 format, created by Trevor Sundberg;
• The p5.capture ↗ library by tapioca24 for recording animations;