LoginSignup
72
26

More than 5 years have passed since last update.

openFrameworksとResolumeで、簡単プロジェクションマッピング

Last updated at Posted at 2016-12-07

はじめに

こんにちは!メディアアートコースメンターのきゃりーです。Life is Tech ! のAdvent Calendar、7日目です!
みなさんPCで開発してるけど、画面の中だけじゃ物足りなくなってきていませんか?
そこで今日はResolumeを使って、プロジェクションマッピングをする方法を紹介しようと思います!
ちなみにopenFrameworksを使わずに、動画ファイルだけでもできるので、openFrameworks使わない人も是非読んでみてください!

Resolumeとは

Resolumeとは、オーディオヴィジュアルパフォーマンスに使うツールです。ビデオ、オーディオとオーディオヴィジュアルの作品の再生、ミックス、エフェクト効果の適用、ライブパフォーマンスなどに使用できます。
MIDI, DMX,Open Sound Controlなどを用いたインスタレーションにも最適みたいです。
参考

やること

今回は、このような6面体の白い箱にマッピングしていきます!一面には、ResolumeのExampleを、もう一面には、これから入れる動画ファイルとopenFraemworksのプロジェクトをうつします。
スクリーンショット 2016-11-07 12.45.39.png

Resolumeの準備

まずはResolumeの準備をしましょう!

ダウンロード

ここから体験版をダウンロード&インストールしましょう。
Resolume Download
今回はResolume5で紹介します。

開くとこんな感じ。最初に出てくるExampleを、このまま使用していきます。
スクリーンショット 2016-12-07 18.40.46.png

ちなみにExampleファイルは、
書類/Resolume Arena 5/compositionsの中に、もともと入っている映像や音源は、アプリケーション/Resolume Arena 5.1.2/media/AVの中にあります。もし、後で消しちゃったけど、もう一回入れたい!って言う時にはここから。

言語設定

分かりやすいように日本語にします。
View/Language/日本語を選択して、Resolumeを再起動します。
スクリーンショット 2016-12-07 18.51.53.png

openFrameworksの準備

では次にoF側の設定をしましょう!
動画ファイルのみを使用する場合は、とばして大丈夫です。

Addonの準備

以下からAddonをダウンロードし、addonsフォルダへコピーします。
ofxSyphon

プログラム

まずofxSyphonを入れて新規プロジェクトを作成、または既存のプロジェクトにofxSyphonを追加します。(補足:リンク)
次に、SyphonでopenFraemworksのスケッチを送るようにします。
...は省略を意味しています。

ofApp.h
...

#include "ofxSyphon.h"

class ofApp : public ofBaseApp{

...

  ofxSyphonServer mainOutputSyphonServer;
}
ofApp.cpp
void ofApp::setup(){
...

  mainOutputSyphonServer.setName("Screen Output");
}

void ofApp::draw(){
...

  mainOutputSyphonServer.publishScreen();
}

あとは、mainOutputSyphonServer.publishScreen();がdraw()の最後になるように注意しながら、プログラムを書いていきましょう!

出力の準備

縦と横は、Layerとコラムに分かれています。縦に並べた映像は重ねられますが、横に並べたものは同時に選択することはできません。例えば、layer3のコラム1と、layer3のコラム2は、重ねて同時に表示することはできません。
今回は動画とopenFraemworksの映像を、Exampleとは別の面にうつすため、メニューバーからレイヤー->新規を選択し、レイヤーを2つ追加しましょう。layer4には動画ファイルを、layer5にはopenFraemworksのプロジェクトを入れていきます。
スクリーンショット 2016-12-07 20.14.10.png

動画ファイル

動画ファイルをドラッグ&ドロップで、layer4の好きなところに入れましょう。
mp4は入らないので注意!movなら大丈夫です。
input_movie4.gif

openFrameworks

先ほど書いたプロジェクトを実行しましょう!
すると、右下の枠の中のソースのSyphonの中にプロジェクトが出てくるはずなので、layer5にドラッグ&ドロップしましょう。
スクリーンショット 2016-12-07 20.40.07-2.png

出力する

いよいよマッピングです!
プロジェクターと接続してください!接続したらミラーリングを切りましょう。

出力設定

メニューバーの、出力->アドバンススクリーン設定を選択します。

まずScreen1を選択し、右側のデバイスをDisplayにしましょう。プロジェクターにうつったらOKです!
スクリーンショット 2016-12-07 20.52.33-2.png

次にスライスを増やします。左側のプラスマークを押し、スライスを選択しましょう。1つのスライスに、1つのレイヤーをのせていきます。
スクリーンショット 2016-12-07 20.51.41-2.png

はじめにSlice1の設定をしましょう。入力選択の右側、入力ソースをLayer1にします。出力変形を選択し、ここで映像を図形に合わせていきます。ポイントを編集を選択し、画面とうつしだされたものを見比べながら、点を動かしましょう。

IMG_2406.JPG

他のスライスも同様にします。

すべての調整ができたら...完成!
保存をして閉じることを忘れずに。
sample2-5.gif
実際にやってみると音のMIXも同時に出来て面白いです!!!

さいごに

Resolumeはもっといっぱい面白いことができます。
体験版だと時々喋るし、ロゴうつっちゃうけど、ぜひ楽しんでください。
そしてもっと色々したいよ〜という方は、こちらもぜひどうぞ。
Resolume Avenue & Arena Manual
Resolume Basics Tutorial

MadMapperも使ってみたい!という人はこちらも。
openFrameworks0.9.~+MadMapper でプロジェクションマッピング

明日はれもん🍋による便利ツール10選です〜!

72
26
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
72
26