ARにおいて,現実の世界に3次元CGが違和感なく存在しているように見せるための条件の1つに,オクルージョンの実現があります.オクルージョンとは隠れのことで,実物体の背後にCGがあるときにCGの一部またはすべてが隠れて見えなくなっている状態をきちんと表現しようというものです. 今回はこういうもの↓に挑戦してみましょう. しくみ TV番組や映画の制作で用いられているクロマキー合成の技法を使います.まず,シーンの背景色を緑色に設定し,実物体と同形状の緑色のCGと,重畳したいCGを一緒に描画します.これによりCGが実物体でマスクされた画像を得ることができます.このデータをいったんバッファに保存します.次にカメラ画像を描画し,バッファ中の緑色でないピクセルだけを画面上に描画していけば,合成完了です. 実装してみる ProcessingとNyAR4psg(Processing版のARToolKit)を
基本的な関数 size() ウインドウサイズや描画モードの設定 noLoop(), loop() 処理の一時停止と再開 redraw() 1回だけdraw()を実行する exit() スケッチを終了する delay() 指定した時間停止する return 呼び出し元へ戻る void 戻り値のない関数 スケッチの情報 width, height 描画ウインドウの幅と高さ screenWidth, screenHeight スクリーンの幅と高さ frameRate(), frameRate フレームレートの設定と取得 frameCount 累計のフレーム数 online 実行環境を調べる cursor(), noCursor() マウスカーソルの制御 hint() レンダラの動作条件を設定する 変数 データ型 スコープ 値の変換 演算子 優先順位 計算に使う関数 算術関数 三角関数 乱数 ra
Kinectでリアルタイムドット絵動画 久しぶりにProcessingとKinectで動画つくってみました。 きっかけは「レトロゲームキャラが現実に現れたらこんな感じ? 「ドット絵×現実」アート」というのを見て、「これはなかなかいい感じだな。あれ?でもこれって今までやったあれとかこれとかそれを組み合わせればリアルタイムに人を認識して実写背景にドット絵を生成することができそうだな」と思いやってみたら、思ったより簡単にできたので公開してみます。 ProcessingとKinectで実写背景に人だけドット絵になる動画を作ってみた - YouTube 完成度はそれなりです。右側で洗い物をしているのは私の妻です。 やっていることは特に難しいことはなくて、今までやった「KinectとProcessingで光学迷彩ごっこをしてみた」とか「とびだせどうぶつの森のマイデザイン補助ツールをProcessing
いやー、いい眺めだなあー なんちゃって。ProcessingとKinectで合成映像(クロマキー)を作ってみました。 なぜこんな映像が作れるかというと、KinectはRGBカメラ映像の中から人物を抽出する機能を持っているからです。 ちなみに背景を入れないとこのような感じになります。 ◆背景 このときの背景のコードは次のような感じです。 そして自由の女神を背景にするのは次のような感じです。 ◆setup()とdraw() Processingのコードは、初期化「setup()」と継続的な描画「draw()」の2つに分かれています。初期化は1回だけ行われ、描画はずーっと終了させるまで繰り返されます。 次のコードは初期化「setup()」のコード。深度カメラを有効にし、人物検出を有効にし、RGBカメラを有効にしています。 続いて継続的な描画「draw()」の部分です。 まず、makeImgFor
みなさんこんにちは、エンジニアののびすけです。 最近はWeb上で動画背景を使った表現のサイトが増えてきてますね。Webブラウザの性能が上がってきている昨今では、(スペックにもよるのですが)ブラウザ側でそういった処理もガンガンできます。 今回はそんなリッチな表現ができる「Seriously.js」をご紹介します。 Seriously.jsとは http://seriouslyjs.org/ 少し前に話題になった、動画や画像にブラウザ上でリアルタイムエフェクトを掛けることができるライブラリ。複雑なエフェクトをたくさん使えるにもかかわらず、簡単なJavaScriptの記述で操作できます。 サンプルを触ってみよう まずは、どんなことができるのかが気になると思います。Seriously.jsの公式デモを紹介してきます。 こちらのページにデモへのリンクがあるので試してみましょう。 ※執筆時点ではGoo
正方形を横に動かす step.1 静止した正方形を描く //最初に1回だけ実行する void setup() { size(200, 200); } //毎フレーム繰り返し実行する void draw() { rect(0, height/2, 10, 10); //画面中央左に一辺が10pxの正方形を描く } rectのx座標がじょじょに大きくなれば、正方形は数のように左に移動し、動いているように見える。 step.2 正方形のx座標を変数で置き換え、変数の値がじょじょに大きくなるようにする float x; //小数型の変数xを宣言 void setup() { size(200, 200); x = 0; //xの初期値を0とする } void draw() { x += 1; //毎フレームで正方形のx座標を1ずつ増やす rect(x, height/2, 10, 10); } 正
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く