ペチログ

ダラダラ日記

あけおめ2022 ～GLSLやってみた～

あけましておめでとうございます（激遅）☆

ﾍﾟﾁﾀﾞﾖｰ☆

 

さて、2022年がいよいよスタートしましたね！今年はCREATIVEに生きたいと思います☆★

 

もう１月も半分終わったんだが？、と言われてしまいそうですが。最近ちょっと触り始めたGLSLというものを紹介します。（図とか作るのがめんどくさいので解説はしません、スミマセン）

 

↓ こんな感じのができるようになりました

 

以下はただの日記です。よかったら読んでください

 

GLSLとの出会い

年末にMacBookProが故障して困りました。保証が切れていて、修理代がありえん高かったので、もういっそより良いPCを買おうということで、ゲーミングノートを買いました。

 

スペックがまあまあ良いので、せっかくなので映像処理なことをやりたいなと思いました。実は今までも多少興味があってpttvj（https://twitter.com/monptt/status/1479379759398526981）というVJアプリを作りかけていました。初期はPythonで画面をキャプチャして云々とやってたことがあったんですが、動作の快適さと今後の拡張性を考えて年が明けてから作り直しました。

 

動画を読み込んで流せるところまで実装したところで、やっぱりもっとカッコイイ映像を作れるといいなと思いました。Adobe After Effectsとか少し触ってみたことはあるけど、機能が多くてよくわかんないし、素材用意するのも面倒だしな～、何かいい方法ないかな～と考えていました。

 

……思い…出した！

クラブなどではDJが音楽を流している横で、VJ（Video Jockey）が映像を出しています。そしてVJさんの中には、その場でコードを書いてリアルタイムに映像を生成する、いわゆる「ライブコーディング」を行うタイプの人がいるのです。

 

その場で書けるぐらいだからきっとお手軽に違いない（失礼）と思い、早速これをやってみることにしました。

 

ライブコーディング　VJ　[検索] ﾎﾟﾁ

一からGLSL書くスタイルでライブコーディングでVJをやってみた感想｜butadiene｜pixivFANBOX

↑ こちらの記事を読みました。

あーこれこれ！こういう映像が作りたかった！楽しそう！

ん～、何やら、わけのわからないコードが並んでいますが……GLSL（OpenGL Shading Language）という言語で書かれているらしい。

 

GLSL、聞いたことあります、なんかゲーム作ってる人が言ってたやつ。

難しそうですが、まあ、物は試しというわけで、やってみますか

 

GLSLやってみた

そもそも環境構築が必要らしい

偶然にも、前述の pttvj は OpenGL ベースで作っていたので、GLSLを処理することも割と簡単にできました。ラッキーですね！

 

さて、このGLSLというものは、3Dモデルに色を付けるために使われるらしいのですが、ライブコーディングの場合は「板ポリ」と呼ばれる平面１枚だけしか使わないらしいです。

 

色塗りは、フラグメントシェーダーにより、各画素の座標に対して色を指定する形で書いていきます。線を描いて～丸を描いて～みたいなのを想像していたので、ちょっと驚きました。各点で処理するのでGPUに投げて並列計算ができるらしいです。

 

魔法使いになりたい人のためのシェーダーライブコーディング入門 - Qiita

こちらの記事がかなり参考になりました。

タイトルもいいですし

 

 

手始めに2Dで遊んでみました。

ある点からの距離の-1乗で光らせられるとか、座標を0.1で割った余りを使うと0.1刻みで同じ値になるので複製になるとか、それをθ方向でやるとか（polar mod）、、シンプルながら面白いテクがたくさんあるようでした

 

3Dの図形を描くには「レイマーチング」という手法を使うそうです。

ゼロから始めるレイマーチング - Qiita

 

いま描画対象は板ポリ（平面）だけなので、3D図形を扱うにも平面上に射影してやる必要があるということです。

ざっくりいうと、

  • カメラ位置とスクリーン上の画素の座標から視線（レイ）の方向を設定
  • 描きたい図形からの距離を計算し、その分だけレイを進める
  • 繰り返すと、レイが図形とぶつかり距離が０になる（ので色を決める）、またはぶつからない（ので何も描かない）

みたいなことをやります。

 

また、GLSLには再帰関数がありません（泣）。IFS（Iterated Function System）という手法で、座標変換と距離関数の計算を繰り返すことで、フラクタルな映像を作ることができるようです。

[レイマーチング] IFSとPolar Modについて雑にまとめてみる - Qiita

こちらの記事が参考になりました。

 

 

これだけでも色々できることが増えた感じがします！この一年間でどれだけやれるか、楽しみですね☆☆

 

おわりに

お手軽かどうかビミョーですが、年明け早々に面白いオモチャを見つけた！という感想です。よければ一緒にやってみましょうー

ではでは～☆