webgl and javascript

WebGL と javascript に関するニュースやトピックまとめ ※当ブログは1記事作成5分以内を目安に更新する仕様です

2014-04-01から1ヶ月間の記事一覧

水面をシュミレートした WebGL デモ

4real - Liquid Demo ちょっと重いのが難点。 静止画だとすごくキレイなんだけど、動いているのを見るともう少し最適化できそうな気もする。

あえてローポリゴンでハイクオリティなシーンを演出

Creating the Low-Poly Look in WebGL | Truth Labs Blog 海外のブログ記事なんだけど、なんとなく言いたいことは英語がわからなくても伝わってくる。 Three.js を使って説明している。

GLSL のコードを最適化する Minifier for GLSL

GLSL Compiler いろいろと未検証だけど、恐らくそれなりに使えるような気がする。 今度ためしてみよう。

GLSL のビルトイン関数などの解説が見れる貴重なサイト

Shaderific - GLSL こういうのはすごく助かりますね。 基本的な予約語やビルトイン関数がほぼ網羅されていると思います。英語ですけど。

お好きなようにカスタマイズ? ローカルファイルをテクスチャに適用も可能な「俺コントローラー」

俺コントローラー @kenji_clown5 さんがテスト用に開発したという俺コントローラ。 せっかくなので、あたしの面をテクスチャに適用してみたんだけど気持ち悪いことこの上ないですな。www

WebGL + Node.js + WebSocket なオンライン対戦も可能なエアホッケーゲーム

4irpucks 操作がカーソルキーなので、慣れないと結構きつい……(笑) ただオンライン対戦ができるというのは、やっぱり面白い。

画像を不思議なドット模様に変換して 3D 表示する Depth data viewer

Depth data viewer すごいなあこれ。 写真をアップロードするとリアルタイムに変換してくれるっぽいことが書いてある。 やってみたいけど、どうやら Depth データを持つものでないと無理っぽい。 当り前かw

シンプルで洗練されたインターフェイスの WebGL のサウンドビジュアライザ

George & Jonathan III 見た目が非常に洗練されていると感じる。 プリセットで用意されている曲も多いし、場合によっては演出方法が変化するみたいで楽しい。

寂しがり屋な謎の生物……いったいどうしろというんだ……

Lil' ThooLoo (powered by Matt Ostgard and Verold 正直なところ、なにをどうしてあげたらいいのかよくわからない。 とりあえずう○ちを掃除してやるくらいしかすることがない…… 歌っている様子は……見方によってはかわいらしいかも……しれない。

3D のボードゲームが大量に! どれもクオリティが高く対戦機能も

Jocly games | Jocly これはそうとう気合が入ってるな。 画面サイズに応じて UI が動的に動くなど、ユーザービリティもしっかり考慮している印象がある。 いろんな種類のゲームがあるようなので、徘徊するだけでも楽しそうだ。

WebGL で二次元画像にポストエフェクト的に被写界深度を適用する

WebGL Focus and DOF viewer for Google's Lens Blur images レンズブラーを再現する WebGL のデモプログラム。 いわゆる被写界深度的な効果が得られ、フォーカスする場所はマウスでインタラクティブに変更可能。

オンラインでマップデータをロードして空からの様子を再現する

A 3D Panorama of Every City at CityFlyBy.com 世界中のどこでもというわけにはいかないみたいだけど、見た感じアメリカはほぼ網羅してるのかな。 旅行が好きだという管理人が、旅行気分を味わいたい気持ちもあって作ったものみたい。 そういう超個人的理由…

Twitter API と連携したプロモーションデモ

TakeTheThrone これはよくできてるな。 幻想的な雰囲気が見事な演出になってる。

スフィア環境マッピングを Three.js で実現したサンプルデモンストレーション

Spherical Environment Mapping - Blog - Clicktorelease Three.js を利用したスフィアマッピングの実装についての解説。 実際に動作させることも可能なデモサンプルへのリンクもあり、Three.js を使っている人には有用な情報となりそう。

そこは思い出たちのたどり着く場所 素晴らしいコンテンツ

