https://neortmeetup1.peatix.com/ こちらのイベントでお話させて頂いた内容です。 コンピュータによる自動化によって、人とクリエイティブコーディングの関係はどうなっていくのか、実験と共に紹介させて頂きました。 https://twitter.com/hashtag/neort_meetup

1. クリエイティブコーディング の 行方
Masaru Mizuochi
@_mizumasa
NEORTミートアップ #1 LT

2. ツールやプラットフォームの境界を超えてビジュアル表現を行う
クリエイターのためのプラットフォーム

3. @_mizumasa
色々な映像作品、空間作品をつくっています

4. CharActor
キャラクター
という作品をつくっています
文字 人 個性

5. シェーダーコードを大量に自動生成して映像をつくっていま
す 5

7. 別名 シェーダー
ガチャ !!??

8. 8

9. 9
１つ１つが数式を持っている

10. フラグメントシェーダーの構成
fragColor = vec4(
abs( sin( cos( time + 3. * uv.y ) * 2. * uv.x + time)),
abs( cos( sin( time + 2. * uv.x ) * 3. * uv.y + time)),
1.0,
1.0);

11. 生成モデル
11
fragColor = vec4(
abs(□),abs(□),1.0,1.0);
↓
□ = sin(□)
↓
□ = □ + time
shader code model
sin( cos( time + 3. * uv.y ) )
↓ (cos(□) → log( cos(□) ))
sin( log( cos( time + 3. * uv.y ) ) )
code extension
a section of the code in Figure 1
sin( cos( time + 3. * uv.y ) ) → sin( sin( time + 3. * uv.x ) )
a section of another code
tan( sin( uv.x + 4. * log( time ) ) ) → tan( cos( uv.y + 4. * log( time ) ) )
code exchange

12. 自動生成されるコード
12

13. 一瞬でこれぐらいのコードが書ける
13

14. 自分で書かなくてすむ (そのシステムを組むのには2000行書いてるけど)
14
もっと賢く
できるのでは？

15. 強化学習でやってみる
15
fragColor = vec4(
abs(□),abs(□),1.0,1.0);
↓
□ = sin(□)
↓
□ = □ + time
行動：
式の生成時に関数を選ぶ
行動：
式の生成時に関数を選ぶ
評価： 生成された映像の複雑さ ≒ PNG圧縮した時のサイズ

