サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
In the world of modern portable devices,it may be hard to believe that merely a few decades ago the most convenient way to keep track of time was a mechanical watch. Unlike their quartz and smart siblings, mechanical watches can run without using any batteries or other electronic components. Over the course of this article I’ll explain the workings of the mechanism seen in the demonstration below
In this tutorial we’ll discuss the ideas and concepts behind rendering water and then talk through some demo code. By the end of this tutorial you should walk away with agood sense of how water is rendered as well as a reference implementation to serve as a jumping off point should you decide to dive into more complex water renderingtechniques. The full source code for the demo can be found on G
WebGLを扱う際には行列計算というのがどうしても必要になってきます。だいたいは既存のライブラリを使ってなんとかしたりするのですが、現状あまり選択肢は多くありません。そこで新しいライブラリであるMatrixGLを作って公開しました。 経緯 私はたまにWebGLをいじるのですが、やっぱりどうしても行列計算が面倒です。WebGL用の行列計算ライブラリというと、glMatrixという有名なライブラリがあるのですが、昔ながらのC言語的なAPIで、どうしてもJavaScriptでは使いにくく感じていました。OpenGL自体とは相性いいAPIだとは思うんですけどね。 「まあ誰かがそのうちJavaScript的な使いやすいの作ってくれるだろう」とずーーーーっと待っていたのですが、待てど暮らせど全く出てこないという状況でした。みんなglMatrixで満足してるのか、それかThree.jsとか使ってるから特
“テクニカルクリエイター” それは一人多才なクリエイター。 彼らが創り出す、 新しい時代のクリエイティブに迫る。 Scroll Down
ステンシルバッファ（マスク処理）にシェーダー適用して、部分的にモザイクさせてみました。 Live2D WebGL版と合わせるとこんな感じにできます♪ （エロゲー用の素材を持っていないので公式サンプルでテスト） ・Live2Dで部分モザイクデモ 上記デモページでは、モーション切替とモザイク箇所の切替ができます。 モザイクは一部の描画オブジェクトごとにかけられるように実装しています。 そのため、描画オブジェクトが動くとモザイク部分も動きますっ！ WebGLの技術としては、以下のものを使いました。 １）モザイクシェーダー ２）ステンシルバッファ ３）フレームバッファ ４）Live2DのWebGL描画 開発環境 ・Live2D WebGL SDK 2.0.04_1 ・SDKのSimpleプロジェクトをカスタム モザイクシェーダー部分の実装 モザイクシェーダーは以下の記事を参考にさせていただきました
Keep Out! An action-packed adventure playable for free in your browser. Explore the dungeon, fight monsters and unlock epic weapons!
序文 リックテレコムより出版の「明解 WebGL」内で参照しているオンラインサンプルの一覧です。 WebGL 学習に役立ててください。 オンラインサンプル一覧 第3章 03_01.最小構成のWebGLプログラム 03_02.三角形をWebGLで描く 03_03.三角形を変形させる 03_04.複数の三角形を描く 第4章 04_01.関数化して効率よく記述する 04_02.行列による座標変換 04_03.行列による座標変換（回転） 04_04.アニメーション付きで回転させる 第6章 06_01.立体モデル（球体）を描画する 06_02.インデックスバッファを用いた描画 06_03.頂点色で着色して描画する 06_04.深度テストを有効化する 06_05.拡散光によるライティング 06_06.拡散光によるライティングをフラグメントシェーダで行う 06_07.反射光によるライティング 06_08
WebGL is no longer atechnology exclusive to big projects containing 3D scenes, storytelling-based narratives and complicated visual effects,it’s been with us for a few years andits use today has now been extended to secondary elements in the composition and small effects with filters (shaders) that can’t be replicated withjavascript orCSS outside the canvas. There are libraries to make the im
This help only covers the parts of GLSL ES that are relevant for Shadertoy. For the complete specification please have a look at GLSL ES specification Language: Version: WebGL 2.0 Arithmetic: ( ) + - ! * / %Logical/Relatonal: ~ < > <= >= == != && || Bit Operators: & ^ | << >> Comments: // /* */ Types: void bool intuint float vec2 vec3 vec4 bvec2 bvec3 bvec4 ivec2 ivec3 ivec4 uvec2 uvec3 uvec4 ma
はじめにUnity の WebGL では現状ではネットワーク機能に制約がありますが、WebSocket は使えるようです。 (English) On the future of Web publishing inUnity –UnityBlog 以前の記事では外側のJavaScript で Socket.IO を通じて通信した内容を用いましたが、これだとビルドしてから色々と確認しなければならず大変でした。Unity 5 x WebGL について詳しく調べてみた - 凹みTips そこで、WebSocket 機能の利用方法について調べてみました。 WebSockets.unitypackage のダウンロードUnity5 Beta : WebGL +Unity WebSockets plug-in |Unity Community 上記スレッドより、WebSockets.u
はじめに本エントリはUnity Advent Calendar 2014 8日目の記事になります。Unity 5 からはBuild ターゲットに WebGL が追加されます。Unity 5 プリオーダ向けベータ版で現在試すことが出来ます。Unity 2020.2b -Unity 今年の 3/18 に行われた GDC2014 でUnity 5 が発表されたタイミングで WebGL 対応が発表されました。日本でも 4/7、8 で行われた Unite 2014 においても WebGL についての講演があり、その動画や講演資料を公式サイトから閲覧することが出来ます。 http://japan.unity3d.com/blog/press/unity5 http://japan.unity3d.com/unite/unite2014/scheduleUnity と Web デプロイメ
今日のテーマ WebGL高速化のススメ 今回はあくまでも WebGL 特有の高速化 TIPS です。 WebGL にあまりなじみのない方もいらっしゃると思うので…… そもそも WebGL って？ というところから簡単に解説します。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
