Shadertoy BETA
Build and Share your best shaders with the world and get Inspired Latest contributions: "Drawing a circle again bruh" by defnixx 22 minutes ago, "RWMusic toolbox" by RoosterWho 57 minutes ago, "Iridescent Spirals" by anej 57 minutes ago, "vortex knot flow field" by Boogaloo 1 hour ago, "Gaussian-ish airglow approx." by FordPerfect 1 hour ago
なんというマニアックな・・・。 ブラウザ上でいわゆるシェーダを作成、共有できるサイトがShadertoyだ。 3DCGでゲームなどを作ってみたい方はここでインスピレーションを得ることもできるだろう。 またその場で作成、プレビューができるので勉強用にも最適だ。 興味がある人は是非チェックしてみてもらいたい。
概要 今年はレイトレ、レイマーチング、レンダリングとシェーダ関連の勉強の優先順位を上げてやっていこうと思ってます。 ということで、色々とShadertoyでごにょごにょ実装中。 まだまだ全然知識不足ですが、色々な作品のコードを読み漁りつつ実装もしていこうかなと。 その中で見つけて、後々使えそうなこととかを細々とまとめていこうと思います。 なので見つけ次第随時更新な感じの記事です。 視点を歪める これを知ったのはこちらの作品を見たときでした。 どういう見た目になるかは以下の動画を見てください。 Menger Sponge Variation ▼ 歪んだ状態 ▼ 通常の状態 だいぶ雰囲気が違うのが分かるかと思います。 さて、これを実現しているのが下記のところです。 // Unit direction ray vector: Note the absence of a divide term.
![[GLSL] Shadertoyのシェーダ芸人になるためのTips集 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/5e2b1d12ef2c2976f07b2fcea4c642f25523638e/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCR0xTTCU1RCUyMFNoYWRlcnRveSVFMyU4MSVBRSVFMyU4MiVCNyVFMyU4MiVBNyVFMyU4MyVCQyVFMyU4MyU4MCVFOCU4QSVCOCVFNCVCQSVCQSVFMyU4MSVBQiVFMyU4MSVBQSVFMyU4MiU4QiVFMyU4MSU5RiVFMyU4MiU4MSVFMyU4MSVBRVRpcHMlRTklOUIlODYmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZzPTJiNGFjY2Q3YzcwMWM5ZGM1NTE2OWRjNzk2ZmFlMGYy%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBlZG9fbTE4JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1lMmQ5MGMxNzhmNTEyNmZmYmVlZTEzOTliMzVmNzRhZA%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D7a292bbb31bab3a90a4d2d3e0a7d5f44)
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy Browse New Sign In Sort: PopularNewestLoveHot Filter: MultipassGPU SoundVRMicrophoneSoundcloudWebcam View: Slideshow No Screenshot Availabe Shader Error Warning Preview by No Screenshot Availabe Shader Error Warning Preview by No Screenshot Availabe Shader Error Warning Preview by No Screenshot Availabe Shader Error Warning Preview by No Screenshot Availabe Shader Error Warning Preview b
楽しいShaderToy
移動しました : https://speakerdeck.com/kumaashi/le-siishadertoy Shaderで遊べる楽しいサイト、ShaderToyを勝手に紹介します。 https://www.shadertoy.com/Read less
Sorry! :-( We either didn't find the page you were looking for, or there was an internal error. If you encounter this problem repeatedly, feel free to send us feedback.
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
モデリング 技術 技術-Technology 三角原型 - 「洋裁CAD（桃CAD）」の開発者である工房奥谷氏による性別体格を... 2024-07-25 『立体裁断アプリ』や『桃CAD（洋裁CAD）』の開発者である工房奥谷（@tomosan119）氏による、性別体格を問わず理論上は補正が不要になる原型型紙製図法「三角原型」の技術論文「3D 人体計測データを基にした適応的なゆとり量の個別型身頃原型の開発」と動画が公開されています。 続きを読む ソフトウェア＆ツール-Software&Tool テクスチャ ソフト Height Lab 1.2.3 Beta - 数式レイヤーを重ねて視覚的にわか... 2024-07-23 Little Dreamer Gamesによる数式レイヤーを重ねて視覚的にわかりやすく確認しながらハイトマップ＆法線マップを生成する専用ツール「Height Lab」がSt
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
シェーダ芸人たちの聖地 Shadertoy にインスパイアされたオンラインシェーダ共有サイト Shaderoo が面白い - WebGL 総本山
独自に拡張されたシェーダエディタ 今回ご紹介するのは、シェーダ芸人たちの聖地 Shadertoy に強く影響を受けながらも、独自の機能などを追加したオンラインシェーダ共有サイト Shaderoo です。 こちらのサイトは、@flockaroo さんが Shadertoy に強く影響を受けて作ったサイトのようで、変数名などもかなり互換性が高い感じになっていますね。 投稿されている作品は、そのほとんどが flockaroo さん自身の手によるものなのですが、これがまた実によくできた作品ばかりでとても刺激的です。Shadertoy の変数名やその意味が把握できている人であれば、ほとんど同じような感覚でソースを読むことができると思います。 OSC に対応するなど独自の拡張が加えられている 今回のサイトは、Shadertoy を信奉するひとからすると、一見まがい物というか妙なパクリサイトみたいに見え
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shader.jp - Shader.jp News : ShaderToy : WebブラウザでGLSLのプレビューができるツール by masafumi
TwitterのTLで知ったのですが，WebGLを使ったShaderToyというWebページがあるようですね． ShaderToy(要WebGL対応ブラウザ) http://www.iquilezles.org/apps/shadertoy/ 機能的にはシンプルですが，RenderMonkeyとかFX Composerのようなシェーダのプレビューがブラウザから出来ますね． クリックすると大きなサイズになります クリックすると大きなサイズになります WebGLに関しては，FireFoxで動かしました．下記から対応版を入手しました． http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-trunk/ 設定は下記のblogを参考にしました． http://d.hatena.ne.jp/nakamura001/20090922
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
Shadertoy
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / % Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool int uint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
https://www.shadertoy.com/view/MtGSWc （※音が出ます） Shadertoy 楽しいデスネ！ 去年(2016)末、javascript でも SiON みたいなソフトウェアシンセを作れないかなと思って GPGPU シンセサイザについて下調べをしていました。その際 Shadertoy が GPU による音生成に対応している事を知り、裏側でどういう処理をしているのか調べていました。 残念ながら、GPGPU シンセサイザは汎用性を持たせるのは難しい、という結論に至ったのですが（この経緯については後日書きたいと思います）、先週 GLSL 作曲入門 という記事が投函され Shader Music が結構注目されているのを見て、せっかく勉強したので乗っかてみることにしました。 どうせならちゃんと描きたい とりあえず簡単な Shader Music を実装しようと思っ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ブラウザ上でシェーダを作成、共有できる『Shadertoy』 | 100SHIKI
[GLSL] Shadertoyのシェーダ芸人になるためのTips集 - Qiita
Browse (1) - Shadertoy BETA
Fractal Cartoon - Shadertoy
Shadertoy - ブラウザ上でリアルタイムシェーダーを構築＆共有出来るサービス！WebGLで美し位く描画されるぞ！
Shadertoy はじめました - Qiita