Pixelbits

Hi, I'm @jasonlong. I'm trying to make a small creative coding sketch every day(ish) to learn new things. All code is available in the GitHub repo.

Another hue flower. You can get some interesting effects just adding more layers and playing with blend modes.

<script type="text/paperscript" canvas="canvas-0019">
view.element.style.backgroundColor = '#111';

var color = new Color('#0074d9');
var rectangle = new Rectangle(new Point(0, 0), new Size(100, 200));
var shape = new Path.Ellipse(rectangle);
shape.fillColor = color;

var numLayers = 3;
var blendModes = ['screen', 'screen', 'multiply'];

// make it pointy
shape.segments[1].handleIn.x = 0;
shape.segments[1].handleOut.x = 0;
shape.segments[3].handleIn.x = 0;
shape.segments[3].handleOut.x = 0;

var opacity = 0.3;
for (i = 0; i < numLayers; i++) {
    for (j = 0; j < 360; j += 15) {
        var newShape = shape.clone();
        newShape.scale(1 - (i * 0.33));
        newShape.fillColor.hue += j;
        newShape.opacity = opacity;
        newShape.blendMode = blendModes[i];
        newShape.rotate(j, [50, 220]);
    }
    opacity += 0.2;
}

shape.remove();

project.activeLayer.position = view.center;


</script>

<canvas id="canvas-0019" height="250"></canvas>