日常の進捗

主に自分のための,行為とその習慣化の記録

Processing

Mod: Coding Challenge #11: 3D Terrain Generation with Perlin Noise in Processing

やったやつ上げ忘れていたのであげておく。OpenProcessing用にp5.jsに移植しようと思ったけどWEBGLのレンダラだとTRIANGLE_STRIPが使えなかったのでおあずけ。GIFで。 コード int w, h, rows, cols; int scale = 20; float[][] terrain; // setup関数 : 初回…

Mod:Coding Challenge #10.3+10.4: Maze Generator with p5.js - Part 3+4

勢いでパート3と4を見て一気に書いてしまった。改変したところは、上下左右の壁面境界の判定、迷路が完成したところでsaveFrameすること、マウスクリックで初期化すること、色を毎回変えていることあたり。 こんな感じの迷路が生成される。 コード float col…

Mod:Coding Challenge #10.2: Maze Generator with p5.js - Part 2

昨日の続きで、迷路ジェネレータをProcessingで書く。途中なのでそんなに面白くはないけど、書いてる側は結構面白い。 アルゴリズムは再帰的バックトラック法ってやつを使うらしい。アクティブなセルを紫にしていて、セルごとに通過したかどうかを真偽値でチ…

Mod:Coding Challenge #10.1: Maze Generator with p5.js - Part 1

p5.jsで書かれていたものをProcessingで書いてみた。なんとなく。先取りして迷路作るところまで行けた。グリッドに切り分けたセルごとに、上下左右の4つの壁を設定して、Booleanで壁があるかないかをプロパティで持たせてる。変数名とかは自分がわかりやす…

Mod:Coding Challenge #9: Solar System in Processing - Part 3 (3D textures)

昨日の3Dの続き、テクスチャを球体にマッピングする方法。PShape使うのは知らなかった。応用効きそう。どっちかというとマッピングするテクスチャ画像の用意のほうが大変か。 複数のファイルの名前を意識しないで読み込むやりかたは、以前hysyskがやっていた…

Mod:Coding Challenge #8: Solar System in Processing - Part 2 (3D)

3D版はPeasyCamという3Dの視点移動のライブラリが使われてたりして改変しづらい。OpenProcessingだと動作しないし。仕方ないのでGIF貼る。 via GIPHY import peasy.*; import peasy.org.apache.commons.math.*; import peasy.org.apache.commons.math.geomet…

Mod:Coding Challenge #7: Solar System in Processing - Part 1 (2D)

そんなに書き換えなかった。今回2Dで次回が3Dなのでそっちを頑張る感じ。 Planet sun; // setup関数 : 初回1度だけ実行される void setup() { size(960, 540); // ウィンドウサイズを960px,540pxに colorMode(HSB, 360, 100, 100, 100); // HSBでの色指定に…

Mod:Coding Challenge #6: Mitosis Simulation with p5.js

Mitosisは有糸分裂、細胞分裂のことっぽい。マウスでクリックするとセル(細胞)が分裂するというもの。p5.jsで書いているのを観てProcessingで書くのをリアルタイムでやってみるけど、意外とフムフムと考えながらやれるのは良い。それがprocessing.jsで動く…

Mod:Coding Challenge #5: Space Invaders in Processing

スペースインベーダーのチュートリアル。マウスをクリックしてスタート。左右の矢印キーで母艦を動かしてスペースキーで射撃する。 ビデオではp5.jsでやってたけど気まぐれでProcessingでやった。クラスのプロパティも多少書き換えたりしてみた。ビデオの中…

プログラミングとボードゲーム

最近は、ちょくちょくプログラミングを題材にしたボードゲームって何かないかなと思ってリサーチをしていた。 www.fatherly.com varianto25.com https://boardgamegeek.com/geeklist/168672/games-computer-programming-theme-bgg-rank/boardgamegeek.com で…

ProcessingでCSVファイルを生成する

退屈なことはProcessingにやらせようの観点で、必要にせまられ今日は事務的なプログラミングとして、テスト用のCSV(Comma-Separated Values)を出力した。テキストファイルの出力はPrintWriterというクラスを使う。日付と時間からファイル名を生成する関数を…

openFrameworksからProcessingに書き換えてみる

#openframeworks #programming https://t.co/FwzXyKQ3aK pic.twitter.com/aZjDZge6yU— junkiyoshi (@junkiyoshi) August 17, 2017 TwitterでTLに流れてきたもので、気になった。これはopenFrameworksというProcessingの思想から影響を受けて開発されたクリエ…

Mod:Coding Challenge #4: Purple Rain in Processing

