Daily Creative Coding
See the Pen shadow by multiple lights by aadebdeb (@aadebdeb) on CodePen. #define PI 3.14159265359 #define TWO_PI PI * 2.0 #define HALF_PI PI / 2.0 precision mediump float; uniform float u_time; uniform vec2 u_mouse; uniform vec2 u_resolution; struct Camera { vec3 position; vec3 ray; }; struct Light { vec3 position; vec3 ambientWeight; vec3 diffuseWeight; vec3 specularWeight; }; float random(float
p5.jsでランダムに音を鳴らす - Daily Creative Coding
/* * 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.Oscillator(); osc.setType('sine'); osc.amp(env); osc.freq(250); osc.start(); background(0); } function draw() { noStroke(); fill(0, 100) rect(0, 0, width, height
ランダムに揺れる画面とサウンド - Daily Creative Coding
/* * 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 Rect()); } rgb = [color(160, 160, 0), color(160, 0, 160), color(0, 160, 160)]; osc = new p5.Oscillator('sawtooth'); osc.freq(600); osc.amp(0.5); osc.disconnect()
ねじれたライン - Daily Creative Coding
/* * 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() { blendMode(BLEND); if(type == 0) { background(255); blendMode(EXCLUSION); } else { background(0); blendMode(SCREEN); } noFill(); strokeWeight(20); for(var i = 0
波の干渉3D - Daily Creative Coding
/** * wave interference in 3D * * @author aa_debdeb * @date 2016/07/21 */ float step = 20; float maxAmp = 50; float maxDistance = 300; color c1 = color(22, 199, 175); color c2 = color(199, 21, 133); ArrayList<Oscillator> oscillators; void setup(){ size(500, 500, P3D); sphereDetail(4); noStroke(); oscillators = new ArrayList<Oscillator>(); oscillators.add(new Oscillator(new PVector(width / 2.0, hei
カメラから取得した映像を二値化してパーリンノイズ柄にする - Daily Creative Coding
/** * binary image for camera by perlin noise * * @author aa_debdeb * @date 2016/07/19 */ import processing.video.*; Capture camera; PVector offset; float scale = 0.01; float tScale = 0.1; color c1 = color(255, 20, 147); color c2 = color(255, 140, 0); float threshold = 127; void setup(){ size(640, 480); noStroke(); offset = new PVector(random(10000), random(10000)); camera = new Capture(this, 320,
Processing カテゴリーの記事一覧 - Processing中毒者の嘔吐物
Processing Advent Calendar 2015 : ATNDの参加記事です。昨日に続き今日も僕が担当します。昨日はちょっと重たい内容だったので今回は軽めにサクッと、ちょっと前に書いたスケッチ晒します。 これ↓を真似て作りました。 codedoodl.es ソースはこちら。 Lett…
Processingユーザーなら壁紙自作しようぜ？ #4 - Processing中毒者の嘔吐物
Processing Advent Calendar 2015 : ATNDの参加記事です。 この記事ではクラスの作り方やnoise()の使い方、球体の座標の計算方法などは解説していません。 クラスの使い方とnoise()の使い方はP5 Code Schoolで、球体の座標の計算方法はこのブログの記事で先に読んでおいてください。 P5 Code School：Chapter15「クラス基礎 Part1」 P5 Code School：Chapter12「乱数」 Processingで三角関数を使って球体を作る - Processing中毒者の嘔吐物 Processingで壁紙自作記事第4弾になります。 今回作るのはコチラ↓ 最初の2つの画像と後の2つの画像は違うスケッチで作られています。 まずは最初のスケッチの解説から。 ソースはコチラ↓ int numLines = 8; // Line
Processingでデッサン風の画像を作成する - kitao's blog
ゴールデンウィークも残りあと数日。仕事に復帰できる気が全然しません。 子供が美術の宿題で自分の手のデッサンをしていて、陰影のつけ方が微妙に間違っていたので指摘したのですが、自分でも違っているのはわかるが、どこがどう違うかよくわからないとの返事が返ってきました。 よろしい、ならば実装(Processing)だ。ということで、Processingでお手本のデッサン画像を自動作成するスケッチを作ってみることにします。 デッサン風画像の作成方法 デッサン風画像の作成は、以下の3つのステップで行います。 参考画像を取得 画像のピクセル情報を参照 各ピクセルを鉛筆風に描画 各ステップの詳細を順に説明します。 参考画像を取得 デッサンの基になる画像はWebカメラでキャプチャしたものを使うことにします。Processing 2.xでは以下のコードでカメラのキャプチャを開始できます。 import proc
home | p5.js
Search p5js.org Hello! p5.js is a JavaScript library for creative coding, with a focus on making coding accessible and inclusive for artists, designers, educators, beginners, and anyone else! p5.js is free and open-source because we believe software, and the tools to learn it, should be accessible to everyone. Using the metaphor of a sketch, p5.js has a full set of drawing functionality. However,
Processing歴１年になったのでこの１年間を振り返ってみた - Processing中毒者の嘔吐物
２年前 P5歴は１年だけれども、P5に出会ったのは２年前のこと。大学一回生の春学期のコンピュータ演習という授業で担当の教授に教えてもらった。コンピュータ演習の授業は３クラスほどに分かれていて、担当の教授によって授業の内容が結構バラバラだったりする。Processingを教えていたのは僕の担当の教授だけだったようで、今思えば運が良かった。授業で何をやったかというと、基礎の部分をザッと説明されただけで、「２週間後までに何か動くスケッチを作ってこい。発表してもらう」だった。僕はプログラミングに興味があったので情報科学科に入ったけど、入った時点ではC言語の超基礎的内容くらいしか勉強したことは無かった。んで、２週間では大したものが作れなくて、教授からも「うん、標準的」と言われる始末。他の生徒の中にはゲームやらを作ってる人もいて「すげぇぇ」とか思ってた。 １年前 コンピュータ演習でProcessing
【Processing学習】 キャンバスを要素で埋め尽くす - Qiita
processingが楽しいので、コツコツ継続して勉強していきたい。 今回はCanvasを要素で埋め尽くすような表現を学習する。 例えば、こういうやつ The Internet Map 今回は基礎なので、大きさと位置がランダムなサークルを生成する。 ポイントは「要素同士は重なり合わない」こと。 まず全体のコードはイカ ArrayList<Circle> circles = new ArrayList<Circle>(); // 生成するサークルの直径 int minDiam = 2; int maxDiam = 200; Circle c = new Circle(new PVector(0, 0), 20); void setup() { size(640, 640); circles.add(c); background(255); } void draw() { c.draw();
Generative Design Processingで切り拓く、デザインの新たな地平
プログラミングによる視覚表現の “最上級の教本” あの伝説の書、待望の日本語版が遂に刊行。 本書は、デザイン／アートのためのプログラミング環境「Processing」と、本書オリジナルのGenerative Designライブラリを利用することで、プログラミング習得の壁を超えて生成的／創発的なビジュアルを作り出す方法をまとめた一冊です。世界中で圧倒的な支持を得た、とびきり美しい作例、デザインの原則に基づいた構成、そしてコードのポイント解説により、ビジュアル生成のためのインスピレーションあるいはリソースとして役立つだけでなく、プログラマーではない人たちにも新しい「デザイン体験」を与えます。日本語版では新たに8つのジェネラティブデザインの事例を掲載しています。 中面紹介 Generative Design 日本語版 from BNN on Vimeo. →サポートサイト ISBN：978-4-
Processing 3でGIFアニメを作って保存する方法 - Qiita
最近個人的にProcessingにハマってます。面白いですよね、ジェネラティブ・アート。 作ったスケッチはやっぱりGIFアニメで保存して、サイトなどに載せたいですよね。スケッチをGIFアニメにできる「gifAnimation」というライブラリがあります。Processing 2以下までにしか対応してないと思ってたら、サラッとProcessing 3以上対応ver.がありました。 ダウンロードとインストール extrapixel/gif-animation at 3.0 3.0ブランチにて「Download ZIP」からファイル一式をダウンロードします Zipを解凍して、gifAnimationフォルダを、~/Documents/Processing/libraries/にコピーします 完了 GIFアニメの作成方法 // gifAnimationライブラリを読み込む import gifAn
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sound \ Libraries \ Processing.org
Generative Art - Sketches #036 to #042
Oh the fun we'll have
Amazon.co.jp: Generative Design-Processingで切り拓く、デザインの新たな地平: Hartmut Bohnacker (著), Benedikt Gross (著), Julia Laub (著), 安藤幸央 (翻訳), 杉本達應 (翻訳), 澤村正樹 (翻訳), Claudius Lazzeroni (編集), 久保田晃弘 (その他), 津留崎麻子 (その他), 国分宏樹 (監修), 深津貴之 (監修): 本
http://beautifulprogramming.com/
https://theguild.jp/works/1944