スマホブラウザでも見れる!webGL用に適当に作った3Dモデルを表示した際のメモ

だいぶ久しぶりに更新になります。
プライベートでも仕事でも言い意味でも悪い意味でも大変な事あったこの頃です!!

今回久々に興味をもったWebGLをちょっと触ってみました。
といってもthree.jsというめちゃくちゃ便利なjavascriptを利用して、3Dモデリングツールを使ってつくった何かわからんウニみたいなものを表示するサンプルです。

ちなみになんど自分が持っている結構古いAndroid2.3の標準ブラウザでも動作しました!
スマホすご!

↓↓↓

WebGL3Dモデルくるくる
※本サンプルはwebGLを利用しているので、chromeブラウザ推奨です!

 

3Dモデル

 

three.js
https://github.com/mrdoob/three.js/

 

追記:

上記デモの端末キャプチャ
Xperia acro(AU)
Android OS:2.3.4 
標準ブラウザ


 

ブラウザ上で動くWEBGLを使った3Dの世界

ネットサーフィン中にいいもの見つけたのでピックアップ!
WebGLを使ったブラウザ上で人が動く3Dの世界

http://webcraft.vertinode.nl/

http://webcraft.vertinode.nl/

上記URLより見れます!(chrome推奨かと)

a/w/s/d で移動
spaceでジャンプなどできます。
またマウスで視点を替えたり、ブロックを消したり、選んだりできましたw

最近はgoogle先生のMapsGLなどWebGlを使ったサービスを良く目にするようになったので、
今後他のブラウザもwebGLをブラウザに標準装備していってほしいです!

 

webGLを使った刻々と変化する3Dアニメーションがすごい!

いいもの見つけたので、久々の更新w!
WEBGLを利用した刻々と変化する3Dアニメーション!すごすぎ!

ウェブGL

lights.elliegoulding.com

http://lights.elliegoulding.com/
上記から見れます!Chromeブラウザ推奨かと!
※音楽が流れます

めちゃくちゃリアルなWEBGLを使った車にインスパイアされました!

webglもここまできたかというぐらいチョーリアルな3Dカーが、
ブラウザ上でぐいぐい動きます!!
※十字キーでオレンジカーを操作可能、後ろの白いカーもw/a/s/dで操作できます。 

↓↓↓

3dcar

 このリアルさ半端ないです、blurを使った遠近間や、反射の光具合など、、、
すごすぎます!

ちなみにnキーを押すとナイトモードに切り替わり!12345キーで視点を切り替えられます!

↓↓↓

webgl_car2

下記から見れます!これ作った人ホントすごい!(chrome推奨かと)

http://alteredqualia.com/three/examples/webgl_cars.html

こりゃすごい!まるで3D映画のようなwebGL!

WebGLを使った、まるで3D映画をみているような迫力にインスパイアされました!!

とにかく見た方がいいです↓
※クロムブラウザ推奨かと

webgl恐竜http://alteredqualia.com/three/examples/webgl_trex.html

 

その2!ランボルギーニや、フェラーリもピカピカです!↓

webglhttp://mrdoob.github.com/three.js/examples/webgl_materials_cars.html