Daily Creative Coding

元「30 min. Processing」。毎日、Creative Codingします。

インタラクション

【GLSL】円形のチェッカーパターン

See the Pen circular checker pattern by aadebdeb (@aadebdeb) on CodePen. #define PI 3.14159265359 precision mediump float; uniform float u_time; uniform vec2 u_mouse; uniform vec2 u_resolution; vec2 transform(vec2 st) { float size = length…

【GLSL】スケールするチェッカーパターン2

See the Pen scaled checker pattern 2 by aadebdeb (@aadebdeb) on CodePen. #define PI 3.14159265359 precision mediump float; uniform float u_time; uniform vec2 u_mouse; uniform vec2 u_resolution; void main(void) { vec2 pos = gl_FragCoord.xy …

【GLSL】回転するチェッカーパターン

See the Pen rotating checker pattern by aadebdeb (@aadebdeb) on CodePen. #define PI 3.14 precision mediump float; uniform float u_time; uniform vec2 u_mouse; uniform vec2 u_resolution; void main(void) { vec2 pos = gl_FragCoord.xy - u_resol…

【GLSL】スケールするチェッカーパターン

See the Pen scaled checker pattern by aadebdeb (@aadebdeb) on CodePen. #define PI 3.14159265359 precision mediump float; uniform float u_time; uniform vec2 u_mouse; uniform vec2 u_resolution; void main(void) { vec2 pos = gl_FragCoord.xy - …

スウィープすると消える円 #2

