VRM は Unity 専用じゃない！ブラウザで VRM 表示出来るものを作りました！ | VirtualCast Blog
ザ・シードオンライン には、 glTF 規格の拡張である VR 利用想定のヒューマノイドモデル拡張の VRM 及び、 VirtualCast 上でインタラクティブなアイテムを自由に作成出来る VCI をアップロードすることが出来ます。 以前はそれらのファイルをブラウザ上で閲覧するのに、 Unity の WebGL ビルドを用いていました。 しかし、2019年5月現在の Unity の WebGL ビルド(と Web Assembly)は、数 MB のランタイムのダウンロードと、起動処理に数秒かかるなどの難点が存在していて、ネイティブ(JavaScript)実装に置き換えたいという要望が出ていました。一部端末で正常に表示出来ないという問題もあります。 そこで、私山岸の調査の結果、 babylon.js を採用し、自前で VRM/VCI を出来るだけ正しく porting するプロジェクトを稼
えもふり - E-mote Free Movie Maker
皆の2DキャラクターをTwitter、pixiv、GIFMAGAZINEとかでぬるぬる動かしちゃおう！WebGL、ティラノスクリプト、Unityや宴にも対応！ えもふりって？ E-mote Free Movie Maker(以下えもふり)は、 絵師さんの「もっと簡単にキャラクターを動かしたい！」 動画制作者さんの「設定なんて面倒なことしたくない！3秒で動かしたい！」 っていう、皆からの強い要望にお応えするために 『E-moteよりも簡単に、楽しく、ぬるぬる動くキャラクターを作る』 ことを目的として開発された、新しい形のE-moteだよ！ ・えもふりSDKは、無保証です。個人および同人目的の利用に限り、法人の商用利用はお断りします。 ・えもふりSDKには、キャラ表示の前にE-moteロゴを再生しないといけない制限があります（ロゴを再生するまでキャラが常にモノクロ表示されます）。 何ができるの
超お手軽VR開発フレームワーク A-FRAME入門：第１回 - roman-tech
本シリーズでは最近話題のバーチャルリアリティ開発フレームワークであるA-FRAMEの使い方について記載します。筆者も特に詳しいわけではなくこれから勉強しながら執筆していくので一緒に学んでいきましょう。参考URLは以下の本家サイトです。 aframe.io 本記事で学べること A-FRAMEの概要を知る 基本的な使い方を知る 必要なスキル 軽くhtml5とjavascriptはかじっておくといいかもしれません。 ただ、結構気軽に開発できるので初心者の人でも言語を学びながらやっていけると思います。 A-FRAME概要 A-FRAMEはwebブラウザ上で動作する3Dとバーチャルリアリティ開発のためのオープンソースフレームワークです。これまで、ブラウザ上で3D空間を表現するにはwegGLという非常に難解なライブラリを使いこなす必要がありハードルが高すぎました。大学でopenGL(1.0)を使ってい
A-Frame – Building Blocks for the VR Web
Subscribe to get updates on A-Frame and our VR projects! Subscribe
Live2DのWebGL版は今週公開 - Qiita
WebGL Advent Calendar 2014の15日目の記事になります。 Live2Dとは？ 1枚の2Dイラストからぬるぬる動かす技術です。 2Dと3Dの間にある技術のため、2.5Dとも言われています。 WebGL-β版は今週公開予定です 遅くなってすいませんが、今週中には公開されます。 以下の内容は、公開に先行した内容となっていますのでご注意下さい。 Live2DのソフトとSDKは無料で使う事ができます。 実際に触ってみたい方は以下のページにアクセスしてみて下さい。 WebGL対応でiPhoneのブラウザでもLive2Dアプリ！ WebGLでLive2Dモデルを表示 １）まずはLive2DのSDKをダウンロード Live2Dのサイトにいき、CubismSDK(WebGL)をダウンロードしてきます。 ２）Webサーバを準備する 今回は簡単にWebサーバが起動できる無料エディタ Br
WebGLStudio
3D Development environment for the web. WebGLStudio (formerly known as WebGLStudio) is a platform to create interactive 3D scenes directly from the browser. It allows to edit the scene visually, code your behaviours, edit the shaders, and all directly from within the app. Try WebGLStudio.js Example Source on GitHub Documentation Learn or you can use the latest version (more features and more bugs)
Babylon.js で WebGL プログラミングしたら、 Unity, MMD モデルの変換で苦労した話 - Qiita
Babylon.js で WebGL プログラミングしたら、 Unity, MMD モデルの変換で苦労した話JavaScriptWebGLTypeScriptBabylon.js WebGL ライブラリの Babylon.js を使って、ゲームを作ってみました。 初音ミクを使った簡単な迷路ゲームです。クリアするとミクちゃんが勝利の舞い (※) を踊ってくれます。 ※ 最後に詳述しますが、残念ながら端末によっては、ミクにアニメーションがつきません。 こちらからご覧になれます。 http://miku-miku-maze.herokuapp.com ソースはこちら。 https://github.com/kimamula/miku-miku-maze TL;DR 書いてみたらダラダラ長くなってしまったので最初にまとめを。 WebGL 用のモデルは、そのライブラリ向けに提供された素材か、チュート
Herlock.js for HTML5 - JavaScriptで高パフォーマンスなゲームを開発できるHerlockのブラウザ版 MOONGIFT
iOS/Androidアプリをワンソースで…というのは誰しもが夢見ることではないでしょうか。しかし現実はそうそう甘くなく、打ちのめされた人も多いでしょう。なんでもワンソースは無理がありますが、一部の分野であればこなせるようにはなっています。 3Dや高機能なゲームであればUnityがあります。もっとカジュアルなゲームであればJavaScriptで開発できるHerlockがあります。そしてさらにHerlockをHTML5として動作させようと言うプロジェクトがHerlock.js for HTML5です。 Herlock.js for HTML5の使い方 例としてこういった図形を描く場合です。 var stg,bmp; new Image( "./img/check.png").onload = function(){ stg = addLayer( new Stage()).content;
Deploy WebGL applications as native iOS or Android applications?
As an extension to Joris' answer (which appears to be based on the work of Nathan de Vries), the following is the code I needed to enable WebGL within the iOS 5.0 SDK: Somewhere near the top of your view controller implementation: @interface UIWebView() - (void)_setWebGLEnabled:(BOOL)newValue; @end Programmatically creating a UIWebView and enabling WebGL: UIWebView *webDetailView = [[UIWebView all
Enabling & Using WebGL on iOS | Nathan de Vries
Background I’ve become a lot more interested in WebGL lately, and remembered reading on Hacker News a while back that WebGL would be available in iOS 5 as part of the iAd framework. WebGL will not be publicly available in iOS 5. It will only be available to iAd developers. When iOS 5.0 went GM, I decided to knock up a quick WebGL demo to see what was involved & how well it performed. Unfortunately
3D ゲームも簡単に作れる! tmlib.js x three.js(WebGL) で 3D プログラミング出来るようにしてみた!! | TM Life
私の方でずっと作っている JavaScript ライブラリ『tmlib.js(ティーエムリブ ジェイエス)』ですが, この度, 晴れて『three.js』と結ばれることとなりました. っとはいっても一方的にですけどねw tmlib.js は, 2Dゲームだったりツールを作る機能は揃っていましたが 3D に関する機能は今までありませんでした. WebGL をラップして自前で作ったりもしていたのですが, なかなかピンとこず… そこで今回は割りきって three.js をそのまま取り込んでtmlib.js の基本インターフェースと同じように使えるようにしてみました. サンプルをいくつか用意したので遊んで頂けると幸いです. もちろん jsdo.it で♪ Table of contents tmlib.js とは？ three.js とは？ tmlib.js x three.js で作ったサンプル
HexGL, the HTML5 futuristic racing game.
What is this? HexGL is a futuristic, fast-paced racing game built by Thibaut Despoulain using HTML5, Javascript and WebGL and a tribute to the original Wipeout and F-Zero series. Credits. HexGL was built with love using three.js, a 3D library built on top of WebGL and maintained by Mr.doob and AlteredQualia. I'd also like to thank Nobiax for the great metalic road texture, Charnel for the HexMKI b
「HTML5かネイティブか」――スマホアプリ開発や世界進出の苦労、GREEのCTOが語る
グリーがグローバル展開を加速している。米国や中国など世界5カ所に開発拠点を置き、グローバルプラットフォームの構築を進めているが、スマートフォン向けアプリ開発や世界展開には、さまざまな技術的課題や苦労があるという。8月28日、同社CTOの藤本真樹執行役員が開発の現状や苦労についてメディアに対し率直に語った。 HTML5かネイティブアプリか 「業界中悩んでいる」 ソーシャルアプリ開発は、ネイティブアプリとして開発する方法と、HTML5を使い、Webブラウザから利用できるようにする手法がある。HTML5でか、ネイティブ2Dアプリか、ネイティブ3Dアプリか……「業界中悩んでいる」と、藤本CTOは打ち明ける。グリーでは「どれかに絞り切れないので、全部押さえに行こうとしている」のが現状だ。 ネイティブアプリは表現力が豊かでレスポンスも速く、iOSならばApp Store、AndroidならGoogle
『Three.jsとBlenderによるWebGL』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 初めまして。 html5、javascript、flashなどのクライアント開発を メインに担当しております、 菅家(@KA_ka_YY)と申します。 弊社3月に行われました、エンジニア、デザイナーを対象とした アプリコンテストというイベントにて WebGLを使用した野球盤ゲームを作成しました。 その際利用したThree.js（WebGLのjavascriptライブラリ）を用いた WebGLの使用方法を紹介させていただこうと思います。 （1）レンダリングまずは Blender というフリーの3Dモデリングソフトで 以下のようなキャラクターを作りました
踊るJavaScriptがPerfume - 音の鳴るブログ
http://mohayonao.herokuapp.com/perfume1 http://mohayonao.herokuapp.com/perfume2 (Web Audio API / Audio Data API連携バージョン) http://www.perfume-global.com で、Perfumeのモーションデータが配られているので、とりあえずJavaScriptで踊らせてみた。 3Dの処理は Three.js でやっているし、GitHubのFLASHのやつをベースにJavaScriptにするだけなので、よく分かっていなくてもできる。 Three.js -> https://github.com/mrdoob/three.js/ perfume-dev -> https://github.com/perfume-dev ただ、Flashの Matrix3D.append
HTML5による物理シミュレーション環境の構築 ～WebGLライブラリThree.js 入門（１／３）～
HTML5とWebGL 初めにHTML5の位置づけについて簡単に触れます。HTML5とはこれまでのWebページ作成言語で主流だったHTML4やXHTMLの後継言語のことで、 2008年に草案がまとめられ、2014年までにウェブブラウザ各社への正式勧告を目指して策定が進められています。 HTML5は 2012年1月でもまだ「草案」段階で、仕様も流動的な準備段階であるが、開発側からもユーザ側からも非常に注目が集められています。 その大きな理由の一つに挙げられているのが、iPhoneやAndroidなどのスマートフォンの台頭による情報端末の多様化への対応のためです。つまり、様々なWEBコンテンツのクロスプラットフォーム化への重要な貢献が期待されているからです。 というのもスマートフォンの登場までは、Adobe社が提供する FLASH が動画やオーディオなどが組み合わされたマルチメディアコンテンツ
アップル、「iAd」でWebGLグラフィックスをサポートへ
MicrosoftがWebGLへのセキュリティ懸念を示す一方で、Appleはウェブブラウザで3Dグラフィックスを表示させるための同技術を取り入れようとしている。 「Safari」がベースとするオープンソースブラウザ「WebKit」のナイトリービルドにはWebGLのサポートが含まれているが、AppleはWebGLを正式にサポートするつもりかどうかについては明らかにしていなかった。しかし、Appleのある社員が先週、WebGLは「iOS 5」において、「iAd」のみを対象に利用可能な選択肢の1つとする予定であると述べた。 AppleのChris Marrin氏は、WebGLのメーリングリストで、「WebGLは、iOS 5において一般的には提供されない。iAd開発者のみが利用可能となる予定である」と述べた。 「iPhone」や「iPad」上にうっとうしい「Flash」の広告が表示されないことをあ
グーグルがO3Dの方針変換。WebGLに標準を統一し、O3DはJavaScriptライブラリへ
Webブラウザ上で3D表示（立体表示ではなく、遠近法などを用いた表示）を行うための仕様として、グーグルは昨年の4月にO3Dの開発を発表し、一方でモジラを中心にしたWebGLもそれ以前から標準仕様として開発が進められていました。 先週5月7日付けのグーグルの「The Chromium Blog」にポストされたエントリ「The future of O3D」で、グーグルはO3Dはこれまでの方針を変更し、WebGLをベースとしたJavaScriptライブラリとすることを明らかにしました。これにより、Webブラウザでの3D表示の標準APIはWebGLに一本化されます。 性能と環境に対するWebGLの懸念が払拭された グーグルがWebGLではなくO3Dを開発していた理由として、WebGLに関する2つの懸念があったことを明らかにしています。 1つはWebGLの性能です。WebGLはHTML5のCanva
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
“ニコニ立体”、“WebGL”で実装された「WebGLプレイヤー」を正式リリース
Goodboy Digital