ネコでもわかるインタラクティブサウンド20130706

ネコでもわかる
インタラクティブサウンド
田中孝
2013-07-06
1

このワークショップでは
• 波形編集（録音、加工、wav保存）
• インタラクティブサウンドの設計（考え方）
を紹介します。（サウンドの基本なので覚えておいて損はしません）
• Unityスクリプトとかはやりません
→他のワークショップ資料やゲームジャムで実践してもらえると良いのです
が・・・
その前段階の導入として
2

レジュメ
サウンドデザインインタラクションデザイン
サウンド再生
ADX2LE_OSCBasicPlayer アプリケーション
/adx2/0/playcueid
OSC (udp)
localhost通信
/StremingAssets/
NewProject.acf
CueSheet_0.acb
CRI Atom Craft
ビルド
出力ファイル
差し替え
Processing
ProcessingのoscP5
インゲーム
プレビュー
作成中最終出力
• インタラクティブとは？５分
• ツール紹介５分
• Audacityで録音、加工、wav保存２０分
• インタラクティブサウンドを作ってみよう２０分
テルミンから学ぶ
• チャレンジ（課題）３０分
簡単なアプリに音をつけてみる
• 発表１５分
• まとめ
これからのサウンドデザインに求められるもの
3

インタラクティブとは？
• インタラクティブ
対話、双方向
4

何と対話？双方向？
• コンピュータと
5

何を使って？
• 絵や動きやサウンドを使って
6

• CRI Atom Craft
ADX2LE OSC Player
processing
を使います。
サウンド再生
/adx2/0/playcueid
OSC (udp)
localhost通信
/StremingAssets/
NewProject.acf
CueSheet_0.acb
CRI Atom Craft
ビルド
出力ファイル
差し替え
Processing
ProcessingのoscP5
インゲーム
プレビュー
プレーヤー
プログラムデザイン１３
２
8

サウンドデザイン
CRI Atom Craft
• CRI Atom Craftを使って
音をデザインします
• ADX2LEのサウンドオーサリング
ツールです。
• 下のリンクからダウンロードサイトへ行けます
http://www.adx2le.com/
ゲームジャムでも使うデザイン１
9

• ADX2 OSC Player
を使って
音を鳴らします。
• Unityで作られたADX2LEの
プレーヤーアプリです。
• 下のリンク先にセットアップ方法
など解説あります
サウンド再生
/StremingAssets/
NewProject.acf
CueSheet_0.acb
http://www53.atwiki.jp/soundtasukeai/pages/24.html
今回のワークショップでのみ使うプレーヤー２
10

• Processingを使って
インタラクションを実現
します
• Processingは電子アートとビジュアルデ
ザインの為のプログラム言語です。
インタラクションデザイン
Processing
ProcessingのoscP5
http://www.processing.org/
今回のワークショップでのみ使うプログラム３
11

• 波形素材
• 波形加工
波形素材４
波形加工５
12

• 波形素材は
ChipTuneのものを使用
• チップチューンは矩形波形や三角波形、
ノイズなどシンプルな波形集です。
http://www.criware.jp/adx2/demo/download_j.php#chiptune
ゲームジャムでも使ってOK波形素材４
13

• 波形加工、録音、wav出力
は
Audacityのものを使用
• チップチューンは矩形波形や三角波形、
ノイズなどシンプルな波形集です。
http://audacity.sourceforge.net/
ゲームジャムでも使える波形加工５
14

Audacityで録音、加工、wav保存
波形加工
15

録音
• Audacityを起動
• 赤いボタンを押すマイクの入力レベル
波形が記録される
波形加工
16

波形の表示調整
• 境界線をドラッグして高さ変更
波形加工
小さくしたり大きくしたり
17

波形の表示調整
• ルーペで横方向の拡大縮小
波形加工
小さくしたり大きくしたり
18

ステレオをモノラルへ
• いくつか録音されていたらややこしいので
いらないものを「X」ボタンで閉じる
メニューを選択
波形加工
マイクはモノラルマイクが多いので・・・
19

