RickとMortyのSDFアニメーションをプログラミングしてみた！その魅力とは？
引用元：https://news.ycombinator.com/item?id=42958696
いい仕事だし、すごく良い投稿だね。ちょっと付け加えると、二回目のスーパーサンプリングなしで滑らかなアンチエイリアスエッジを得たいなら、SDFで標準的な微分を使うと良いよ。”aastep”に置き換えるだけさ。 https://github.com/glslify/glsl-aastep
これすごい！Shader開発者ってマジで次元が違う。ウェブやプロトコル、アプリ開発とは全然違うし、数値を変えてshift-enter押してすぐに結果が見えるのはめっちゃ満足感あるよね。お見事！
Shader開発者の話してるのは、javascriptのcanvasとかp5.jsのようなものかな？グラフィックスプログラミングの話？それともGPUシェーダーの具体的なこと？
canvasのフレームバッファをループするのも似た体験だね。ただしパフォーマンスは劣るし、GPUシェーダーよりコードの状態やメモリに簡単にアクセスできるのがいいところ。
とても良い記事だね！Inigo QuilezのYouTubeチャンネルのプレイリストが役立つよ。 https://www.youtube.com/watch?v=0ifChJ0nJfM&list=PL0EpikNmjs…
ここでの作業も説明のクオリティも素晴らしいし、読者への挑戦も考えられている。シェアしてくれてありがとう。
＞私はリファレンス画像をプレビューの上に表示して比較することで、コードを変えながらオリジナルと比較できたんだ。それが手描きアニメの方法なんだよ！Shaderプログラミングは別物だけど、すごくいい記事だね。
このGLSLの導入はすごくよく組み立てられてるね。VulkanやWebGPU/WebGLでどうなるか、誰か教えて！
ほぼ同じだよ。VulkanやWebGLはGLSLをそのまま使えるし（GLSL→SPIR-Vへ）。WebGPUはブラウザだと使えないけど、ネイティブではGLSLをサポートしてるし、トランスパイルもできる。WGSLはGLSLのRust風の文法版みたいなものだね。
実際にはWebGPUとMetalはGLSLをVulkanと同じようにサポートしてる。トランスパイルするだけで、違いはないと思うよ。ただVulkanに慣れてるからそのステップがあるだけだね。
ユーザーから見るとそうかもしれないが、内部では違うんだよね。VulkanではGLSLからSPIR-Vに変換、WebGPUではGLSLからWGSL、HLSLからDXIL、MSLからIR、SPIR-V、GLSL(コンパクトバックエンド用)に。ここでドライバーがGLSLやDXIL、Metal IR、SPIR-Vなどを使って独自のバイトコードを生成する。LLVMの複数のコピーがいろいろなところで関わってる。複雑で、はっきり言って面倒なパイプラインだよ。
このアニメーション完成までに8ヶ月かかったのは、本当に根気強さを反映してるね。
作者の開発過程は、少数値をあれこれ調整するループだったのか、何かエディターを使ったのか？240行の適切な小数値を生み出すのは、かなり時間がかかりそうなんだけど。
そのページに встроенныйコードエディタを使っただけだよ。バイナリサーチは手作業でも速いしね。
こういうことをするときは、スライダーや入力を取ってユニフォームに結びつけるだけだよ。ユニフォームはシェーダーに渡され、再コンパイルなしで更新可能。
彼はシェーダー・リックだ！
ピクセル・リック！ピクセル・モーティに変身したぜ！
“Pixel Rick”は記事に入れないとダメだね。追加したよ。ありがとう！
実際の声をテキストメッセージにどうやって入れたの！？
みんなに良いニュース！
もっとコメントを表示（1）
すごいね。これがどれほど印象的か表現するのが難しいわ。
Balatroのポータルアニメーションも同じ方法で作られてるか誰か知ってる？
Balatroの背景はシェーダーだと思うけど、効果は違うね。こっちは静的なリングが地平線に向かって縮んでいくけど、Balatroは流れるような動きがある。<br＞＞Balatroの背景はデモシーンのエフェクトを意図的に思い出させるね、すごく好き！
＞＞Balatroの背景はデモシーンのエフェクトを意図的に思い出させるね、すごく好き！<br＞うん、私もすごく好き！
ゲーム持ってるなら、解凍してコード見れるよ。
ありがとう、知らなかった。最近モバイル版手に入れたばっかりなんだ。
GLSL/SDLの別の応用として、ThreeJSでShaderMaterialを使って自分専用のカスタムシェーダーマテリアルが作れるよ。シェーダーコードをマテリアル内の文字列で書くと、マテリアルが付いてるメッシュに適用されるんだ。<br＞これで後処理フィルターなしでフレネルみたいなかっこいいエフェクトが作れる。
真面目な質問だけど、いつになったらこれがリターンキー押す度にRickの顔が点滅するゴーストシェーダーになるの？
このページの品質はすごいよ。
シェーダープログラミングは次のレベルだね！これらのアニメーションを作るのにどれだけの努力と細部への注意が払われてるか信じられないよ。传统开发に比べて、プロセスがもっと手動で進むんだ。
埋め込みコードにはどんなツール使ってるの？すごく良いよ！フォーカスしてないスニペットが折りたたまれるのが好き。
自分でライブシェーダーエディタを作ったんだけど、CodeMirrorでコードを表示して、WebGLのキャンバスでプレビューしてるんだ。
Processing使った方が簡単な気がする…
Edgeではアニメーションがレンダリングされないけど、Chromeと驚くことにSafariでは動いてる。
自分はEdgeで動いてるよ。macOSとWindowsの両方で。
自分にとっては幸せすぎる、もっとDimension J19 Zeta 7のRickみたい。
Math Rick、ピクルRickの宿敵だね。
あなたには頭が下がるよ、ビックリするほど素晴らしい。
「私はピクルだ、REEE！」
