Scroll

「常に新しい技術に目を向けること」
「既存の技術をより深堀りすること」

カテゴリ:未分類
タグ:
公開日:2020/11/02(月)

WebGL – hydra editor

みっきーです。
ブラウザの技術進化に追随すべく、WebGLを調べてみました。

WebGLは、ブラウザでプラグインを使用することなく3Dグラフィックスを描画するための仕様です。
WebGLを効果的に使うと、webサイトの表現が向上しそうです。

WebGLプログラムの解説は今後実施していきますが、今回は、WebGLを使った面白いサービスを紹介します。
hydra editor です。

hydra editor はブラウザでコードを書いてリアルタイムにビジュアルを作るために作られたもので、
内部的にNode.jsで記述されWebGLが使われています。
ブラウザに記載するコード自体はJavascriptの構文で、割と簡単に試せると思います。

これだけのコードで、なんだかすごいビジュアルが。

WebGLを使わず、JavaScriptだけでこの視覚効果は無理ですよね。外部のJavaScriptライブラリを使ったとしても難しいと思います。

以下のドキュメントがわかりやすいです。
https://hydra-book.naotohieda.com

よろしければ試してみてください。

この記事を書いた人:みっきー

シェアのご協力をお願いいたします!

カテゴリー

アーカイブ