波形の入らない部分カット
• 入らない部分を範囲選択
波形加工
• ドラッグして選択
• Ctr+Xで選択した部
分がカットされる。
• Ctr+Vでペーストも
可能
20

音を大きくする
• 正規化（ノーマライズ）する
波形加工
• 「エフェクト」メニューから「正規化...」を選択
• 音が大きくなる
←みたいな波形だとあまり大きくならない
コンプレッサーなど使うと良い
21

ピッチを変更
波形加工
• 「エフェクト」メニューから「ピッチの変更...」を選択
スライダーを右にす
ると高く、左にする
と低くなる
22

波形出力
波形加工
• 「ファイル」メニューから「書き出し...」を選択
• 「Format:」「WAV」で「Save」
23

インタラクティブサウンドを
作ってみよう
デザイン
24

テルミンから学ぶ
• テルミンはロシアのテルミン
博士が作った楽器で、
アンテナに手をかざすと音が
出て、かざし方によって変化
します。
• 楽器＝インタラクティブ
デザイン
25

テルミンの仕組み
• 右のアンテナに
近づくと音程が高く
離れると音程が低く
なります。
• 左のアンテナに
近づくと音が小さく
離れると音が大きく
なります。
デザイン
26

データ作成
• ボリュームとピッチが
インタラクティブに
変化する音を作ります。
サウンド再生
/adx2/0/playcueid
OSC (udp)
localhost通信
/StremingAssets/
NewProject.acf
CueSheet_0.acb
CRI Atom Craft
ビルド
出力ファイル
差し替え
Processing
ProcessingのoscP5
インゲーム
プレビュー
デザイン１
27

音を鳴らすキューを作る
• 再生すると三角波形が鳴るよう
にする
• 波形を追加して、キューにする
• キューはADX2LEの音を再生する機能で
す。
デザイン
28

• CRI Atom Craft
を起動
デザイン
29

• 新規プロジェクト作成
１
２
デザイン
30

• マテリアルへ
波形を追加
１
２
デザイン
波形素材
31

• キュー作成
１
２
デザイン
32

ボリュームつまみを再現
• ボリュームは縦で
• 指揮者が腕を上げる高さに
合わせて変化するようにデ
ザインする
• AISACを使います
• AISACはADX2LEの
音色パラメータをコントロールの為
の機能です。
デザイン
33

• キュー選択
１
２
デザイン
34

• ＋ボタン押し、AISACの追加...を選択
１２
デザイン
35

• 追加ボタンを押す
１２
３
デザイン
36

• グラフを右肩下がりにする
１
２
デザイン
37

• 音を確認する
１
２
３
４
デザイン
38

• ピッチ変化用を追加する
• ピアノや弦楽器のようなイ
メージでカーブをデザイン
する
• もう一つAISACを使います。
ピッチアンテナを再現
デザイン
39

• ＋ボタン押し、AISACの追加...を選択
１２
デザイン
40

• ピッチに変更し、追加ボタンを押す
１
３２
４
デザイン
41

• グラフを右肩上がりにする
１
２
デザイン
42

• 音を確認する
１
２
３
４
デザイン
43

２つのコントロールができました
• ツール上でもある程度確認できますが、
２つを同時にコントロールする他のアプリで動かすた
め、ツールからACF,ACBという
インタラクティブサウンドの元になるデータを出力し
ます。
44

「パディング使用フラグのチェックを外す
後でインゲームプレビューで波形追加などを行うため
以下の操作をしておきます。
• キューシートフォルダを選択
• 「パディング使...」のチェックを外しグレーにする
１
２
45

• ＋ボタン押し、チェック確認、ビルド
１
２
３４
５
46

• キューシートを右クリックし、
「Atomキューシートバイナリ出力先フォルダをエクスプローラで開
く...」を選択
１
２
３
• acf、acbが作成されているのを確認
47