/** * sweep bubbles #2 * * @author aadebdeb * @date 2017/03/16 */ var easingVariables; var circles; function setup() { createCanvas(windowWidth, windowHeight); frameRate(30); easingVariables = []; circles = []; for (var i = 0; i < 1000; i+…

スウィープすると消える円

/** * sweep bubbles * * @author aadebdeb * @date 2017/03/15 */ var easingVariables; var circles; function setup() { createCanvas(windowWidth, windowHeight); frameRate(30); easingVariables = []; circles = []; for (var i = 0; i < 500; i++) {…

触れると小さくなり消える円

/** * touchable bubbles * * @author aadebdeb * @date 2017/03/14 */ var easingVariables; var circles; function setup() { createCanvas(windowWidth, windowHeight); colorMode(HSB, 360, 100, 100, 100); frameRate(30); easingVariables = []; circl…

触れると膨らむ円

/** * expanding circles * * @author aadebdeb * @date 2017/03/13 */ var eventManager; function setup() { createCanvas(windowWidth, windowHeight); frameRate(30); eventManager = new EventManager(); for (var i = 0; i < 100; i++) { eventManager…

マウスクリックで線が伸びるスケッチ

/** * expanding lines by mouse click * * @author aadebdeb * @date 2017/03/12 */ var eventManager; function setup() { createCanvas(windowWidth, windowHeight); frameRate(30); eventManager = new EventManager(); } function draw() { eventManage…

上から落ちてくる糸

/** * fall from ceiling * * @author aadebdeb * @date 2017/03/11 */ var offset; var shows; var actionFrames = 15; var counter = 0; function setup() { createCanvas(windowWidth, windowHeight); frameRate(60); offset = random(10000); event= fal…

shearXで歪められた市松模様

/** * sheared squares * * @author aadebdeb * @date 2017/02/22 */ var speed; function setup() { createCanvas(windowWidth, windowHeight); frameRate(15); rectMode(CENTER); speed = 0; } function draw() { var pspeed = speed; speed = mouseX - pm…

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 …

並んだ板

/** * 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…

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

/** * 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…

マウスの動きをパーティクルで可視化する

/** * mouse impact * * @author aa_debdeb * @date 2016/12/08 */ float historySize = 5; ArrayList<PVector> mouseVelocities; ArrayList<Particle> particles; void setup(){ size(640, 640); noStroke(); fill(255); mouseVelocities = new ArrayList<PVector>(); particles = new A</pvector></particle></pvector>…

円から四角に変形するオブジェクト

/** * morphing between circle and square * * @author aa_debdeb * @date 2016/12/03 */ float radius = 200; int pointNum = 1000; PVector[] circlePoints; PVector[] rectPoints; float shapeRate = 0.0; float shapeRateSpeed = -0.005; color circleC…

キラキラする円

/** * illuminated circles * * @author aa_debdeb * @date 2016/12/02 */ ArrayList<Circle> circles; void setup(){ size(640, 640); noStroke(); colorMode(HSB, 360, 100, 100); circles = new ArrayList<Circle>(); for(int i = 0; i < 10000; i++){ float radius = ran</circle></circle>…

触れると動くスライム

/** * touchable slime * * @author aa_debdeb * @date 2016/11/29 */ float noiseValue; float time; void setup(){ size(640, 640); noiseValue = 0.5; time = 0.0; background(150); } void draw(){ fill(150, 100); rect(0, 0, width, height); translat…

火花

/** * sparks * * @author aa_debdeb * @date 2016/11/28 */ float MAX_VEL = 5; float MAX_SIZE = 8.0; ArrayList<Particle> particles; void setup(){ size(640, 640); noCursor(); noStroke(); particles = new ArrayList<Particle>(); background(0); } void draw(){ fill(0,</particle></particle>…

マウスでエネルギーを与えることができるパーティクル

/** * energizable particles * * @author aa_debdeb * @date 2016/11/27 */ ArrayList<Particle> particles; color c1 = color(79, 208, 255); color c2 = color(255, 127, 80); void setup(){ size(640, 640); particles = new ArrayList<Particle>(); for(int i = 0; i < 15; </particle></particle>…

溢れるパーティクル

/** * spilled particles * * @author aa_debdeb * @date 2016/11/26 */ float MAX_VEL = 15; float MAX_SIZE = 10.0; float GRAVITY = 1.0; ArrayList<Particle> particles; void setup(){ size(640, 640); particles = new ArrayList<Particle>(); } void draw(){ fill(0, 100)</particle></particle>…

マウスクリックに応じて現れたり消えたりする円

/** * fade in / fade out * * @author aa_debdeb * @date 2016/11/21 */ boolean canShowCircles = true; boolean isAnimating = false; int duration = 100; int animatingTime = 0; ArrayList<Circle> circles; color c1, c2; void setup(){ size(640, 640); circ</circle>…

イージングで飛び出る円

/** * easing test * * @author aa_debdeb * @date 2016/11/20 */ float time = 0; float duration = 200; ArrayList<Circle> circles; color c1, c2; void setup(){ size(640, 640); mousePressed(); } void draw(){ translate(width / 2, height / 2); background(</circle>…

柔らかいタワー

/** * soft towers * * @author aa_debdeb * @date 2016/11/19 */ ArrayList<Tower> towers; float towerWidth = 25; float minHeight = 0; float maxHeight = 400; float maxAcc = 50; void setup(){ size(500, 500, P3D); towers = new ArrayList<Tower>(); for(float w </tower></tower>…

3D空間を飛んで移動する

flying in 3D world - OpenProcessing /** * flying in 3D world * * @author aa_debdeb * @date 2016/11/12 */ Camera cam; ArrayList<Block> blocks; void setup(){ size(640, 640, P3D); noStroke(); blocks = new ArrayList<Block>(); for(int i = 0; i < 150; i++){ b</block></block>…

無限の流れ

endless stream - OpenProcessing /** * endless stream * * @author aa_debdeb * @date 2016/1019 */ float MAX_SPEED = 20; float MIN_SPEED = 5; ArrayList<Rectangle> rectangles; float speed; float distance; float rectWNoise = random(10000); float rectHNois</rectangle>…

万華鏡

/** * kaleidoscope * * @author aa_debdeb * @date 2016/10/04 */ void setup(){ size(640, 640); colorMode(HSB, 360, 100, 100); background(0, 0, 0); noFill(); } void draw(){ translate(width / 2, height / 2); if(mousePressed){ PVector mouse = n…

多層の正方形

/** * multi-layered squares * * @author aa_debdeb * @date 2016/09/24 */ int num = 40; void setup(){ size(500, 500); rectMode(CENTER); strokeWeight(1); } void draw(){ background(240); for(int i = 0; i <= num; i++){ stroke(240); fill(30); fl…

マウスクリックに反応して移動する円

/** * rotating circles * * @author aa_debdeb * @date 2016/09/20 */ float r = 200; int num = 20; ArrayList<Particle> particles; boolean isMoving; int startTime, endTime; void setup(){ size(640, 640); particles = new ArrayList<Particle>(); float angStep = TWO_P</particle></particle>…

サイバーな花火

/** * cyber firework * * @author aa_debdeb * @date 2016/08/24 */ ArrayList<Beam> beams; void setup(){ size(800, 800, P3D); colorMode(HSB, 360, 100, 100); beams = new ArrayList<Beam>(); } void mousePressed(){ explode(); } void keyPressed(){ explode(); </beam></beam>…