WebGLの記事一覧プレミアムユーザー限定記事MOONGIFTプレミアムは、月額500円の有料サービスです。WebGLを使った芸術的表現Webブラウザの表現力は年々増しています。CanvasやWebGLによって、表現できる幅が大きく広がりました。使いこなすのは簡単ではありませんが、これまでのWebとは一線を画す表現が可能になります。FantasyはそんなWebGLを使った多彩な表現を集めたソフトウェアです。流体の動きをシミュレーション流体の動きは実に不思議です。そもそも私たちに最も身近である水ですら、とても不思議な特性を持ち合わせています。水の上に水彩絵の具を垂らして、それが広がっていく様子を楽しんだり、紙に写し取ったりして遊んだ経験は誰もがあるのではないでしょうか。Zig製のテトリス最近、あらゆるプログラミング言語でテトリスを作る試みが行われいるのでしょうか。Wikiや掲示板が作られていましたが、テトリスもシンプルなルールですし、ゲームとしてのインタフェースの面白さもあります。今回紹介するTetrisはZigというプログラミング言語を使って作られたテトリスです。軽量版Three.jsThree.jsといえばWebGLを使った高度な表現を可能にするライブラリですが、機能が相当に多く、ファイルサイズも大きいのが難点です。素のWebGLを触るのは相当に難度が高いですが、Three.js経由でも難しいという印象があります。そんな中登場したのがShreeです。WebGLを使って3D文字スライドを作成プレゼンテーションは聴衆の目を引かなければなりません。そのため、ちょっとしたアニメーションであったり、文字サイズの変化など見た目の急激な変更が行われたりします。個人的にはあまり使いませんが、逆に多用する人もいます。今回紹介するSlyeはWebGLを使って派手な3Dテキストとアニメーションを実現するソフトウェアです。WebGL製のMinecraftMinecraftにハマっている人は大勢います。サバイバルで生き残るのはもちろん、クリエイターとして大きなものを作るのも楽しみ方の一つです。難点なのはアプリケーションをインストールしなければならないことでしょう。そこで使ってみたいのがMineCraftWebGLです。WebGLで作られたMinecraftです。WebGLベースのオシロスコープ電気などの波形を見るのに使われるのがオシロスコープです。工学系の方であれば誰もが一度は使ったことがあるのではないでしょうか。ツマミを回して写し出される波形の変化を楽しんだことがあるはずです。そんなオシロスコープをWebGLで再現したのがwoscopeです。WebGLとスクロールを組み合わせたデジタル作品WebGLは普段使っているJavaScriptではなく、OpenGLに近いものになります。そのため、自分のやりたいことを実現するために覚えるべきことがたくさんあります。ゲームなどでも使える技術なので覚える価値があるでしょう。Electron製のWebGL/GLSLエディタWebGLにトライしてみたいと思いつつも、効率的な開発環境を整えたりするのが億劫に感じてしまっている人は多いのではないでしょうか。何かベースがあると、それを編集しながら学習していこうという気にもなるでしょう。editronを紹介します。WebGLを使った迷路ゲームWebの表現力が低いと言われたのはとうに昔で、HTML5によってぐっと向上しています。言え、簡単にできるかと言われるとそうでもないのですが、それでも多くのライブラリやフレームワークによって実現する方法も増えています。今回はWebGLを使った迷路ゲーム、Astrayを紹介します。ブラウザのWebGLバージョンを判定iOSでもWebGLが使えるようになり、デスクトップとスマートフォンでWebGLを使った、より高度な表現が実現できるようになりました。WebGLにもバージョンがあり、バージョンによって実現できる機能差があります。Webブラウザで遊べるMinecraftクローンMinecraftはブロックを積み重ねて世界を創っていくという、レゴ好きにはたまらないゲームです。日々多くの人たちが一生懸命建設に励んでいます。開発者にとっては別な見方もできます。コンセプトがシンプルなだけに同じようなものを自分で作ってみたいと思えるのです。GPUを使ったアニメーションライブラリWebブラウザ上で3Dをぐりぐりと動かすようなアニメーションを作る場合、WebGLを使うのは基本として、処理においてもGPUを使う方が効率的になります。いえ、GPUを使ってどう処理を行えば良いのか分からないことでしょうそこで使ってみたいのがGPU対応のライブラリです。今回のテーマはWebGLです。HTML5が普及し、その中でWebGLも使いやすくなってきました。iOS9でもWebGLがサポートされたこともあって、スマートフォンでもWebGLコンテンツが普及しはじめています。今回はそんなWebGLの使われ方と、関連オープンソース・ソフトウェアを紹介します。WebGLを使ったスライドショーWeb上で写真やスライドを切り替えるスライドショーは数多くあります。その多くはCSS3を使ったアニメーションで切り替えるものが多いかと思います。高度なエフェクトを実装したいと思ったことはないでしょうか。今回はWebGLを使ったスライドショーアプリケーション、GLSlideshow.jsを紹介します。多彩な機能をもったWebGLエンジンWebの進化によって、今後はますますリッチなUIに注目が集まっていくでしょう。その一つとして3Dが考えられます。し3Dを担っている技術といえばWebGLになります。Engineを使うことで3Dコンテンツが開発しやすくなるかもしれません。SCMLを使ったJavaScriptアニメーションライブラリアクションゲームの要とも言えるのがキャラクターの動きです。3Dゲームとなると60fpsで動くようなレベルで求められるでしょうが、2Dにおいてもそこまでいかなくとも多彩な動きが求められるはずです。今回はそんな2Dキャラクターのアニメーションをサポートするライブラリ、Spriterを紹介します。Voxelを使ったWebGLゲームVoxelと言えばMinecraftが有名です。Minecraftはモノを作ったり、他のプレイヤーと争ったりすることはできますが、ルールは基本的に存在しません。ユーザにすべてが委ねられていると言えるでしょう。そんなVoxelを使ってゲームを開発しているのがVoxLordsです。写真は撮影する機材も大切ですが、その後の閲覧方法も考えなければなりません。一枚の写真であれば額に入れれば良いですが、最近の全天球カメラのような写真はコンピュータを使わなければ楽しめないでしょう。そこで今回はパノラマ写真を楽しめるPannellumを紹介します。Three.jsコンテンツを編集できるChrome機能拡張WebGLはWebという冠はついているものの、HTMLやJavaScriptとは全く異なる言語となっています。そのため、素のWebGLを扱うのはとても面倒であり、ラッピングしたライブラリを使うことが多いようです。その中で最も有名なのはThree.jsでしょう。${article.post_date_view}${article.post_title}${article.except_content}プレミアムでしか読めない記事が730あります。blockworks。