ACF、ACBを利用する
• CRI Atom Craftの
データを
ADX2LE OSC Player
で再生する
サウンド再生
/adx2/0/playcueid
OSC (udp)
localhost通信
/StremingAssets/
NewProject.acf
CueSheet_0.acb
CRI Atom Craft
ビルド
出力ファイル
差し替え
Processing
ProcessingのoscP5
インゲーム
プレビュー
１
２
プレーヤー
デザイン１
２
48

• ADX2LE OSC Playerを起動
• ブロックを解除する
• 起動する
プレーヤー
49

ファイルをコピーする
ファイルコピー
50

• バッチを実行する
C:ADX2LE_WorkshopAtomCraftDatacopy.bat
• ACF,ACBファイルをコ
ピーしました。
C:ドライブにADX2LE_Workshopを
展開していないと正しく動作しないので
注意
51

• ADX2LEOSCBasicPlayer_Dataを開く
• StreamingAssetsを開く
• ACB、ACFを差し替える
１
２
４
３
• 先ほど
ツールで出力したフォルダから
inGamePreviewを開く
【参考】もしも手動でやる場合は以下のよう
な手順になります。
プレーヤーデザイン
デザイン
52

• ADX2LE OSC Playerの「Panic!」ボタンを押す
• 0:tri（キュー名）に変化していたらOK
２
１
プレーヤー
53

• 「♪」を押すと音が鳴る、「■」で停止
• 真ん中のスライダーでピッチが変わる
• 左のスライダーで音量が変わる
１
２
３
４
プレーヤー
54

• いちいちバッチを実行するのは面倒なので、
ビルド時に呼び出すようにします。
２
１
３
４
５
55

もっと直感的に
• プレーヤーでも２つコントロールができましたが、
同時にコントロールしたいので、
マウスの位置（たて、よこ座標）が反応するような、
簡単なプログラムを用意しました。
• サウンドデザインする上で簡単なプロトタイプを作
るとります。
プログラムからどんな風にコントロールされるか理
解を深めると、データ作成に有利な点が見つかるか
もしれません。
動作確認用のシンプルなもの
56

音以外のインタラクションを作る
• processingで
インタラクティブ
サウンドを
コントロールします。
サウンド再生
/adx2/0/playcueid
OSC (udp)
localhost通信
/StremingAssets/
NewProject.acf
CueSheet_0.acb
CRI Atom Craft
ビルド
出力ファイル
差し替え
Processing
ProcessingのoscP5
インゲーム
プレビュー
プログラム３
57

• proessingが起動します
• sketch_AISACXY.pdeを開く
１
２
３
• を押して実行
• を押して停止
58

import oscP5.*;
import netP5.*;
OscP5 oscP5;
NetAddress myRemoteLocation;
void setup()
{
size(480,240);
oscP5 = new OscP5(this,9000);
myRemoteLocation = new NetAddress("127.0.0.1",8000);
}
int playerState = 0;
int mouseState = 0;
void draw()
{
background(204);
if(mousePressed)
{
if(mouseState == 0){
if(playerState == 0){
OscMessage myMessage = new OscMessage("/adx2/0/playcueid 0");
oscP5.send(myMessage, myRemoteLocation);
playerState = 1;
} else if(playerState == 1){
OscMessage myMessage = new OscMessage("/adx2/0/stop");
playerState = 0;
}
mouseState = 1;
}
} else
{
mouseState = 0;
}
} else {
OscMessage myMessage
= new OscMessage("/adx2/0/aisac 0 "+mouseX/480f);
myMessage = new OscMessage("/adx2/0/aisac 1 "+(1f-mouseY/240f));
ellipse(mouseX,mouseY,60,60);
}
}
描画処理
ウィンドウを480x240で表示
背景を204色（グレー）で
楕円60x60をマウスの位置に表示
１
2
3
プログラム
59

