タグ

javascriptとWebGLに関するmochinagaのブックマーク (3)

  • JavaScriptライブラリ「clmtrackr」でお手軽フェイストラッキング - ICS MEDIA

    フェイストラッキングという技術を使うと、画像から顔のパーツの位置や大きさを特定できるようになり、静止画やアニメーションを重ねるといった演出を加えられます。 フェイストラッキングの技術は昔からありましたが、高度な画像解析の知識が必要なため導入するにはハードルの高いものでした。今回は、JavaScriptライブラリを使って、HTMLでフェイストラッキングを実現する方法を紹介します。 ウェブテクノロジーでフェイストラッキングに挑戦しよう ウェブテクノロジーで簡単にフェイストラキングを実現するには、JavaScriptライブラリ「clmtrackr」が挙げられます。このライブラリでは、負荷が高いフェイストラッキングの処理をWebGLで行っています。ライブラリのGitHubページではさまざまなデモが用意されています。 ▲画像から顔を検出しているデモ JSライブラリclmtrackrで画像や動画の顔の

    JavaScriptライブラリ「clmtrackr」でお手軽フェイストラッキング - ICS MEDIA
  • 超簡単に3DCGできるJavaScriptライブラリ作った - aike’s blog

    ブラウザでWebGLが使えるようになって3DCGプログラミングはずいぶん身近なものになりました。と書いてるそばから違和感を感じるくらい生のWebGLをJavaScriptで書くのは敷居が高かったりします。できなくはないけど前提となる知識がかなり必要な感じ。 three.jsが登場したときは、これで普通に3DCGができるということで一気にひろまりました。とはいえ、それでもまだやることは多く、画面に四角い箱を表示する場合以下のようなプログラムを書くことになります。 ・シーンを作成 ・ライトを作成、位置と向きを設定、シーンに追加 ・カメラを作成、位置と向きを設定、シーンに追加 ・マテリアルを作成、色を指定 ・BoxGeometryを作成、サイズを指定 ・メッシュを作成、位置と向きを設定、シーンに追加 ・レンダラーを作成 ・レンダリングループ処理 これらのひとつでも間違えたりパラメーターが適切でな

    超簡単に3DCGできるJavaScriptライブラリ作った - aike’s blog
  • Two.js

    TIP Prior to v0.7.0-alpha.1 Two.js requires Underscore.js and Backbone.js Events. If you're already loading these files elsewhere then you can build the project yourself and get the file size even smaller. For more information on custom builds check out the source on github. # Overview Overview # Focus on Vector Shapes Two.js is deeply inspired by flat motion graphics (opens new window). As a resu

    Two.js
  • 1