リッチで使いやすいインターフェースとタイムラインなどの便利な機能が盛りだくさん！ smoothstep.io がすごい
本格的な GLSL エディタが登場
今回ご紹介するのは、Matt Henderson さんが公開している smoothstep.io という GLSL エディタです。
こちらのエディタは Shadertoy をベースにしたコーディングスタイルを採用したブラウザで動作する GLSL 用のエディタになっていて、リッチで使いやすい様々なユーザーインタフェースが用意されていることが特徴です。
特に、タイムラインの仕組みがかなり洗練されていて使いやすく、本格的なシェーダ作品の作成に役立ちそうです。
リンク：
ドキュメントやチュートリアルも充実で素晴らしい
今回のサイトは、いわゆるエディタアプリケーションなので Shadertoy のように SNS 的な側面は基本的に持ち合わせていません。
ただ、Google アカウントを利用したログインの仕組みに対応していて、個人の作品をクラウドに保存しておくことは可能なようですね。
それらに加え、作成した作品の各種エクスポート等の機能もあり、全体的にめちゃくちゃ作り込まれていますね。
１つのアプリケーションとしての完成度が高い次元に達しており、そのデザイン性の高い外見も相まってすごくレベルの高いアプリケーションになっています。
ご覧のように、エディタ部分が左側にあり、右側にはプレビューエリアが設けられています。
また、画面の下側にはタイムラインが用意されていて、これを利用して時間の経過に応じた値の変化を自由に設定・定義することができます。かなり直感的に操作することができるので、この手のタイムライン系のインターフェースを使ったことがある人なら迷うことなく使うことができるんじゃないでしょうか。
さらに、エディタ部分にもいろいろと機能が盛り込まれており……
特定のキーワード等に対するサジェスト機能はもちろん、ベクトル型のデータや浮動小数点型のデータに対してはオリジナルのコントローラが表示されます。
とてもリッチなエディタ環境を提供してくれていますね。
ちょっとわかりにくいですが、左側にメジャーのような浮動小数点の値を変更できる GUI が表示されています。これは浮動小数点の値がある場所にキャレット（カーソル）を置くと自動的に表示されます。
また、冒頭でも書いたとおりで書いたシェーダのグラフィックスを、静止画、動画、連番 PNG 等で任意にエクスポートできる他、テクスチャ用のリソースのアップロードにももちろん対応。
デフォルトで用意されているノイズ等の画像も便利ですし、本当に機能が多彩でめちゃくちゃよく考えて作られていますね。
スロットの数から見て、おそらく８つのテクスチャを同時にバインドできるようになっているんだと思います。
GLSL をブラウザ上で扱うことができるエディタは無数にありますが……
どのアプリやサービスも、それぞれになにかしらの特徴や機能を持っていることが多いです。
ただ今回紹介した smoothstep.io の場合はかなり機能が豊富で、そのリッチなインタフェースそのものがこのウェブアプリケーションの特徴、と言えるかもしれません。
デザインも今風の感じでおしゃれですし、リッチインターフェースを備えた GLSL エディタとしての完成度は随一ではないでしょうか。
タイムラインなど本当に使いやすく、こういったアプリケーションを自分で開発してみたいという方にとってはものすごく参考にできる事例だと思います。ドキュメントも充実していますし、本当にすごいです……
ぜひチェックしてみてください。