import oscP5.*;
import netP5.*;
OscP5 oscP5;
void setup()
{
size(480,240);
}
int mouseState = 0;
void draw()
{
background(204);
if(mousePressed)
{
playerState = 1;
playerState = 0;
}
mouseState = 1;
}
} else
{
mouseState = 0;
}
} else {
}
}
プログラムの流れ
起動直後一度呼ばれる
描画は毎度呼ばれる
１
2
プログラム
60

import oscP5.*;
import netP5.*;
OscP5 oscP5;
void setup()
{
size(480,240);
}
int mouseState = 0;
void draw()
{
background(204);
if(mousePressed)
{
playerState = 1;
playerState = 0;
}
mouseState = 1;
}
} else
{
mouseState = 0;
}
} else {
}
}
通信処理
OSCインポート
OSCアドレスをセット
再生メッセージ
停止メッセージ
AISAC0メッセージ
AISAC1メッセージ
１
3
2
4
プログラム
61

import oscP5.*;
import netP5.*;
OscP5 oscP5;
void setup()
{
size(480,240);
}
int mouseState = 0;
void draw()
{
background(204);
if(mousePressed)
{
playerState = 1;
playerState = 0;
}
mouseState = 1;
}
} else
{
mouseState = 0;
}
} else {
}
}
判定の処理
マウス押されたら
再生中なら
再生中かどうか
マウス状態
１
2
3
プログラム
62

チャレンジ（課題）
• 内容：絵にあった変化を音に加えてみる。
• どちらか好きなものを選んで音をデザインしてみる。
• 分からない事があれば、質問も受け付けます。
63

• 内容：どんな音の変化があるか動かしながら考えてみる。
• ヒント：残響を増やすにはバスセンドを使う
• ヒント2：バスセンドは閉じるのみのコントロール
• C:ADX2LE_WorkshopprocessingSample
sketch_test1 sketch_test1.pde
64

• どんな音の変化があるか動かしながら考えてみる。
• ヒント：
2つの音をクロスフェードするにはボリュームを使う
• C:ADX2LE_WorkshopprocessingSample
sketch_test2sketch_test2.pde
65

インゲームプレビュー
• 【インゲームプレビュー】とは、
ツール側で音を加工、編集した結果を
【実行中のゲーム】に送信し、
音を即時に差し替える技術です。
• ゲームを中断させる事なく音の加工を反映させる事ができ
るため、非常に細かい微調整が可能です。
インゲーム接続
66
デザイン
66

インゲームプレビューの開始
【F10キー】を押す
または、【プレビューメニュー】から【インゲームプレビューの開始】を選択
発音数やCPU%が変化していれば
接続OK
67
デザイン
67

これからのサウンドデザインに
求められるもの
• 楽器や身の周りの音のなるも
のも
デザインの参考になります。
• なぜ、その音が鳴っているの
か？
どう変化するのか？
意識してみます。
68

シンプルである事
• なるべく少ない操作
で、最大の効果を求め
ます。
• 演奏しやすいインタラ
クティブサウンドを
デザインする事が良い
です。
• 難しいと練習（ルール
設定）が必要になる
69

音はこだわるべき
• めっちゃ【凝って】良い。
• こだわりを捨てずに
• 気持ちよい音を探求する。
• それが面白さや、楽しさに繋がる。
70

サウンドデザインで
リッチに！
• シンプル
プログラマを困らせな
い
• 分かりやすさ
効果的か、理論的か
客観的に判断
• サウンドデザイン
• ADX2を使うと楽にデ
ザインできます。
71

サウンドゲームジャムあります
• ２０１３年１０月頃（土日）にサウンドゲームジャム
あります。
• 見学も可能です。UnityでのADX2LEの実例が見れま
す。
• 詳しくはADX2LE.comで
72

ネコでもわかるインタラクティブサウンド20130706

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (17)

Destaque

Destaque (19)

Semelhante a ネコでもわかるインタラクティブサウンド20130706

Semelhante a ネコでもわかるインタラクティブサウンド20130706 (20)

Mais de Takashi Tanaka

Mais de Takashi Tanaka (10)

ネコでもわかるインタラクティブサウンド20130706