初めに
ProcessingとUnityのシェーダーグラフを組み合わせて、以下のような絵を作ってみました。
今回の記事では、この絵の作り方を解説します。
目次
解説
Processing
Processing側で円弧をランダムに大量に並べます。
シェーダーグラフ
これをUnityのシェーダーグラフに取り込んで色を付けて完成となります。
作り方
STEP1 : Processingで絵を描く
以下のコードを実行すると、pdeファイルと同じ場所にpngとして絵が出力されます。
final boolean isSave = true; // save as png final int N = 5000; // arc number final int lineSize = 5; // arc line size final float radiusMin = 10; final float radiusMax = 400; float arcRange = radians(100); String getPngName() { return "arc_" + "_N_" + N + "_lineSize_" + lineSize + "_radiusMin_" + radiusMin + "_radiusMax_" + radiusMax + "_arcRange_" + arcRange + ".png"; } void setup() { size(1024, 1024); background(255); strokeWeight(lineSize); strokeCap(RECT); noFill(); // draw arc for (int i = 0; i < N; ++i) { stroke(random(1, 255)); drawArc(); } if (isSave) { save(getPngName()); // save as png } } void drawArc() { float x = width / 2; float y = height / 2; float r = random(radiusMin, radiusMax); float size = r * 2; float radian1 = random(0, 2 * PI); float radian2 = radian1 + arcRange; arc(x, y, size, size, radian1, radian2); }
出力されたpngをUnityプロジェクトに取り込んだら、シェーダーグラフ上での作業に入ります。
STEP2 : シェーダーグラフで加工する(完成)
以下のようなシェーダーグラフを組みます。
以下のような絵が出力されます。