The digital world has given movie fans a lot of new ways to spend their free time, one of which is watching movies. CMovies is one of the best-known websites… Continue Reading »
CSSで本当にクリアできるルービックキューブを作ったので3Dについて色々解説してみる その1 カテゴリ:3D 2013年8月20日 09:04 しばらくぶりの更新です。 最近はWebGLやCSS Shaderを始め、3D関係のことをメインに勉強しています。 おかげでだいぶ詳しくなってきました。 ちなみに、CSSでクリアできる、と書いていますが「CSSだけで」ではないので当然JavaScriptもてんこ盛りですw 最近はインプットばかりだったので、備忘録も兼ねて以前案件で制作したCSS Rubik Cubeを解説を交えながら書いていきたいと思います。 CSS Rubik CubeはMaxellの商品のキャンペーンで、エビ中キューブと名付けられたコンテンツです。 エビ中キューブは、エビ中というアイドルグループの動画を、ルービックキューブで操作して自分好みのものに揃えて見る、というものです。 P
はじめまして。 アメーバ事業本部コア室コアディベロップメントグループの新屋です。 コア室では3Dアニメーションライブラリの開発を行っています。 リアルタイム・プリレンダ問わず3Dモーショングラフィックが好きで趣味でも3Dの制作をしています。プリレンダはTAKCOMさん、WOWのdaihei shibataさん、ogaoooooさん、リアルタイムはMasato Tsutsuiさん等の作品が好きです。 リアルタイム3D 昨今のスマートフォンの処理能力の向上に伴い、webブラウザでも一昔前にPCで動作していたようなリッチなコンテンツも高速に処理できるようになりました。 スマホサービスでは必ずと言っていい程CSSやjavascriptでのUI・演出アニメーションが組込まれています。 そうしたアニメーションの表現力を引き上げる方法の一つとしてリアルタイム3Dを紹介します。 リアルタイム3Dを扱う言語
This browser is no longer supported. Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support. This topic covers a technique for manipulating a 3-dimensional object using HTML5’s canvas element. Note To view the sample presented in this topic, you’ll need a browser, such as Windows Internet Explorer 9 or later, that supports the canvas element. S
Examples Physics plugin for three.js Physijs brings a very easy to use interface to the three.js framework. One of the reasons three.js is so popular is because it is so incredibly easy for graphics newbies to get into 3D programming. Physijs takes that philosophy to heart and makes physics simulations just as easy to run. In fact, there are just five easy steps that must be taken to make a 3D sce
Discover Nissan JukeWalk around your Nissan JUKE. Customise it. Get in it. Start it up then race through the city at night. Do handbrake turns, collect the condensed energy to power up your Nissan JUKE and see your energy trail light up the night. Energise your Nissan JUKE, set your best time then challenge your friends to beat it! Working together, Adobe, Nissan Europe and Digitas have created th
wonderflは、サイト上でFlashをつくることのできるサービス。 通常Flashをつくるためには、Flash IDEやFlex、FlashDevelop等といったツールを使って、コードを書き、コンパイルする必要がありますが、wonderflでは、サイトにあるフォームにActionscript3のコードを書けば、サーバサイドでコンパイルを行えます。 つまり、ブラウザさえあれば、Flashをつくれます。コンパイル結果はサイト上に表示され、作成されたFlash(swf)はページ上に自動的に表示されるので、完成したFlashをリアルタイムに見ながらコードを書くことができます。 ※APIとして、はてな OpenIDを使用してネットにさえつながれば、誰もがFlashクリエイターになれます。世界中のFlashクリエイターがユーザーになるwonderflは、 文字通り、世界のFlash図鑑となってい
埋め込み画像(幅64pixel高さ64pixel)の画素をパーティクルに置き換えて表示してみました。OffsetPositionLocalアクションでランダムな位置に発生させたパーティクルを、BrokenLineLocalアクションで画素位置との2点間を往復移動させて動作がループしているように見せています。Away3Dのバージョンは4.0.9 Goldで、パーティクルシステムは「liaocheng/away3d-particles-system - GitHub」を使用しました。 「Particle Fountain」ではブレンドモードを加算にしていて気が付かなかったのですが、パーティクルが重なったときに奥にあるものが手前に表示されてしまうことがあります。パーティクルシステムの仕様かバグかはわかりません。 package { import flash.display.*; import f
enchant.jsがWebGLに対応,本格的な3Dグラフィックスによるゲーム開発が手軽に 編集部:aueki ユビキタスエンターテインメントは,WebGLに対応したgl_enchant.jsのβ版を公開した。 enchant.jsは,JavaScriptとHTML5を使用したゲームエンジンで,これまではスプライトなど2Dグラフィックスを支援するゲーム開発ライブラリとして提供されていたのだが,ついに3Dグラフィックスが利用可能になった。 今回サポートされたWebGLは,Webブラウザ上からOpenGLを呼び出すAPI仕様で,WebGLがサポートされたWebブラウザを使用することで,JavaScriptからOpenGLの機能が呼び出せるようになるというもの。OpenGLは普通GPUアクセラレートされているので,3D表示部分については爆速環境が実現できるわけだ。 enchant.jsでは,以前
Flashはアルファを含んだ画像やシェイプを重ねすぎると表示がおかしくなったり極端に重くなったりするので、拡大縮小回転しつつたくさん重ねる場合は処理の重いBitmapData.draw()を使うしかなかったんですが、FP11のStage3Dではそんな心配もいらないみたいです。 上のデモは透過画像を重ねまくる事になる煙パーティクルの負荷テストです。例によって3Dライブラリを作れるスキルはないので、Alternativa3Dにお世話になりました。煙画像のSprite3Dをぶわーって吐きだしてるだけです。 自分の環境ではパーティクル数1300でギリギリ60fpsくらい。もっと表示できると思ってたんだけど、これはSprite3Dに割り当てた透過画像が重いって事なのかな。それでも以前は100個くらいが限界だったので大分軽くなってると思うけど。 完全に忘れてたそういえば以前PV3Dで某エースコンバット
1つのレジスタには長さ4のベクトルが入るので、例えば、4x4の行列式はこのレジスタを4つ消費します。 オペコード OpCode Destination Source1 Source2/Sampler のようなフォーマット。例えば、 mov vt0 va0 はvertexシェーダーで0番目のAttributeから0番目の一時変数用レジスタに値をコピーします。 以上が基本的な説明です。 PixelBender3Dを試してみましたが・・・ PixelBender3Dをダウンロードする まずはdocsのなかのPixelBender3DReference.pdfを軽く目を通します。まだDraftなので仕様は変わるかも知れませんが、要点だけあげると、 PixelBender3Dを利用する手順 pb3dutilでOpenGL等のシェーダーのような言語をコンパイルし、PB-ASMという形式にコンパイルしま
待望の新しい3D API Molehill (モールヒル)を搭載した Flash Player Incubator のプレビュー版がリリースされました。以前、「次の世代のFlash Playerは凄いことに!GPUにより数十万ポリゴンが60FPSで動く」という記事で紹介した次世代の Flash Player です。 Adobe AIR and Adobe Flash Player Incubator – Adobe Labs 今回公開されたものを使うことによって Molehill API を利用した SWF をコンパイルすることができます。既に国内外で紹介記事がでてます(早い!) 馬鹿全 – FlashDevelop + FlashPlayer11(Molehill) + Away3D 4.0 Alpha での遊び方 Changing the web, again. – ByteArray
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く