角丸の多角形など，チャレンジしたいこともあったが時間もあり，今回はたどり着けなかった．しかしやれることはやった Add rounding corners of triangles. · Issue #2529 · processing/p5.js · GitHub let dark_yellow; let yellow; let light_yellow; let …

乗算をすると海の深さが表現できるかなと思ってblendModeを使ってみた．見ている時間で背景の色が変わるようにしている．レイヤーの合成の概念はもう少しきちんと理解しておきたいけど，ひとまず． let font; let gridY; let gridX; let noiseScaleX = 250; …

いわゆる地味グラミングだけど蜘蛛の巣を張るをやってみる．中の連結をlineで引いてるけど角度計算は三角形だしbezierでできそう． 0〜360度の角度のなかでランダムに角度を増やしながらrotateで回転しながら線を引く． 回転しながら引かれる線Aと次の線Bの…

再生すると音が出ます，すいません． // fork and port from 94's processing code. // http://94.hatenadiary.jp/entry/2018/11/04/013440 let sound_top; let sound_bottom; let sound_right; let sound_left; let sound_vertical; let sound_horizontal; …

「コーディングチャレンジ的なものを続けるコツ」は，軽くてもいいので1日のうちで早い時間にアップするのがいい． 早くアップできると気分が軽くなるし，あとで手も入れやすい．たとえば明日のCodevemberのお題は「Music」だけど，早めに取り組んであげられ…

人参みたいなかわいいお題，いけるんかなとおもったけどいけた．過去に書いた根茎図のプログラムがつかえるなーと思ってp5.jsに転用した． takawo.hatenablog.com //modify from my past sketch in p5. //http://takawo.hatenablog.com/entry/2017/12/30/152…

時計ぽいプログラムを書こうかなと思って絵文字などを配列に突っ込んでいたらどうも行き詰まったので，以前書いたヴィンテージのコンピュータグラフィックスをp5.jsにポーティングした．意外と楽だったけど質感が面白くできないかとおもって，線の透明度を変…

p5.jsで外部ファイルを読み込んで利用する手順を，フォントを読み込む例としてまとめておく．フォント以外にも音声ファイルや画像ファイル，映像ファイルを読み込めるようだ．アップロードできる容量は制限があるものの，Webでのグラフィックス表現としては…

Codevemberは11月1日から30日までの1ヶ月間，毎日設定されているお題に合わせてプログラミングでスケッチするという一種のコーディングチャレンジ．お題はウェブサイトから確認できる．NovemberとCode Dev.あたりが掛かってるのかな．日本語だとついコーデン…

今日はコンピュータクラブの学生が3Dプリンタの組み立てやるのお目付け役をしていた．やはり組み立てのコツ（取扱説明書や動画解説を観ながら，向きや取り付け位置，ポイントなど）を確認することは重要だなと思いつつ，中国製の3Dプリンタキットがあるブレ…

TouchDesigner DAT，Pythonでのスクリプティング UI，OSCなどの理解 Blender コンピュータグラフィックスで使いたい気持ちも出てきた p5.js 体験授業準備 ml5.jsとp5.js Arduino ソリッドステートリレーの100V照明制御 一眼レフのカメラ制御 フィジカルコン…

インスタンシングのスタディとあわせて，CHOP2SOP,SOP2CHOPについて．

リファレンス www.youtube.com

Feedback TOP，Cache TOP，Cache Select TOPを使ったビデオフィードバック．

スクリーンレコーディングはライブコーディングに似ててやり直しがきかない感じの緊張感がある．気負わずやれるほうがいいと思っている． TODO スクリーンレコーディングするまえにSpot on the mouseの起動を忘れない keycastのようなキーボード押下を表示す…

ワークショップspektra 4.0.0での永松さんのサンプルにあった図形をイメージしながら見ないでトレースしてみた． SPEKTRA Vol.4.0.0 : Programming GPU based real-time graphics with TouchDesigner | MTRL KYOTO（マテリアル京都）