パラメータにY方向の重力以外にも、X方向の風を追加した。あと矢印にしたら逆に雨ではなくなった。マウスで重力と風を制御出来る。 int num = 500; Drop[] drops = new Drop[num]; void setup() { size(960, 540); colorMode(HSB, 360, 100, 100, 100); for …

Mod:Coding Challenge #3: The Snake Game

スネークゲーム。チュートリアルではを矢印キーで動かすものだったが、操作するの面倒だったので、が自動で餌を追従するようにプログラムを書き換えた。気分を変えようとp5.jsで書いてみた。 var snake; var scl = 10; var food; function setup() { createC…

Mod:Coding Challenge #2: Menger Sponge Fractal

コードを写しながら解説を聴く感じ。x,y,zで-1から1の範囲で繰り返して、それを元に座標計算をする流れは新鮮だった。内容としては完成したものを自分なりの書き方に書き換えた他、座標ごとに個別で回転や世代のループ、視点移動させるなどしている。 ArrayL…

Mod:Coding Challenge #1: Starfield in Processing

Daniel Shiffmanはクリエイティブコーディングのバイブル「Nature of Code」の著者として知られている。それ以外にも、Processing/p5.jsのチュートリアル動画をYoutubeに多数公開している。その量たるや膨大で、どれも観ていてわかりやすく面白い。学生にと…

三角形を円周上に配置する

はじめは、特に何も考えないでプログラムした。円周状に何か並べたいなと思ったので三角形を配置した。三角形の頂点が伸び縮みしたらどうだろうと考えた。次に半径の異なる円を複数描画して敷き詰めようとしてみた。円ごとに頂点の伸び縮みする周期をずらし…

花火

花火を観に行けてないので打ち上げた。いつもそうだけど、今回は特に勢いで書いた感じになった。 マウスをクリックした位置で花火が爆発する。 ArrayList<Mover> movers = new ArrayList<Mover>(); void setup() { fullScreen(); colorMode(HSB, 360, 100, 100); backgroun</mover></mover>…

昨日は口頭発表の原稿提出日だった。なんとか出せた。 昨日は一日雨で塵が落ちたので、今日は空気が澄んでいた。 int grid = 20; float[][] points; PGraphics pg; // setup関数 : 初回1度だけ実行される void setup() { size(960, 540); // ウィンドウサイ…

無題

昨日に引き続いて色々やったのけど個別にまとめている時間がない。後日整理する。 int num = 100; ArrayList<Box> boxes = new ArrayList<Box>(); // setup関数 : 初回1度だけ実行される void setup() { size(960, 540); // ウィンドウサイズを960px,540pxに colorMode</box></box>…

クラスをつかったボールのアニメーションの発展(重力・摩擦・3D)

昨日の続き。 takawo.hatenablog.com 重力 int num = 100; Ball[] balls = new Ball[num]; void setup() { size(960, 540); colorMode(HSB, 360, 100, 100); for (int i = 0; i < num; i = i+1) { balls[i] = new Ball(); } background(0, 0, 0); } void dra…

変数、配列、クラスをつかったボールのアニメーション

配列やクラスについて勉強して欲しい気持ちで勢いで書いた。 変数を使ったボールのアニメーション float x; //ボールのx座標 float y; //ボールのx座標 float xSpeed; //ボールのx方向の速度 float ySpeed; //ボールのy方向の速度 color c; //ボールの色 flo…

ノイズと円

今日は軽め。終端の0度と360度のつなぎ目の部分がうまく行かなかった。 int m = 60; float step = 360 / m; // setup関数 : 初回1度だけ実行される void setup() { fullScreen(); // ウィンドウサイズを960px,540pxに colorMode(HSB, 360, 100, 100, 100); /…

回遊

久しぶりにそこそこ長く書いた。とはいえ、コードの殆どはProcessing公式のフロッキングのサンプルをベースにしてる。 Flocking \ Examples \ Processing.org マウス:増える キーボード:方向のランダム化 Flock flock; int num =150; // setup関数 : 初回1…

波っぽい円弧

float step = 40; // setup関数 : 初回1度だけ実行される void setup() { size(960, 540); // ウィンドウサイズを960px,540pxに colorMode(HSB, 360, 100, 100, 100); // HSBでの色指定にする } // draw関数 : setup関数実行後繰り返し実行される void draw(…

現在の描画力

実紙に実ペンで実線を引くと実に揺れる。現実と理想 size(960, 720); colorMode(HSB, 360, 100, 100); background(0, 0, 100); strokeCap(PROJECT); int i = 0; translate(0,height/16/2); for (float y = 0; y < height; y += height/16) { float x = map(i…

イメージと形

なかなか頭のなかにある動きのとおりに形が作れず、時間切れ。 OpenProcessingで選べるレンダラのモードでWEBGLがあるけど、色空間の指定がイメージしているものと違うので今度調べる。 float s = 250; float step = s / 2.5; // setup関数 : 初回1度だけ実…

風景とプログラミング

波の動き、涼しげに。 float step = 30; float offset = 30; // setup関数 : 初回1度だけ実行される void setup() { size(960, 540); // ウィンドウサイズを960px,540pxに colorMode(HSB, 360, 100, 100); // HSBでの色指定にする } // draw関数 : setup関数…

コード見ないで模写

OpenProcessingでこのスケッチを見て、模写してみたくなったのでコード見ないで書いてみた。それほどうまく真似れていないけどタイムアップ。コード見ないで模写は絵画のデッサンに似ている感じがする。 www.openprocessing.org フロッキング(群体シミュレ…

noiseとrandom

noiseとrandomは三角関数と同様手癖で書くProcessingでは、非常に便利な道具。 noise:与える引数(時間)に応じて、0-1揺れる連続的な数値を生成してくれる random:与える引数を最小最大の範囲にして、不連続的な数値を生成してくれる 動きがある部分に使…