Web ブラウザで動くとは思えない、凄い WebGL デモ・アプリ 65 個 - WebOS Goodies
今月の 22 日に GTUG Girls のイベントで WebGL (Three.js) のハンズオンをやります。内容は初心者向けで、簡単な物体を表示してみたりして Three.js の基礎を学ぼうというものです。女性限定ですが、興味のある方はぜひご参加ください。 【告知】第10回GTUG Girls Meetup 「キラリとひかるモノ作り！WebGL(Three.js)入門編」 募集開始！ で、本日は宣伝も兼ねて WebGL を使ったデモやアプリケーションのまとめエントリを書いてみました。いずれも Web ブラウザで動くとは思えないほどインパクトのあるものばかり。 WebGL 対応のブラウザで（Chrome か Firefox の最新版が無難です）、おもいっきり堪能しちゃってください！ 長編デモ 音楽に合わせてインパクトのある映像を展開していく、ちょっとしたストーリー性のあるデモなどを集
Raytraced Water Simulation (WebGL) | Geeks3D
Update (2011.08.22): the latest update of Firefox 6 supports now the OES_texture_float extension. Here is a cool WebGL demo that shows a water simulation with raytraced reflections and refraction. Currently this WebGL demo works only on Chrome because it requires the OES_texture_float WebGL extension. Fortunately for Firefox users (Firefox prior to 6 or other browsers that do not support the exten
Google I/O の WebGL セッションが素晴らしいのでハイライトを紹介してみる - WebOS Goodies
今週はみんな Google I/O に気を取られているだろうから、ブログの更新はサボろうかな…と思っていたのですが、なんとなく動画を見てみた WebGL セッションの内容があまりに素晴らしかったので、ハイライトをご紹介することにしました。 WebGL を活用するためのテクニックやパフォーマンス Tips などが解説されていて、 WebGL に関わっている方は必見です。また、けっこう見栄えの良いデモがいろいろ出てくるので、「WebGL ってなに？」という方でも楽しく見れると思います。 とはいえ、解説されている内容をきちんと理解するには WebGL の基礎知識が必須です。もしセッションを見て興味を持たれたら、こちらの記事もぜひご参照くださいませ。 前半は処理を GPU へ移行してパフォーマンス改善する例 最初にまず WebGL の基本概念を説明。その後、円や立方体などのオブジェクトをアニメーシ
Learning WebGLで学ぶWebGL入門
8. HTML <body onload="webGLStart();"> <a href="http://learningwebgl.com/blog/?p=28"><< Back to Lesson 1</a><br /> <canvas id="lesson01-canvas" style="border: none;" width="500" height="500"></canvas> <br/> <a href="http://learningwebgl.com/blog/?p=28"><< Back to Lesson 1</a><br /> </body> 9. HTML <body onload="webGLStart();"> <a href="http://learningwebgl.com/blog/?p=28"><< Back
WebGL Specification
Version 1.0.3, 27 October 2014 This version: https://www.khronos.org/registry/webgl/specs/1.0.3/ WebIDL: https://www.khronos.org/registry/webgl/specs/1.0.3/webgl.idl Latest version: https://www.khronos.org/registry/webgl/specs/latest/1.0/ WebIDL: https://www.khronos.org/registry/webgl/specs/latest/1.0/webgl.idl Previous version: https://www.khronos.org/registry/webgl/specs/1.0.2/ WebIDL: https://w
WebGL の描画結果を HTML に正しく合成する方法 - WebOS Goodies
WebOS Goodies へようこそ！ WebOS はインターネットの未来形。あらゆる Web サイトが繋がり、共有し、協力して創り上げる、ひとつの巨大な情報システムです。そこでは、あらゆる情報がネットワーク上に蓄積され、我々はいつでも、どこからでも、多彩なデバイスを使ってそれらにアクセスできます。 WebOS Goodies は、さまざまな情報提供やツール開発を通して、そんな世界の実現に少しでも貢献するべく活動していきます。 先日、最速チュパカブラ研究会さんのこちらの記事で、 WebGL で描画した半透明オブジェクトを HTML に重ねるとおかしな結果になることが報告されていました（同時にクールなデモも公開されているので、必見です）。この問題、実は私も以前にハマったことがあって、一応解決策も見つけました。 Render To Texture による 2 パスレンダリングでも必要になる、
WebGL勉強会 第5回で発表して来ました - 強火で進め
WebGL勉強会 第5回(http://atnd.org/events/11693)で発表してきました。 タイトルは「Learning WebGLで学ぶWebGL入門」です。Learning WebGLのLesson 1を解説しながらWebGLを勉強して行く内容と成っています。 WebGLをこれから勉強する方のとっかかりに成る様に意識して作成したので、発表向けというより授業向けに近い内容と成っています。これからWebGLを勉強する人の参考になりましたら幸いです。 Learning WebGLで学ぶWebGL入門View more presentations from nakamura001. (2011/02/18 追記) 補足、書きました。 「Learning WebGLで学ぶWebGL入門」の補足 - 強火で進め http://d.hatena.ne.jp/nakamura001/20
WebGL Inspector
About WebGL Inspector is a tool inspired by gDEBugger and PIX with the goal of making the development of advanced WebGL applications easier. What Firebug and Developer Tools are to HTML/JS, WebGL Inspector is to WebGL. Note: this is alpha software - if you find bugs, let me know (or better yet, fork and fix them! :) Check out the readme on github for more information. Status There hasn't been an u
OpenGLなにそれうまいの?? という人のためのWebGLの始め方 - hagino3000's blog
追記：例題の頂点シェーダーで何をしているか説明を追加しました 追記：動作環境の所修正しました、IE9では動作しません。 皆さんはじめまして、荒川智則です。この記事はJavaScript Advent Calendarの21日目です。 この記事では、Google I/OやFirefox Developers Conferenceで華麗なデモがバリバリ出てくるにもかかわらず、実際に使っている人が異常なまでに少ないWebGLについて書きます。対象読者はWebGLに興味があるor手を出してみたけどクソ難しそうだし既に諦めそう、という人です。 WebGLの概要 WebGLはOpenGL ES 2.0のグラフィックAPIをCanvas要素上で使える様にした物です。OpenGL ESはOpenGLの組み込み機器向けのサブセットで、iPhoneやandroid端末にも搭載されています。OpenGL ESな
WebGLの開発環境を構築する！Chrome編 - WebGL研究部
少し遅くなりましたが、ウェブブラウザ「Google Chrome」のWebGL開発環境の構築をしたいと思います。 Google Chromeは、Googleが提供するウェブブラウザでSafariや Lunascape、Androidで使われるHTMLレンダリングエンジン「WebKit」をもとに作られているものです。 WebOS（Google Chrome OS）のコアとなる部分でもありWebGLにとって有力なものだと思っています。 今回WebGLを使用するにあたり、リリース版「Chrome」ではなく、 開発中のウェブブラウザ「Chromium」を使っていきたいと思います。 （リリース版でも一応動作可能） ☆導入と設定方法☆ １．開発用のブラウザ「Chromium」の最新版をここからダウンロードする。（.zip） ＞Mac OS X版 ＞Linux版 ２．ダウンロードが終了したら、
GLGE WebGL Library/Framework
What is GLGE? GLGE is a javascript library intended to ease the use of WebGL; which is basically a native browser javascript API giving direct access to openGL ES2, allowing for the use of hardware accelerated 2D/3D applications without having to download any plugins. The aim of GLGE is to mask the involved nature of WebGL from the web developer, who can then spend his/her time creating richer con
JavaScript でリアルタイム 3DCG を実現する WebGL の使い方 - WebOS Goodies
先日、ちょっとした思いつきで WebKit の Nightly Build をインストールし、 WebGL を試してみました。 WebGL というのは現在策定中の新しい規格で、 JavaScript を使って本格的な 3DCG を実現する API です。同じ目的を持つものとして Google の O3D がありますが、 WebGL は OpenGL ES を管理している Khronos グループを中心に Google, Mozilla, Opera, NVIDIA, AMD といった企業が参画しており、標準化という面ではリードしています。 まだ策定中の規格なので今後変化するかもしれませんが（WebGL 1.0 が正式リリースされました）、少なくとも現状の WebKit の実装については使い方がわかったので、本日はそれをご紹介します。 WebGL は Web 上の最も重要なグラフィックス A
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WebGL Inspector 1.9 Released | Geeks3D
Visualizing Webpages in 3D with Tilt (WebGL) | Geeks3D
blender-webgl-exporter - Project Hosting on Google Code
Body Browser - Google Labs
西川善司の3Dゲームファンのための「OpenGL4.0+WebGL」講座 OpenGL4.0とWebGLが発表。Windows XP環境、MacOS、LinuxでDirectX 11世代テクノロジーを使う方法 HTMLでシェーダーグラフィックスを書く方法
Sign in - Google Accounts
http://www.bgler.net/
DeNA Engineering - DeNAエンジニアのポータルサイト
