女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

42
メディアアート演習B 22013.05.20 13:00-16:10 徳久悟 慶應義塾大学大学院メディアデザイン研究科 [email protected] ©dangkang interdisciplinary design lab. 13518日土曜日

Transcript of 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

Page 1: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

メディアアート演習ⅡB

第2回2013.05.20 13:00-16:10

徳久悟慶應義塾大学大学院メディアデザイン研究科[email protected]

©dangkang interdisciplinary design lab.

13年5月18日土曜日

Page 2: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

アウトライン

• Jitterとは

• Tips• 動画像入出力• エフェクト基礎• 位置表現• 合成• 練習

©dangkang interdisciplinary design lab. 213/5/18

13年5月18日土曜日

Page 3: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

Jitterとは

©dangkang interdisciplinary design lab. 313/5/18

13年5月18日土曜日

Page 4: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

Jitterとは?

• Maxにリアルタイム・グラフィクス/ヴィデオ処理を追加するエクステンション(機能拡張).

©dangkang interdisciplinary design lab. 413/5/18

13年5月18日土曜日

Page 5: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

Jitterでできること

• リアルタイム・グラフィクス/ヴィデオ処理

• 動画像再生• リアルタイム動画像入力• 動画像演算処理(加工/合成/エフェクト)

• 音と映像の連携• 動画像解析• 3Dグラフィックス(OpenGL)

• Quicktime形式のサポート

©dangkang interdisciplinary design lab. 513/5/18

13年5月18日土曜日

Page 6: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

Jitterでできること

• リアルタイム・グラフィクス/ヴィデオ処理

• 動画像再生• リアルタイム動画像入力• 動画像演算処理(加工/合成/エフェクト)

• 音と映像の連携• 動画像解析• 3Dグラフィックス(OpenGL)

• Quicktime形式のサポート

©dangkang interdisciplinary design lab. 613/5/18

13年5月18日土曜日

Page 7: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

Jitterオブジェクト

• jit~で始まるオブジェクト

©dangkang interdisciplinary design lab. 713/5/18

13年5月18日土曜日

Page 8: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

アトリビュート

• アトリビュート(属性)

• jitオブジェクトに新たに導入された仕組み

• “@アトリビュート名 値”で設定

©dangkang interdisciplinary design lab. 813/5/18

13年5月18日土曜日

Page 9: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

アトリビュート

• アーギュメント(引数)

• オブジェクトの動作方法や処理内容の初期値を指定

• メッセージ• オブジェクトに対する動作方法や処理内容の指示

©dangkang interdisciplinary design lab. 913/5/18

13年5月18日土曜日

Page 10: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス

• Jitterでは,マトリクス(行列)と呼ばれるデータ形式を扱う

©dangkang interdisciplinary design lab. 1013/5/18

メッセージ

シグナル

マトリクス

13年5月18日土曜日

Page 11: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス

• マトリクスの構成要素• ディメンジョン• セル• プレーン

©dangkang interdisciplinary design lab. 1113/5/18

13年5月18日土曜日

Page 12: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス

• マトリクスはセルとディメンジョンでできている

• セル(cell / 細胞) : マトリクスに含まれる1つ1つの要素

• ディメンジョン(dimension / 次元) : マトリクスに含まれるセルの数(最大32次元)

©dangkang interdisciplinary design lab. 1213/5/18

15

8x6のディメンジョン

セル

13年5月18日土曜日

Page 13: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス

• セルは複数のプレーンで構成される• カラー画像を作りたい場合• ARGBの4プレーン(最大32)

• データ型は8bit (2^8 = 256色)

©dangkang interdisciplinary design lab. 1313/5/18

ARGB

13年5月18日土曜日

Page 14: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス

• マトリクスの構成要素• ディメンジョン 8x6

• プレーン 4(RGBA)

©dangkang interdisciplinary design lab. 1413/5/18

13年5月18日土曜日

Page 15: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス

• マトリクスの構成要素• ディメンジョン 8x6

• プレーン 4(RGBA)

©dangkang interdisciplinary design lab. 1513/5/18

13年5月18日土曜日

Page 16: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス

• Jit.noiseのhelpファイル

• ディメンジョン 320 x240

• プレーン 4(RGBA)

• プレーンを1にしてみよう?

©dangkang interdisciplinary design lab. 1613/5/18

13年5月18日土曜日

Page 17: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

Tips

©dangkang interdisciplinary design lab. 1713/5/18

13年5月18日土曜日

Page 18: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

jit.pwindowとjit.window

• jit.pwindow• パッチ内でマトリクスを表示するためのオブジェクト

• jit.window• パッチ外でマトリクスを表示するためのオブジェクト

©dangkang interdisciplinary design lab. 1813/5/18

13年5月18日土曜日

Page 19: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

全画面表示

• keyオブジェクト

• キーをASCII codeに変換

• ACII code... コンピュータで文字を表示するためのコード

• escキー = 27

©dangkang interdisciplinary design lab. 1913/5/18

