83 lines, 12 of them comments ยท 1,158 tokens, written in 13 seconds for $0.0042


 1  // This is a generative particle flow field script.
 2  // It creates particles that move organically across the screen.
 3  
 4  let particles = [];
 5  const numParticles = 2000;
 6  
 7  function setup() {
 8    createCanvas(windowWidth, windowHeight);
 9    colorMode(HSB, 360, 100, 100, 100);
10    background(0);
11  
12    // Initialize particles
13    for (let i = 0; i < numParticles; i++) {
14      particles.push(new Particle());
15    }
16  }
17  
18  function draw() {
19    // Draw a semi-transparent background to create trails
20    background(0, 0, 0, 10);
21  
22    for (let particle of particles) {
23      particle.update();
24      particle.show();
25      particle.edges();
26    }
27  }
28  
29  function windowResized() {
30    resizeCanvas(windowWidth, windowHeight);
31    background(0);
32  }
33  
34  // Particle Class
35  class Particle {
36    constructor() {
37      this.pos = createVector(random(width), random(height));
38      this.vel = createVector(0, 0);
39      this.acc = createVector(0, 0);
40      this.maxSpeed = 4;
41      // Assign a random hue for color variety
42      this.hue = random(360);
43    }
44  
45    update() {
46      // Calculate Perlin noise based on position
47      // We divide by 100 to make the noise field larger/smoother
48      let n = noise(this.pos.x * 0.005, this.pos.y * 0.005);
49      
50      // Map noise value (0-1) to an angle (0 to TWO_PI * 4)
51      let angle = n * TWO_PI * 4;
52      
53      // Create a force vector from the angle
54      let force = p5.Vector.fromAngle(angle);
55      force.setMag(0.5);
56      
57      this.applyForce(force);
58      
59      this.vel.add(this.acc);
60      this.vel.limit(this.maxSpeed);
61      this.pos.add(this.vel);
62      this.acc.mult(0); // Reset acceleration
63    }
64  
65    applyForce(force) {
66      this.acc.add(force);
67    }
68  
69    show() {
70      stroke(this.hue, 80, 100, 50);
71      strokeWeight(2);
72      point(this.pos.x, this.pos.y);
73    }
74  
75    // Wrap around edges
76    edges() {
77      if (this.pos.x > width) this.pos.x = 0;
78      if (this.pos.x < 0) this.pos.x = width;
79      if (this.pos.y > height) this.pos.y = 0;
80      if (this.pos.y < 0) this.pos.y = height;
81    }
82  }
83