GLSLでちょっとお絵描きしたいな、って時にみなさんはどういう環境でコーディングしてますか？
代表的なコーディング環境
よく使われるのは以下のようなブラウザベースの環境ではないでしょうか。
インストール不要で、ササッと書いて確認できる便利な環境ですよね。
Shadertoy
GLSL Sandbox
glslfan
NEORT ※コーディング環境っていうより配信プラットフォームの色が強い？
個人的な不満点
でも個人的には上記環境でのコーディングには不満があるんですよ。ってのが以下。
GITで管理したい
ちまちまと書いたコードをちゃんと管理したいんですよね。
いちいちテキストエディタにコピペしてファイル保存すれば管理できるものの、その一手間がちょっと面倒くさい。
それにブラウザだと場合によってはいきなりプロセスごと落ちたりして、編集途中のものをロストするのがやだな、と。
MIDIコントローラーを使いたい
いまいちちゃんと理解してないまま写経したコードは、パラメータをちまちまいじりながら絵的にどう変化するかを確認しながら理解を深めたい。
となるといちいち数字を書き換えるよりも、MIDIコントローラーのノブなりスライダーなりを動かしながら確認する方がスムーズ。
何よりも手元の操作で絵が動いていくのを見るのが楽しい。
そういうこともありMIDIコントローラーを使えるかどうかは個人的に結構ウェイトがでかい。
マルチパスで描きたい
個人的にレイマーチングとかよりも、ポストエフェクトみたいなものの方が簡単で面白い効果を確認しやすくて勉強のとっかかりには良いんじゃないかと思う。
ただポストエフェクトを実装しようとすると、マルチパスのレンダリングパスを定義できないとなかなか難しい。
出来ないわけじゃないけど、無駄にリソース使う羽目になるしね。
※Shadertoyはできるけどね(使ったことないので細かくは知らない)
Unityじゃダメなの？
以前はUnityでHLSLで書いてたんだけど、やっぱりガシガシ書いてリアルタイムに反映されての繰り返しが前述のブラウザベースに比べて弱い気がする。
色んなI/Oに対応したある程度以上の規模のものを作る上ではアリなんだけどね。
ただちょっとシェーダーを書くのをメインに考えると、やや小回りが利かない感じ。
そんな私の前に現れたのがKodeLifeだった
さやちゃんぐbotさん主催のshaderもくもく会に参加した際に、いやーなんか良いコーディング環境ないですかねー、みたいな話を振った際に参加者からこういうのがあるよと教えて貰った。
それが私とKodeLifeの出会いだったのだ！
未だBeta版ながら一目惚れと言っても過言ではないぐらいに惚れ込んだ私は、その日のうちにライセンス購入したのであった。
そんなKodeLifeの魅力を伝えていきたい。
KodeLifeの良いところ
細かいところでは言及すべき機能はもっとあるんだけど、個人的に刺さる部分だけ紹介。
マルチパス
パスを幾つでも追加できるので、ポストエフェクトとかを書ける。
という以上の使い道があるような気はするけど自分には分からない。
ついでにFragmentShaderだけではなく、VertexShaderやGeometryShaderも書けるみたい!
で、このあたりはあまり触ったことないので何とも言及しがたいがちょっとやってみたいな。
様々な入力を扱える
MIDI, OSC, GamePad, Audioの入力を受けられる。
細かい話をすると、これらの入力値は特定のテクスチャに書き込まれていて、それを下記のようなコードで読み取ることで入力値を取り出すことができる。
texelFetch(midiTexture, midiCoord(3 * 127 + ccNumber), 0);
音声入力もLow, Middle, Highの範囲とGainを調整できるので、オーディオリアクティブな表現をパパっと書きやすくて楽しい。
ある程度は補完が効くエディタ
これが最高というほどではないにしても、標準的な関数などについてある程度補完してくれるだけでもありがたい。
画面レイアウト
VisualStudioCodeのShaderToy拡張というのも試してみたものの、ペインを切り離して別ウィンドウに持っていけなかったので別の不満があり微妙。
描いてる絵によっては、コードの背景に描画されると見づらいことがある。
マルチディスプレイ環境だと、コードのみと最終出力のディスプレイは分けた方が作業しやすいと思う。
また出力についても、純粋なレンダリング結果のみとそこにコーディングしているエディタを載せたりも切り替えられるので、ライブコーディングを見せることもできて便利。
Syphon/Spoutへの出力に対応
個人的に結構これがでかいと思う要素で、Syphon/Spoutというのはプロセス間で映像の受け渡しをするためのソフトで、これに対応してると映像出力を別のVJソフトなどに流し込んで動画素材として扱えるようになる。
個人的に純粋なライブコーディングと、TouchDesignerなどを使ったジェネラティブなVJの中間あたりに自分のやりたいと思える領域がある気がしている。
なのでVJソフトへの流し込みの口があると都合が良かったり、またライブコーディングだけで間を持たせるのが難しい場合の繋ぎとしてうまくVJソフトを使えるのではないかと思っている。
ワクワクさせてくれるfutureのfeature
いつ来るのかは分からないが、発表されてる実装予定の機能もなかなかにソソる内容で、個人的には今後の動向から目が離せない。
ノードベースエディタ
UnityのShaderGraphやTouchDesignerみたいなノードベースのエディタも開発してるっぽい。
細かい数式を表現するとゴチャゴチャしがちだけど、大抵のノードベースエディタは処理途中の結果を目で確認できるところがとても便利なんだよなぁ。
このあたりもうまく実装されてると嬉しい。
ループ動画撮影
現状では静止画でのファイルアウトプット機能しかないが、ループ動画のアウトプット機能も付くらしい。
レンダリングコストの高いシーンをプリレンダリング素材として書き出して、VJソフトで素材として使うという運用も悪くないな。
mobile版
現在クローズベータテスト中でモバイル端末でもほぼ同等の機能のエディタが動いている。
hexlerにメールを送るとTestFlightの招待が届いてインストールできる。
流石にソフトウェアキーボードでのコーディングは実用的ではないが、Bluetoothキーボードがあればちょっとアイデアメモ的にさらっと書けると考えるとワクワクする。
現状では実装されてないが、カメラ入力を受けられると面白ARカメラエフェクトを書けるようになるので、是非とも実装して欲しいと切に願っている(みんなで要望を送ろう！)
今のうちに買っとけ
2019/12/11現在なら75%Offで3000円弱と非常にお求めやすいライセンス料なんですね。
Betaなので無料で触れますが、もし気に入ったなら開発を加速してもらうためにもライセンス買いましょう！
自分の観測範囲ではこれと同程度のエディタは存在していなし、めっちゃ気に入ったのでどしどしオススメしていきたい。
推しってヤツです。
Hexler最高
そんなKodeLifeを開発しているHexler社は他にも魅力的なアプリをリリースしている。
モバイル端末上で動くOSCクライアントTouchOSCや、iPadのVJアプリTouchVizなど。
TouchOSCでインターフェース作って
Protkolで入力値をチェックして
KodeLifeで受けて映像を作り
それを素材にしてTouchVizでVJする
なんていうHexlerべったりなVJワークフローなんてのも一興ではないかと。
I love Hexler!!!
おまけ
KodeLifeオンリーで、ちょっとしたVJソフト作ってみた。
MIDIを捌けるだけで結構やれることが広がる感じでめっちゃ楽しい。