I Remember 地面のように見える部分は、小さな光の点の集合体。 その小さな点のひとつひとつに近寄っていくと、それが誰かの投稿した思い出の一枚であることがわかる。 もちろん投稿することもできる。すばらしいなあ、これ。

良質なサンプルが大量に! かなり参考になるのでは

3dflashlo | 3D FLASH LABS さまざまなサンプルが公開されていて、非常に有用。 見た目の美しさはやっぱり大事ですね。

レイマーチングなどのシェーダサンプルが豊富

www.kevs3d.co.uk/dev/shaders/ WebGL + GLSL でシェーダをうまく活用したサンプルがいくつかある。 非常に素晴らしいのだけど、それぞれのサンプルの負荷はそれなりにあるため閲覧には注意。

誰かやるだろうとは思ってました……三次元 2048

Brain fucking game — Alexander Taran だれかやるだろうとは思ってました。 欲張って 3D にとどまらず、もっと上の次元まであるんだけどよくわかんないw

WebGL で実現されたボリュームレンダリング

Real-Time Interactive Visualization of Volumetric Data with WebGL WebGL によるボリュームレンダリングの実装。 あんまりボリュームレンダリングについては詳しくないんだけど、要は中身が空洞になる通常のポリゴンレンダリングとは異なり、表面だけでな…

たぶん個人サイトなんだろうけどすごい完成度

MY/STATIC/SELF もういろいろすごい。 こういうことを個人でドーンとやってしまうところが、なんとなくすごいなあ。 個人的には、自分でやることを考えた時にはどうしても動作環境限定されるしなあとか思ってためらってしまう。 しかし、すばらしい。

オンラインで編集可能で iframe による埋め込みにも対応 CL3VER

CL3VER | Interactive 3D for Architecture デザインが凝ってる。 動作はかなりスムーズだ。モデルデータのインポートから、オンラインで編集作業までカバー。けっこうよさげ。

WebGL で作られたディティールも美しいデモンストレーション

Laboratory output n°90 FlayForGood (APEXvj2.5) ソースを見る限り Three.js は使ってないみたい。 メッシュが裂けるような演出が多用されている。

three.js を用いた音と映像の融合が見せる秀逸デモ

H O N E Y 不思議で幻想的な世界観を連想させるデモンストレーション。 ちょっとロードに時間が掛かるかもしれないけども、みごたえはある。

HTML5 全般を扱っている omiod.com には WebGL 製デモも

Omiod HTML5 関連の技術をたくさん紹介している Omiod.com。 先日も、新しい WebGL を使ったデモが追加されていましたのでご紹介。

GoogleMap のデータから地形を 3D 化

Cell Industries 天気やなんかも出てるけど、リアルタイムなのかな…… 時差があるっぽくてわからんw

Mac や iphone、ブックカバーなどを 3D モデルで生成できる MODAL

MODAL | Create, Search, Shared and more. これは WebGL の黎明期らしさを感じるウェブサービス。 非常によくできてる印象。 動画を見る限りではかなり柔軟なこともできるみたいだな。こういうツールがぽんぽん出てくるようになったら、いよいよ黎明期も過…

リッチなUIで隅から隅まで美しい FishGL

FishGL もうご覧になった方も多いのでは。 水槽の中に入った視線でも見ることができる秀逸な WebGL デモ。 個人的にはその UI がちゃんと作られている点がすばらしいと思う。

映画の告知サイトは全力 WebGL で作られていた!

Find Your Way to Oz これはかなり気合を感じる。 いくつかのシーンを自由に移動することができる。 上の画像にある気球に乗ることも可能で、竜巻に飲み込まれないように逃げるといった動きのあるコンテンツとしても楽しめる。 竜巻から逃げるシーンでは、ス…

NIKE が仕掛ける WebGL デモ

Genealogy of Nike Free NIKE のキャンペーンサイト。 こういう先進的な試みは、いかにも NIKE らしい感じがする。

秀逸なデモがいっぱいなライブラリの紹介ページ

PhiloGL: A WebGL Framework for Data Visualization じっくりは見てないけど、どれもよさそう。 どうやら、OpenGL に極力近い形で WebGL を扱えることを目指しているみたい。デモを見る限りはかなり腕の立つ人が作っていそうな印象。