• fullscreen
  • iridescence.pde
  • //Raven Kwok (aka Guo Ruiwen)
    //ravenkwok.com
    
    Paddle paddle;
    Particle [] ps = new Particle[50];
    
    void setup() {
      size(400, 600, P2D);
      frameRate(30);
      smooth();
      colorMode(HSB);
      rectMode(CENTER);
      
      for (int i=0;i<ps.length;i++) {
        ps[i] = new Particle();
      }
      
      paddle = new Paddle(100,20);
    }
    void draw() {
      background(255);
      
      for (int i=0;i<ps.length;i++) {
        ps[i].update(paddle);
        
        for (int j=i+1;j<ps.length;j++) {
          for (int k=j+1;k<ps.length;k++) {
            ps[i].displayTriangle(ps[j], ps[k]);
          }
          ps[i].displayConnection(ps[j]);
        }
        ps[i].displayParticle();
      }
      
      paddle.update();
      paddle.display();
    }
    class Paddle{
      
      PVector loc;
      float w, h;
      
      Paddle(float w,float h) {
        this.w = w;
        this.h = h;
        loc = new PVector(width/2,height/2);
      }
      
      void update() {
        loc.x = lerp(loc.x, mouseX, 0.3);
        loc.y = lerp(loc.y, mouseY, 0.3);
      }
      
      void display() {
        fill(200);
        noStroke();
        rect(loc.x, loc.y, w, h);
      }
    }
    
    class Particle {
      
      PVector loc, vel, acc;
      float thres, areaThres;
      float saturation;
      color c;
      
      Particle() {
        
        loc = new PVector(random(width), random(height));
        vel = new PVector(random(0.5, 3), random(0.5, 2));
        acc = new PVector(random(-0.1, 0.1), random(0.1, 0.4));
        thres = 75;
        areaThres = 2000;
        c = color(random(360), 255, 255);
      }
      
      void update(Paddle pd) {
        vel.add(acc);
        vel.limit(5);
        loc.add(vel);
        collide(pd);
      }
      
      private void collide(Paddle pd){
        if (loc.x<0 || loc.x>width) vel.x = -vel.x;
        if (loc.y>height) reset();
        if (loc.y>=mouseY-pd.h/2 && loc.y<=mouseY+pd.h/2 && loc.x>=mouseX-pd.w/2 && loc.x<=mouseX+pd.w/2) {
          loc.y = mouseY-pd.h/2;
          vel.y *= -0.95;
          saturation = 255;
        }
      }
      
      void displayParticle() {
        strokeWeight(3);
        stroke(c, 200);
        point(loc.x, loc.y);
      }
      
      void displayConnection(Particle p) {
        float dst = dist(loc.x, loc.y, p.loc.x, p.loc.y);
        if (dst < thres) {
          float avgHue = (hue(c)+hue(p.c))*0.5;
          float alpha = (thres-dst)/thres*255;
          strokeWeight((thres-dst)*0.1);
          stroke(avgHue, saturation, 255, alpha);
          line(loc.x, loc.y, p.loc.x, p.loc.y);
        }
      }
      
      void displayTriangle(Particle p1, Particle p2) {
        float dst1 = dist(loc.x, loc.y, p1.loc.x, p1.loc.y);
        float dst2 = dist(loc.x, loc.y, p2.loc.x, p2.loc.y);
        float dst3 = dist(p1.loc.x, p1.loc.y, p2.loc.x, p2.loc.y);
        float sp = (dst1+dst2+dst3)*0.5; //Semi-perimeter
        float area = sqrt(sp*(sp-dst1)*(sp-dst2)*(sp-dst3)); //Heron's formula via wikipedia: http://en.wikipedia.org/wiki/Heron%27s_formula
        if (area < areaThres && dst1<thres && dst2<thres && dst3<thres) {
          noStroke();
          float avgHue = (hue(c)+hue(p1.c)+hue(p2.c))*0.33;
          fill(avgHue, saturation, 255, (1-area/areaThres)*255);
          triangle(loc.x, loc.y, p1.loc.x, p1.loc.y, p2.loc.x, p2.loc.y);
        }
      }
      
      private void reset() {
        loc.set(random(width), 0);
        saturation = 0;
      }
    }
    
    

    code

    tweaks (8)

    about this sketch

    This sketch is running in HTML5 using Processingjs.

    license

    advertisement

    Report Sketch

    Report for inappropriate content

    Please provide details if possible:

    Your have successfully reported the sketch. Thank you very much for helping to keep OpenProcessing clean and tidy :)

    Make a Copyright Infringement claim

    Raven Kwok plus+

    iridescence

    Add to Faves Me Likey@! 91
    You must login/register to add this sketch to your favorites.

    Use the paddle to catch falling particles and create a scene of iridescence.

    Code refactoring on Jan 19th, 2014.

    Kles4enko Andrey
    16 Mar 2012
    Hohow!!!
    hello

    cant download properly or in other words the three sketches are not interconnected there is something missing

    help
    please i like the irigescence very much

    thanks
    Raven Kwok plus+
    23 Mar 2012
    You may directly copy the code and then paste in your Processing IDE, the sketch doesn't use a 3rd party library :)
    redkhat plus+
    18 Oct 2012
    magic confetti. excellent!
    Emmanuel Coup
    30 Sep 2014
    beautiful work
    beautiful work
    Kathy Lam
    12 Feb 2015
    Is there a way to manipulate this code to just have a pattern of changing iridescent triangles instead of it being interactive with a paddle ?
    Raven Kwok plus+
    13 Feb 2015
    @Kathy Lam

    You can do that simply by disabling the collision test.
    You need to login/register to comment.