Generative Art with Unity稲森 亮介 07/29/2015

Who am I

• 稲森 亮介

• 主にプログラマー • 最近はもっぱらcocos2d-xとPHP

• Unityで小規模ゲーム2本制作、あとはプロトタイピングに活用

• 余暇にゲーム作ってます

今日お話しすること

1.“Generative Art”って？ - 「自律性」?? - Case Study1: 物理演算

2.Unityで絵を描く8つの方法 - Trail Rendererで球面を描く

3.今日からはじめるGenerative Art - Case Study2: Game of Life

- TIPS: FoVからWorld座標を求める - Case Study3: Game of Life(HSV)

- TIPS: HSV to RGB Color - Case Study4: Spiro Graph

4.おわりに: 何の役に立つ？

“Generative Art”って？

“Generative Art”って？

• “方法論を「ジェネラティブ」と呼ぶには、まず最初の鉄則として自律性が必

ず含まれていなければなりません”

- 「ジェネラティブ・アート Processingによる実践ガイド」

!• “コンピュータソフトウェアのアルゴリズムや数学的/機械的/無作為的自律過

程によってアルゴリズム的に生成・合成・構築される芸術作品を指す”

- Wikipedia(Ja)

!• “全体または一部が自律システムによって生み出されたアート”

- Wikipedia(En)

“Generative Art”って？

「自律性」？？

• 大ざっぱに言えば、制作者の手を離れて動く仕組みのこと

- 例えば擬似乱数、ノイズ、物理演算、複雑系(ライフゲー

ム、Boids…）、人工知能系アルゴリズム（NN, GA…)

!

• 厳密なことを言えば、例えば「利用者とのインタラクション」なんかは制作者の手を離れてるけど他律的なので定義としては不十分

必ずしもデジタル・アートでなくてもよい

• e.g. Ellsworth Kelly (1923～)

- 色やピースをランダムに選んで制作

- 媒体は紙とインクやモザイクアート

- 「ランダム」=制作者が全て決めてるわけではない=自律的

• 大ざっぱに言えば、制作者の手を離れて動く仕組みのこと

- 例えば擬似乱数、ノイズ、物理演算、複雑系(ライフゲー

ム、Boids…）、人工知能系アルゴリズム（NN, GA…)

!

• 厳密なことを言えば、例えば「利用者とのインタラクション」なんかは制作者の手を離れてるけど他律的なので定義としては不十分

「自律性」？？

Case Study1: 物理演算

(Demo)

Unityで絵を描く8つの方法

Unityで絵を描く8つの方法

• Game Object - Case Study1みたいにプリミティブ組み合わせたり、3Dモデルにマスゲームさせたり

• Texture2D::setPixel() - AS3やProcessingライクに

• Mesh(vertices, triangles, normals, uv) - ライティング頑張れば「Unityならでは」感が出そう

• Trail Renderer - おすすめ

• Particle System - Trail Renderer風に使える

• Line Renderer • Shader • Post Effect(OnRenderImage)

Trail Rendererで球面を描く

(Demo)

今日からはじめるGenerative Art

今日からはじめるGenerative Art

Step1. 題材（自律システム）を決める

- (再掲) 擬似乱数、ノイズ、物理演算、複雑系(ライフゲーム、Boids…）、人工

知能系アルゴリズム（NN, GA…)、etc…

!Step2. 表現（絵の描き方）を決める

- (再掲) GameObject, Mesh, Texture2D::setPixel, Trail Renderer, Line

Renderer, Particle System, Post Effect, etc… !Step3. 作る！

- 作ってる内にもっとクリエイティブな題材や表現が浮かぶことでしょう

Case Study2: Game of Life

(Demo)

TIPS: FoVからWorld座標を求める

• y = z・tan(FoV/2)

• x = y・(ディスプレイ高さ/ディスプレイ幅)

• 画面の端に何かを配置したり、画面いっぱいに何かを充填したい時によく使う

Case Study3: Game of Life(HSV)

(Demo)

TIPS: HSV to RGB Color

• グラフィックプログラミングには欠かせない、HSV色空間で色を指定する方法がUnity

には無い

- ググれば計算式は出てくるので自分で書けるけど、どう考えても車輪だし…

• いやあるにはあるが、UnityEditor. EditorGUIUtilityに定義されててランタイム上では

使えない

• でもEditor上でしか定義できない理由は無いはずなので、ランタイム上に持ってくれば

いい！

• UnityEditor.dllをデコンパイルした結果を共有してくれてるリポジトリがある

- https://github.com/MattRix/UnityDecompiled/blob/master/UnityEditor/UnityEditor/EditorGUIUtility.cs

- twitter上でやりとりして、Unityの中の人にも許可得てる模様

• という事で、UnityEditor. EditorGUIUtility::HSVToRGB()をそのまま使わせてもらえ

ばOK

Case Study4: Spiro Graph

(Demo)

おわりに: 何の役に立つ？

• まあアートなので実用的である必要はないですが

!• Unityの練習台としてお手頃なのではないでしょうか

- すぐ形になるし、一人で作れるし、個性が発揮できる

- ゲームだとゲームデザイン、UI、ロジック、レベルデザイン、シーン遷移、ライティング、ア

ニメーション、エフェクト…とやる事が多く、完成するまでに挫折しがち

!• VJに使ったり、ゲームの背景やエフェクトに使ったりといっ

た応用もできる、かも！