13年5月18日土曜日

Page 20: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

動画像入出力

©dangkang interdisciplinary design lab. 2013/5/18

13年5月18日土曜日

Page 21: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

動画像再生

• jit.qt.movie~

• Quicktimeムービーを再生(ディスクベース)

• rateアトリビュートでスピードをコントロール

©dangkang interdisciplinary design lab. 2113/5/18

13年5月18日土曜日

Page 22: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

動画像録画

• jit.qt.record~

• Quicktimeムービー形式でムービーを保存(ディスクベース)

• realtimeアトリビュートを1にすると,内部クロックベースで録画可能

©dangkang interdisciplinary design lab. 2213/5/18

13年5月18日土曜日

Page 23: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

リアルタイム動画入力

• jit.qt.grab~

• Quicktimeを利用したビデオ入力(ディスクベース)

©dangkang interdisciplinary design lab. 2313/5/18

13年5月18日土曜日

Page 24: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

練習

• jit.qt.grab~とJit.recordを組み合わせて自分の動画を録画してください.

©dangkang interdisciplinary design lab. 2413/5/18

13年5月18日土曜日

Page 25: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

エフェクト基礎

©dangkang interdisciplinary design lab. 2513/5/18

13年5月18日土曜日

Page 26: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

明度・コントラスト・彩度

• jit.brcosa

• 明度,コントラスト,彩度をコントロール

• 練習• jit.qt.grabをつなげると?

©dangkang interdisciplinary design lab. 2613/5/18

13年5月18日土曜日

Page 27: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

スケール・回転

• jit.rota

• スケールと回転数をコントロール• 練習: jit.qt.grabをつなげると?

©dangkang interdisciplinary design lab. 2713/5/18

13年5月18日土曜日

Page 28: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

色の変化

• jit.scalebias

• マトリクスの各値に乗算・加算をする• sclae(乗算): 1.0より大きければ明るくなる

• bias(加算): 最大値1.0 最小値-1.0

• 練習: jit.qt.grabをつなげると?

©dangkang interdisciplinary design lab. 2813/5/18

13年5月18日土曜日

Page 29: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

位置表現

©dangkang interdisciplinary design lab. 2913/5/18

13年5月18日土曜日

Page 30: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

任意の座標での映像再生

• jit.rota

• ソース画像の大きさ(zoom),位置(anchor)をコントロール

©dangkang interdisciplinary design lab. 3013/5/18

13年5月18日土曜日

Page 31: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

映像合成

©dangkang interdisciplinary design lab. 3113/5/18

13年5月18日土曜日

Page 32: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

ピクチャ合成

• jit.matrixを使って合成

• メモリを消費しない

• レイヤー処理には向かない

©dangkang interdisciplinary design lab. 3213/5/18

13年5月18日土曜日

Page 33: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

クロスフェード合成

• jit.xfade

• 2つの動画をクロスフェードするためのオブジェクト

• xfadeアトリビュートで指定する割合でブレンド

©dangkang interdisciplinary design lab. 3313/5/18

13年5月18日土曜日

Page 34: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス演算

• jit.op

• マトリクス同士のセルに含まれる値に対する様々な計算をするためのオブジェクト

©dangkang interdisciplinary design lab. 3413/5/18

13年5月18日土曜日

Page 35: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス演算

• jit.op

• マトリクス同士のセルに含まれる値に対する様々な計算をするためのオブジェクト

©dangkang interdisciplinary design lab. 3513/5/18

13年5月18日土曜日

Page 36: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

マトリクス演算

• jit.op

• マトリクス同士のセルに含まれる値(ARGB)を個別に計算することも可能.

©dangkang interdisciplinary design lab. 3613/5/18

13年5月18日土曜日

Page 37: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

ピクチャ合成とマトリクス演算

©dangkang interdisciplinary design lab. 3713/5/18

13年5月18日土曜日

Page 38: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

ピクチャ合成とマトリクス演算

©dangkang interdisciplinary design lab. 3813/5/18

13年5月18日土曜日

Page 39: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

アルファチャンネル合成

• jit.alphablend

• マスク画像を使った合成のためのオブジェクト

©dangkang interdisciplinary design lab. 3913/5/18

13年5月18日土曜日

Page 40: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

クロマキー合成

• jit.chromakey

• キーカラー抽出によるクロマキー合成のためのオブジェクト

©dangkang interdisciplinary design lab. 4013/5/18

13年5月18日土曜日

Page 41: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

練習

©dangkang interdisciplinary design lab. 4113/5/18

13年5月18日土曜日

Page 42: 女子美術大学メディアアート演習ⅡB 2013 Spring 第2回

練習

• 今日使ったパッチを使って,Wiiリモコンと連携させてください.

• ボタン,加速度,回転を単純に割り当ててみる.• ボタン,加速度,回転など動きの意味を考えながらインタラクションを作ってみる.

©dangkang interdisciplinary design lab. 4213/5/18

13年5月18日土曜日