16. chainerRLを使うと100行で強化学習が書ける
16
import chainer, chainerrl
import chainer.functions as F
import chainer.links as L
import numpy as np
class Board():
def reset(self):
self.boardW, self.boardH= (4,6)
self.actNum = 3 #0:left 1:stay 2:right
self.obs = np.array([0] * 5, dtype=np.float32)
self.barPosX = np.random.randint(0,self.boardW)
self.ballPosX = np.random.randint(0,self.boardW)
self.ballPosY = 0
self.ballSpeedX = np.random.choice([-1,1])
self.ballSpeedY = 1
self.setObs()
self.count = 0
self.reward,self.done, self.info = 0, False, 0
returnself.obs
def step(self, action):
self.barPosX = np.clip(self.barPosX + action - 1, 0, self.boardW- 1)
if (self.ballPosX == (self.boardW- 1)) and (self.ballSpeedX== 1): self.ballSpeedX *= -1
if (self.ballPosX == 0) and (self.ballSpeedX == -1): self.ballSpeedX*= -1
if (self.ballPosY == 0) and (self.ballSpeedY== -1): self.ballSpeedY*= -1
if (self.ballPosY == (self.boardH- 2)) and (self.ballSpeedY== 1) and (self.ballPosX== self.barPosX):self.ballSpeedY*= -1
self.ballPosX += self.ballSpeedX
self.ballPosY += self.ballSpeedY
self.setObs()
self.check()
returnself.obs, self.reward, self.done,self.info
def setObs(self):
self.obs[0]= self.barPosX
self.obs[1]= self.ballPosX
self.obs[2]= self.ballPosY
self.obs[3]= self.ballSpeedX
self.obs[4]= self.ballSpeedY
def check(self):
self.reward = 1
if ( self.ballPosY== (self.boardH- 1) ): #ball miss
self.reward= -1
self.done = True
def get_random(self):
self.count += 1
returnnp.random.randint(0,self.actNum)
def show(self):
board= np.zeros((self.boardH,self.boardW),dtype="uint8")
board[self.boardH- 1, self.barPosX]+= 2 #barpos
board[self.ballPosY, self.ballPosX]+= 1 #ballpos
print board
class QFunction(chainer.Chain):
def __init__(self,obs_size,n_actions, n_hidden_channels=50):
super(QFunction,self).__init__()
withself.init_scope():
self.l0 = L.Linear(obs_size, n_hidden_channels)
self.l1 = L.Linear(n_hidden_channels,n_hidden_channels)
self.l2 = L.Linear(n_hidden_channels,n_actions)
def __call__(self,x, test=False):
h = F.tanh(self.l0(x))
h = F.tanh(self.l1(h))
returnchainerrl.action_value.DiscreteActionValue(self.l2(h))
if __name__ == '__main__':
env = Board()
obs = env.reset()
q_func = QFunction(len(obs), env.actNum)
optimizer= chainer.optimizers.Adam(eps=1e-2)
optimizer.setup(q_func)
explorer= chainerrl.explorers.ConstantEpsilonGreedy(
epsilon=0.3,random_action_func=env.get_random)
replay_buffer = chainerrl.replay_buffer.ReplayBuffer(capacity=10 ** 6)
phi = lambdax: x.astype(np.float32,copy=False)
agent = chainerrl.agents.DoubleDQN(
q_func, optimizer, replay_buffer, 0.95, explorer,
replay_start_size=500, update_interval=1,
target_update_interval=100, phi=phi)
n_episodes = 2000
max_episode_len = 20
for i in range(n_episodes):
obs= env.reset()
reward = 0
done= False
R = 0 # return (sum of rewards)
t = 0 # timestep
whilenot done and t < max_episode_len:
action = agent.act_and_train(obs.copy(),reward)
obs, reward, done,_ = env.step(action)
R += reward
t += 1
print('trainepisode:', i,'R:', R,'count:',env.count,'step:',t,'statistics:', agent.get_statistics())
agent.stop_episode_and_train(obs.copy(),reward,done)
obs = env.reset()
done = False
R = 0
whilenot done and R < 400:
action = agent.act(obs)
obs, r, done, _ = env.step(action)
R += r
env.show()
print('testepisodeR:', R)
agent.stop_episode()
agent.save('dqn')
落ちないように行動を選択
 100行で始める深層強化学習 (0から壁打ちゲーム)
としてQiitaにまとめました
https://qiita.com/mizumasa/items/86204211581336f412ef

17. シェダー生成は学習できるか？
17
複雑になった

18. 18
思ったほど綺麗ではない

19. 遺伝的アルゴリズム
19
そういえばこういうのもある

20. 20
遺伝的アルゴリズムを応用してみた

21. 21
模様になった

22. 名刺デザイン100パターンできた
22

23. 23

24. Yahoo!Hackday, Eureka展, 御殿山さくらまつり, Dots Tokyo ラストワンマンライブ, ごはんとアート

25. 移植してみた

26. 26
なぜつくるのか

27. 人間の創造性はどこへ向かう？
27The Power of PowerPoint - thepopp.com

28. Creative Codingの歴史（田所さんの資料より）
28The Power of PowerPoint - thepopp.com

29. Creative Codingの歴史（田所さんの資料より）
29The Power of PowerPoint - thepopp.com
Hyper
media /
Web
Game
3D
Graphics
Sound
/ Music
Sound
/ Music
Sketch

30. Creative Codingの歴史（田所さんの資料より）
30The Power of PowerPoint - thepopp.com
Hyper
media /
Web
Game
3D
Graphics
Sound
/ Music
Sound
/ Music
Sketch ????

31. 31
Grow + Group

32. ジェネラティブ、アルゴリズミックデザイン
32
Autodesk, Houdiniといったツール デザイン、プロダクト、建築に広
がる
The Power of PowerPoint - thepopp.com

33. 人工生命 ライフゲームやBoidsモデル
33The Power of PowerPoint - thepopp.com

34. 34
種の多様性そのものを
デザインとみる

35. 数式が作り出す個性 = CharActor

36. 36
遺伝子のように解釈されるコード
個と群
多様性が生む美しさ
それは生命そのものかもしれない

37. Thank you !
37
そのほか最新の
作品はtwitterで
呟いてます
@_mizumasa