Digital art of flying fairies or...?

What you'll see in this digital art?

It's a digital art of the animation of flying living things. You can see it as fairies, and also leaf beetles or something.
This animation is the creation of creative coding software with the 'Processing'.

At first, I wanted to make a 'Fire pencil' like this.

炎筆カッコよすぎる🔥🔥🔥 pic.twitter.com/4C5SP2Kzm8

— バズツイートハンター (@buzztwi_hunter) November 7, 2018

And I couldn't do that as always. XP
But I found some interesting shapes and moving like flying leaf beetles. So I made this animation.
Special thanks to @rokusho_7777 for nice ideas.

This code does not display any images on the screen but generates image files for animation. You can make an animation with these files.

 

The 'Processing' code example.

Please feel free to use this example code of Processing under the terms of the GPL. To see other works based on my code is my pleasure. And my honor.

// Secret Garden.
// @author @deconbatch
// @version 0.1
// Processing 3.2.1
// 2018.11.18

void setup() {

  size(720, 720);
  colorMode(HSB, 360, 100, 100, 100);
  smooth();
  noLoop();

}

void draw() {

  translate(width / 2, height / 2);
  rotate(random(TWO_PI));

  int   frameCntMax = 15 * 6;
  int   leafCntMax  = 15;
  float baseHue     = random(360.0);
  float paramTrace  = random(3.0, 6.0);
         
  for (int frameCnt = 0; frameCnt < frameCntMax; ++frameCnt) {

    float frameRatio = map(frameCnt, 0, frameCntMax, 0.0, 1.0);
    background(0.0, 0.0, 0.0, 100);

    blendMode(BLEND);
    backdrop(baseHue);

    blendMode(SCREEN);
    strokeWeight(0.1);
    for (int leafCnt = 0; leafCnt < leafCntMax; ++leafCnt) {

      float leafRatio = map(leafCnt, 0, leafCntMax, 0.0, 1.0);
      float easing    = easeInOutCubic(((frameRatio + leafRatio) % 1.0) * 0.8 + 0.1);
      float radian    = TWO_PI * (easing + leafRatio * paramTrace);
      float radius    = width * (0.1 + leafRatio * 0.4);

      Float x = radius * cos(radian + sin(radian)) * sin(radian);
      float y = radius * sin(radian + cos(radian)) * cos(radian);

      drawLeaf(leafRatio, frameRatio, x, y, baseHue);

    }

    saveFrame("frames/" + String.format("%04d", frameCnt) + ".png");

  }

  exit();

}

/**
 * drawLeaf draw a leaf
 * @param  leafRatio  0.0 - 1.0   : leaf count ratio.
 * @param  frameRatio 0.0 - 1.0   : frame count ratio.
 * @param  baseX      0.0 - width : draw point x.
 * @param  baseY      0.0 - width : draw point y.
 * @param  baseHue    0.0 - 360.0 : leaf color.
 */
private void drawLeaf(float leafRatio, float frameRatio, float baseX, float baseY, float baseHue) {

  int   wingCntMax   = 2000;
  int   vertexCntMax = 20;
  float flapSpeed    = 30.0;
  float wingSize     = 6.0;
  
  for (int wingCnt = 0; wingCnt < wingCntMax; ++wingCnt) {

    float wingRatio     = map(wingCnt, 0, wingCntMax, 0.0, 1.0);
    float flapAnimation = (leafRatio * wingCntMax + frameRatio * flapSpeed);
    float fillHue       = (leafRatio + sin(PI * frameRatio)) * 30.0 + wingRatio * 30.0;
    
    float applyX = baseX;
    float applyY = baseY;

    beginShape();
    vertex(baseX, baseY);

    for (int vertexCnt = 0; vertexCnt < vertexCntMax; ++vertexCnt) {

      int   wingShape = wingCnt + vertexCnt;
      float divX      = map(noise(flapAnimation + wingShape * 0.06), 0.0, 1.0, -wingSize, wingSize);
      float divY      = map(noise(flapAnimation + wingShape * 0.05), 0.0, 1.0, -wingSize, wingSize);
      float fillSat   = map(wingRatio, 0.0, 1.0, 0.0, 60.0);
      float fillBri   = (wingSize * wingSize * 2.0) / (divX * divX + divY * divY);
      float strokeBri = map(wingRatio, 0.0, 1.0, 0.0, 2.0);
      float changeSiz = map(noise(sin(frameRatio * TWO_PI) + leafRatio * 10.0), 0.0, 1.0, 0.5, 1.0);

      applyX += divX * changeSiz;
      applyY += divY * changeSiz;
    
      stroke(
             (baseHue + 60.0) % 360.0,
             60.0,
             strokeBri,
             100.0
             );
      fill(
           (baseHue + fillHue) % 360.0, 
           fillSat,
           fillBri * 0.007,  // key of this code!
           100.0
           );
      vertex(applyX, applyY);

    }

    vertex(baseX, baseY);
    endShape();

  }
}

/**
 * easeInOutCubic easing function.
 * @param  t     0.0 - 1.0 : linear value.
 * @return float 0.0 - 1.0 : eased value.
 */
private float easeInOutCubic(float t) {
  t *= 2.0;
  if (t < 1.0) {
    return pow(t, 3) / 2.0;
  }
  t -= 2.0;
  return (pow(t, 3) + 2.0) / 2.0;
}

/**
 * backdrop draw backdrop.
 * @param  baseHue 0.0 - 360.0 : backdrop color.
 */
private void backdrop(float baseHue) {

  noFill();
  strokeWeight(10.0);
  float pW = width * 1.5;
  for (float radius = 10.0; radius < pW; radius += 5.0) {
    stroke(
         baseHue,
         90,
         map(radius, 10.0, pW, 0.0, 20.0),
         100
         );
    ellipse(0.0, 0.0, radius, radius);
  }
  
}

/*
Copyright (C) 2018- deconbatch

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>
*/