yetirom.hatenablog.com イエティが描いていた波紋のプログラムで，困っていたところについて幾つか考えて描いてみた． 要件としては クリックしたら波紋が発生 クリックしてなくても波紋が広がっていくと 波紋の数が増えると 波紋を作るのに必要な変数（括…

チュートリアルではFloyd-Steinbergのディザを生成するアルゴリズムを使っているが，書き換えたプログラムでは便宜上16を4つのランダムな数字をつかって表すやり方でディザを作ってみている． コード import processing.pdf.*; import java.util.Calendar; P…

当初実行画面を見た時に，アルゴリズムが読めなくて困惑した． コードの込み入った部分だけを取り出して読んでみると，for文を使って矩形領域の4辺をなぞるように変数x2,y2を使って座標を移動している．周囲をなぞるようなアルゴリズムはちょうど今日見た以…

randomで設定した方向に同心円が伸びる（中心が進行方向に移動する）部分のオフセットの書き方が面白かった． コード import processing.pdf.*; import java.util.Calendar; boolean savePDF = false; int actRandomSeed = (int) random(100000); int tileCo…

タイリングした矩形の頂点をランダムにバラけさせる．randomSeed()の使い方（引数の値が固定されるとフレームごとのrandomの値が同じ＝固定される）はこれまでもやってきているけど，こういったシミュレーションのスケッチだと便利に使える． コード import …

コード import processing.pdf.*; import java.util.Calendar; boolean savePDF; int actRandomSeed = (int) random(100000); float tileCount = 20; color moduleColor; int moduleAlpha = 70; int max_distance = 500; void setup() { size(960, 540, P3D)…

プロゲーマー，梅原大吾さんが2017年1月に慶應丸の内シティキャンパスで講演したときの動画がYouTubeに公開されている．2時間の動画だが普通にききやすく，全く時間を感じることなく観ることができた． この講演では「ゲーム」という，これまで娯楽以上の社…

84行目あたりのmoduleRadiusBackground = max(moduleRadiusBackground-2, 10);みたいな書き方はスマートでいいなと思った． コード import processing.pdf.*; import java.util.Calendar; boolean savePDF = false; color moduleColorBackground; color modu…

ブロックノイズがすごいので実際に実行してみて欲しい． コード int[][] grid; int x; int y; int dir; int ANTUP = 0; int ANTLEFT = 1; int ANTDOWN = 2; int ANTRIGHT = 3; color c1, c2, c3, c4; PImage ant; void setup() { //fullScreen(); size(960, …

サンプルコードはSVGファイルをシェイプとして読み込むものだったが極力図形をコードで描いた．タイムアップ． コード import processing.pdf.*; import java.util.Calendar; boolean savePDF; int tileCount = 15; float tileWidth, tileHeight; float shap…

コード import processing.pdf.*; import java.util.Calendar; boolean savePDF = false; int strokecap = ROUND; int randomseed = (int) random(10000); int gridSize; color c1, c2, c3; void setup() { size(960, 540); colorMode(HSB, 360, 100, 100, 1…

コード import processing.pdf.*; import java.util.Calendar; boolean recordPDF = false; void setup() { size(960, 540, FX2D); colorMode(HSB, 360, 100, 100, 100); blendMode(ADD); background(0, 0, 0); } void draw() { translate(width/2, height/2…

書けそうだったのでこれまでのPDF保存などの基本構造をベースに書いた．元のサンプルコードと比較してみるとアルゴリズムはかなりトレース出来たことが確認できた． コード import processing.pdf.*; import java.util.Calendar; boolean savePDF = false; v…

コード import generativedesign.*; import processing.opengl.*; import java.util.Calendar; int colorCount = 20; float[] hue = new float[colorCount]; float[] sat = new float[colorCount]; float[] bri = new float[colorCount]; float alpha = 50; …