読者です 読者をやめる 読者になる 読者になる

30 min. Processing

毎日30分、Processingで何かを作る

重なる円と四角

/** * overlayed circles and triangles * * @author aadebdeb * @date 2017/02/20 */ var bgColor; var circleColor; var triangleColor; function setup() { createCanvas(windowWidth, windowHeight); colorMode(HSB, 360, 100, 100); frameRate(30); noS…

重なるCMYの円

/** * interlapping CMY circles * * @author aadebdeb * @date 2017/02/19 */ var colors; var isDarkest = true; function setup() { createCanvas(windowWidth, windowHeight); frameRate(30); noStroke(); colors = [ color(255, 255, 0), color(255, 0,…

瞬く三角形の光

/** * fragile triangles * * @author aadebdeb * @date 2017/02/18 */ var particles; var fillColors; var nOffsetX, nOffsetY, nOffsetSize; var nScale = 0.001; function setup() { createCanvas(windowWidth, windowHeight); nOffsetX = createVector(…

三角形の鳥群

/** * triangle birds * * @author aadebdeb * @date 2017/02/17 */ var particles; var fillColors; function setup() { createCanvas(windowWidth, windowHeight); fillColors = [ color(113, 199, 209), color(212, 211, 202), color(230, 26, 105) ]; fr…

三角形でマスキングテープ風スケッチ

/** * triangle tapes * * @author aadebdeb * @date 2017/02/16 */ var particles; var bgColor; var fillColors; function setup() { createCanvas(windowWidth, windowHeight); frameRate(10); bgColor = color(254, 247, 242); fillColors = [ color(240…

広がる縞々の円

/** * expanding circular stripes * * @author aadebdeb * @date 2017/02/15 */ var circles = []; var isWhite = true; function setup() { createCanvas(windowWidth, windowHeight); frameRate(10); noStroke(); } function draw() { background(255); v…

blendMode(DIFFERENCE)で干渉する縞

/** * interference disc * * @author aadebdeb * @date 2017/02/14 */ function setup() { createCanvas(windowWidth, windowHeight); mousePressed(); } function mousePressed() { blendMode(BLEND); background(random(255), random(255), random(255));…

テクノ・ライト

/** * techno lights * * @author aadebdeb * @date 2017/02/13 */ function setup() { createCanvas(windowWidth, windowHeight); colorMode(HSB, 360, 100, 100) frameRate(30); noFill(); } function draw() { background(0, 100, 0); strokeWeight(1); v…

ひだひだのリング

/** * frilly ring * * @author aadebdeb * @date 2017/02/12 */ var isWire = false; var nScale = 0.003; var nOffset1; var nOffset2; function mousePressed() { isWire = !isWire; } function setup() { createCanvas(windowWidth, windowHeight); fram…

波打つ花

/** * wavy flower * * @author aadebdeb * @date 2017/02/11 */ function setup() { createCanvas(windowWidth, windowHeight); frameRate(30); } function draw() { background(25, 37, 72); stroke(160, 138, 35); fill(160, 138, 35); translate(width /…

低解像度ディスプレイ上のオブジェクト

/** * rect flows in display * * @author aadebdeb * @date 2017/02/10 */ var particles; function setup() { createCanvas(windowWidth, windowHeight); frameRate(8); background(0); noStroke(); particles = []; for (var i = 0; i < 30; i++) { parti…

動く点でドロネー三角形分割

/* * moving triangles * * @author aadebdeb * @date 2017/02/09 */ var MARGIN = 200; var vertices; var hueVal; function setup() { createCanvas(windowWidth, windowHeight); frameRate(20); colorMode(HSB, 360, 100, 100); hueVal = random(50); ver…

p5.jsでドロネー三角形分割

/* * delaunay triangulation * * @author aadebdeb * @date 2017/02/08 */ var delaunayTriangulation; var hue; function setup() { createCanvas(windowWidth, windowHeight); colorMode(HSB, 360, 100, 100); hue = random(360); delaunayTriangulation …

ベジエ曲線で雫の形をつくる

/* * bezier drops * * @author aadebdeb * @date 2017/02/07 */ var rgb; var type = 0; function setup() { createCanvas(windowWidth, windowHeight); frameRate(30); noStroke(); rgb = [ color(255, 0, 0), color(0, 255, 0), color(0, 0, 255) ]; } fu…

createGraphics()でグリッチっぽくする

/* * chaotic replications * * @author aadebdeb * @date 2017/02/06 */ var canvas; function setup() { canvas = createCanvas(windowWidth, windowHeight); frameRate(30); colorMode(HSB, 360, 100, 100); noStroke(); background(0, 0, 100); } functi…

p5.jsのbeginContour(), endContour()を使う

/* * contours objects * * @author aadebdeb * @date 2017/02/05 */ var objs = []; var type = 0; var bgColor, fillColor; function setup() { createCanvas(windowWidth, windowHeight); for(var i = 0; i < 100; i++) { objs.push(new Obj(i)); } bgCol…

ねじれたライン

/* * twisted lines * * @author aadebdeb * @date 2017/02/04 */ var colors; var type; function setup() { createCanvas(windowWidth, windowHeight); colors = [ color(255, 0, 0), color(0, 255, 0), color(0, 0, 255) ]; type = 0; } function draw() …

p5.jsの3D基本図形

/* * 3D primitives * * @author aadebdeb * @date 2017/02/03 */ var X_SPACE = 200; var Y_SPACE = 250; var X_NUM = 4; var Y_NUM = 2; function setup() { createCanvas(800, 600, WEBGL); } function draw() { background(255); push(); translateTo(0,…

p5.jsでリズムマシン

/* * rhythm machine * * @author aadebdeb * @date 2017/02/02 */ var pattern = [ true, false, false, false, true, false, false, false, true, false, false, false, true, false, false, false ]; var noiseOsc, env; var part, pharse; var beat = 0;…

ランダムに揺れる画面とサウンド

/* * noisy screen & sound * * @author aadebdeb * @date 2017/02/01 */ var rects; var rgb; var osc, lpf; function setup() { createCanvas(windowWidth, windowHeight); rectMode(CENTER); rects = []; for (var i = 0; i < 50; i++) { rects.push(new …

p5.jsでランダムに音を鳴らす

/* * random percussion sound * * @author aadebdeb * @date 2017/01/31 */ var osc, env; function setup() { createCanvas(windowWidth, windowHeight); noCursor(); env = new p5.Env(); env.setADSR(0.01, 0, 1, 0.2); env.setExp(true); osc = new p5.…

パーリンノイズの層

/* * layers of perlin noise * * @author aadebdeb * @date 2017/01/30 */ var colors; function setup() { createCanvas(windowWidth, windowHeight); mousePressed(); } function mousePressed() { var cscale = [random(0.1), random(0.1), random(0.1)]…

サイバー・ランドスケープ

/* * cyber landscape * * @author aadebdeb * @date 2017/01/29 */ var startW; function setup(){ createCanvas(windowWidth, windowHeight); frameRate(10); background(0); startW = -100; } function draw(){ stroke(lerpColor(color(111, 186, 44, 100…

光の流れ

/* * light flow * * @author aadebdeb * @date 2017/01/28 */ var movers; var colors; var noiseScales, noiseOffsets; function setup() { colors = [color(4, 1, 1), color(1, 2, 3), color(2, 3, 1)]; createCanvas(windowWidth, windowHeight); blendM…

誘引する流れ

/* * attracting flow * * @author aadebdeb * @date 2017/01/27 */ var movers; function setup() { createCanvas(windowWidth, windowHeight); movers = []; for (var i = 0; i < 2000; i++) { movers.push(new Mover()); } background(255); stroke(0, 3)…

並んだ板

/** * boards in line * * @author aadebdeb * @date 2017/01/26 */ void setup(){ size(640, 480); rectMode(CENTER); fill(20); stroke(255, 251, 249); strokeWeight(4); } void draw(){ background(255, 251, 249); translate(width / 2, height / 2); i…

明滅する四角形

/** * flashing rect * * @author aa_debdeb * @date 2017/01/25 */ void setup(){ size(500, 500); rectMode(CENTER); frameRate(30); noStroke(); } void draw(){ fill( constrain(128 + randomGaussian() * 60, 0, 255), constrain(128 + randomGaussian(…

色を変えながらマスを塗りつぶしていく

/** * line drawer * * @author aa_debdeb * @date 2017/01/24 */ int CELL_SIZE = 2; int CELL_NUM = 250; int[][] DIRECTIONS = {{0, -1}, {1, 0}, {0, 1}, {-1, 0}}; float MAX_STRAIT = 50; color BG_COLOR = color(255, 255, 255); color[] FILL_COLORS…

四角形のシーケンス

/** * sequence of rects * * @author aa_debdeb * @date 2017/01/23 */ color[] colors = { color(216, 36, 72), color(221, 163, 0), color(0), color(44, 182, 170), color(221, 163, 0), color(255) }; void setup(){ size(500, 500); frameRate(5); rec…

おもちゃのキラキラ

/** * toy twinckle * * @author aa_debdeb * @date 2017/01/22 */ int rectNum = 43; float rectSize = 10; color[] colors = { color(229, 10, 132), color(84, 195, 241), color(240, 235, 69), color(156, 202, 84), color(237, 109, 31), color(229, 10…

展開・縮小する弧

/** * expanding and closing arcs * * @author aa_debdeb * @date 2017/01/21 */ color[] colors = { color(0, 136, 164), color(175, 220, 222) }; void setup(){ size(500, 500); frameRate(6); noStroke(); } void draw(){ background(234, 239, 249); t…

脈動するTruchetタイル

/** * pulsatile truchet tile * * @author aa_debdeb * @date 2017/01/20 */ int tileSize = 25; int tileNum = 20; int[][] types; color bgColor = color(255, 255, 255); color skColor1 = color(69, 189, 207); color skColor2 = color(247, 248, 218);…

Truchetタイル

/** * truchet tiles * * @author aa_debdeb * @date 2017/01/19 */ void setup(){ size(500, 500); mousePressed(); } void mousePressed(){ int tileSize = 25; float borderSize = random(0, tileSize / 2); color bgColor = color(random(255), random(2…

線の下を動くもの

/** * movers under lines * * @author aa_debdeb * @date 2017/01/18 */ ArrayList<Mover> movers; void setup(){ size(640, 480); noFill(); movers = new ArrayList<Mover>(); } void draw(){ background(26, 11, 8); boolean isPink = true; for(float h = -50; h <= h</mover></mover>…

パルスで律動する円

/** * pulse circle * * @author aa_debdeb * @date 2017/01/17 */ void setup(){ size(640, 640); noFill(); strokeWeight(2); } void draw(){ background(238, 243, 239); translate(width / 2, height / 2); float radius = 200; float step = 5; for(flo…

斜め線のフロー

/** * line floaw * * @author aa_debdeb * @date 2017/01/16 */ float STEP = 20; void setup(){ size(640, 640); noFill(); } void draw(){ background(39, 26, 32); for(float d = 0; d <= width * 2; d += STEP){ float diff = map(sin((d) * 0.03 - fra…

球の上を動く円

/** * circles moving on sphere * * @author aa_debdeb * @date 2017/01/15 */ ArrayList<Circle> circles; void setup(){ size(640, 640); circles = new ArrayList<Circle>(); for(int i = 0; i < 30; i++){ circles.add(new Circle()); } } void draw(){ background(255)</circle></circle>…

CMYK網点

/** * CMYK halftone * * @author aa_debdeb * @date 2017/01/14 */ float[] sizeScale; void setup(){ size(640, 640); mousePressed(); } void mousePressed(){ sizeScale = new float[4]; for(int i = 0; i < 4; i++){ sizeScale[i] = random(1); } } voi…

円の影

/** * shadow of circle * * @author aa_debdeb * @date 2017/01/13 */ void setup(){ size(640, 640); noStroke(); background(255, 255, 250); } void draw(){ translate(width / 2, height / 2); rotate(PI / 4); for(int i = 0; i < 2; i++){ float angl…

グレイスケールのドット

/** * grayscale dots * * @author aa_debdeb * @date 2017/01/12 */ void setup(){ size(640, 640); noStroke(); mousePressed(); } void mousePressed(){ background(200); for(int i = 0; i < 2000; i++){ float x = random(-50, width + 50); float y = …

CMYのドット

/** * CMY dots * * @author aa_debdeb * @date 2017/01/11 */ void setup(){ size(640, 640); mousePressed(); } void mousePressed(){ ArrayList<Obj> objs = new ArrayList<Obj>(); color[] colors = {color(255, 0, 255), color(0, 255, 255), color(255, 255, 0)}</obj></obj>…

波状の円

/** * wavy circles * * @author aa_debdeb * @date 2017/01/10 */ void setup(){ size(640, 640); background(0, 0, 10); } void draw(){ fill(0, 0, 10, 100); noStroke(); rect(0, 0, width, height); translate(width / 2, height / 2); noFill(); for(i…

急にノイズが入るサイン波

/** * sine / noise * * @author aa_debdeb * @date 2017/01/09 */ void setup(){ size(640, 480); stroke(255, 255, 30); strokeWeight(2); noFill(); } void draw(){ background(0, 0, 20); float noiseRate = pow(abs(sin(frameCount * 0.01)), 150); beg…

残像のつくオシロスコープ

/** * ghost sine wave * * @author aa_debdeb * @date 2017/01/08 */ void setup(){ size(640, 480); background(0); } void draw(){ noStroke(); fill(0, 40); rect(0, 0,width, height); stroke(0, 255, 0); strokeWeight(3); noFill(); beginShape(); fo…

吸い込み口

/** * intake port * * @author aa_debdeb * @date 2017/01/07 */ int LOOP = 20; int ANGLE_NUM = 17; void setup(){ size(1000, 1000); } void draw(){ fill(0, 100); noStroke(); rect(0, 0, width, height); translate(width / 2, height / 2); rotate(-…

半透明なブロック

3D

/** * translucent blocks * * @author aa_debdeb * @date 2017/01/06 */ float W = 800; float H = 800; float BOX_WIDTH = 20; void setup(){ size(500, 500, P3D); fill(255, 50); stroke(255, 150); strokeWeight(2); } void draw(){ background(0); tra…

パーティクル同士の衝突と反射(3D)

/** * collision with many particles in 3D * * @author aa_debdeb * @date 2017/01/05 */ float MIN_RADIUS = 10; float MAX_RADIUS = 50; float e = 1.0; float k = 2.0; float rotX = 0; float rotY = 0; ArrayList<Particle> particles; void setup(){ size(500, </particle>…

パーティクル同士の衝突と反射

/** * collision with many particles and walls * * @author aa_debdeb * @date 2017/01/04 */ float e = 0.5; float k = 0.3; ArrayList<Particle> particles; void setup(){ size(500, 500); noStroke(); frameRate(30); particles = new ArrayList<Particle>(); while(partic</particle></particle>…

ゴムの紐

/** * elastic string * * @author aa_debdeb * @date 2017/01/03 */ int FPS = 30; int NODE_NUM = 100; float GRAVITY = 1.0; float K_SPRING = 10.0; float K_DAMPING = 10.0; PVector[] locs; PVector[] vels; float l; void setup(){ size(640, 640); f…

リング変調と振幅変調

/** * Ring Modulation vs. Amplitude Modulation * * @author aa_debdeb * @date 2017/01/02 */ import ddf.minim.spi.*; import ddf.minim.signals.*; import ddf.minim.*; import ddf.minim.analysis.*; import ddf.minim.ugens.*; import ddf.minim.effe…