ワークショップの詳細 (東京藝術大学 公開講座)

openFrameworksプログラミング ワークショップ

• 教 授：黒川哲郎
• 助 教：城 一裕
• 非常勤講師：久保田晃弘
• 非常勤講師：田所 淳
• 教育研究助手：星 卓哉

openFrameworksは、C++をベースにしたインタラクティブデザイ ンやメディアアートを制作するためのフレームワークです。2次元や 3次元の図形の描画、アニメーション、サウンドの録音と再生、動画 のキャプチャーと再生、マウスやキーボードによるインタラクション、 ネットワークの活用など、マルチメディアコンテンツを制作するため の様々な機能をすぐに利用できるフレームワークとして提供されてい ます。本ワークショップでは、プログラミング初心者~中級者を対象 に、openFrameworksの基礎から応用までを実際にプログラミングを体 験しながら学びます。

※受講者はコンピュータの基礎的な取扱いをできることが必須条件です。

※openFrameworksはMac, Windows, Linux用のC++ツールキットです。当方ではMacのコンピュータで環境を準備しますが、受講者のノ ートパソコンを持ち込んでの受講も歓迎します。持ち込みの場合は あらかじめ以下のWebサイトからopenFrameworksの最新版をインス トールしておいてください。

http://www.openframeworks.cc/

• 8/7~8/8 2日間
• 10:00~19:00 計16時間
• 15,000円
• 総合工房棟A棟2F 芸術情報センター内演習室1
• 定員18名 市民一般(学生以上) 最少開講人数12名

また、この機会に、openFrameworksの開発者のみなさんの交流の場になると良いなと思っています。お時間のあるかたは、ぜひお立ち寄りください。無料です!!

参加を予定されている方は、下記におおまかな人数を把握するために下記のサイトから参加表明していただくと助かります。お手数ですが、よろしくお願いいたします。

参加を登録する (ATND)

Beyond Interaction：メディアアートのためのopenFrameworksプログラミング入門

• 日時：2010年5月23日(日) 7:00 pm – 8:00 pm
• 場所：AppleStore 銀座

インタラクションデザインやメディアアートの現場で現在最も注目されている制作環境「openFrameworks」をご紹介します。Macユーザのための統合開発環境Xcodeを使えば、誰でも簡単にopenFrameworksを始められます。新しいプログラミング環境の基本を気軽に学べるこのセミナーに、ぜひご参加ください。

詳細は、AppleStore銀座のイベントカレンダー、5月23日をご欄ください。

追記：当日使用したスライドとサンプルプログラムを掲載しました。

• プレゼンテーションのスライド(スクリーン表示用)
• プレゼンテーションのスライド(印刷用)
• サンプルプログラム

Tokyo Max Users Group #15 [ Upload ]

• 日時：2010.03.13 18:00～21:00
• 会場：西麻布Bullet’s ( http://www.bul-lets.com/ )
• 料金：1000円 （1ドリンク付き）

大きな地図で見る

出演者：

• 山本俊一（http://atelier.tkrworks.net/）
• NOEL-KIT（http://www.noelkit.com/）
• 福井恒太郎 & 清末有人（http://ondomusic.com）
• 田所淳 (http://openframeworks.jp/)

TokyoMaxUsersGroupはMax/MSP/Jitterを中心にAudio/Visual、プログラミングに関する情報交換を目的としたゆるやかな集いです。

15回目となる今回もこれまで同様見逃せないラインナップ！まずはニコニコ動画を中心にコンセプチュアルな楽曲を発信するMax/MSP、VOCALOID使いNOEL-KIT、toes名義にて自身のレーベルondomusicより良質なMaxパッチを公開する清末有人がレーベルメイト福井恒太郎とともにTMUGに登場！さらにオープンソースのフィジカル・コントローラーmonomeから派生したフリー・ハードウェア PICnomeの開発,販売,ワークショップをこなすtkrworks山本俊一と、発売したばかりの世界初のopenFrameworks単独解説書「Beyond interaction」の著者、田所淳のプレゼンテーションを敢行。めでたく３周年を迎えるTokyoMaxUsersGroup、まだまだ目が離せません！

もちろんMax初心者・非ユーザー大歓迎。興味のある方ならどなたでも参加可能。ノートPCの持参を推奨します！

タイムテーブル

• 18:00 開場
• 18:15 – 18:45 田所 淳 （openFrameworks.jp） ：解説、デモ
• 19:00 – 19:30 福井恒太郎&清末有人（ondomusic）：パッチ解説、Live
• 19:45 – 20:15 山本俊一（tkrworks）：解説、デモ
• 20:30 – 21:00 NOEL-KIT：解説、Live

コメントで誤りを指摘してくださった方、ありがとうございます。正誤表に反映しました。

p.49 楕円を描く関数 (2つめの囲み)

• 誤 ofCircle(《中心点のx座標》,《中心点のy座標》,《幅》,《高さ》);.
• 正 ofEllipse(《中心点のx座標》,《中心点のy座標》,《幅》,《高さ》);.

P.53 16〜17行目

• 誤：引数としてRGB(Red, Blue, Green)を追加します。
• 正：引数としてRGB(Red, Green, Blue)を追加します。

P.53 2-3-2、一つ目の囲み

• 誤：ofBackGround(《Rの値》, 《Bの値》, 《Gの値》);
• 正：ofBackGround(《Rの値》, 《Gの値》, 《Bの値》);

P.53 2-3-2、二つ目の囲み

• 誤：ofSetColor(《Rの値》, 《Bの値》, 《Gの値》);
• 正：ofSetColor(《Rの値》, 《Gの値》, 《Bの値》);

P.71 LIST 2-5_c 10行目コメント

• 誤 //y座標を0に
• 正 //y座標を画面の上下の中央に

P.79 LIST 2-6_b 3行目

• 誤：for(i=0; i<1000; i++){…
• 正：for(i=0; i<1000; i++){…

p.144 3-1-10 2行目

• 誤：異る
• 正：異なる

p.146 本文1行目

• 誤：独自に開発さた
• 正：独自に開発された

p.155「右チャンネル波形を描画」のforブロック内

• 誤 lAudio[i]
• 正 rAudio[i]

p.205 vectorの関数の紹介

• 誤：「front() : 先頭要素を返す」が二つあるので、一つ削除

p.234 testApp.cpp 4行目

• 誤：grayBg.draw(10, 20);
• 正：grayBg.draw(10, 260);

p.234 testApp.cpp 5行目

• 誤：//背景画像と現在の画像との差分を（360, 280）の位置に表示
• 正：//背景画像と現在の画像との差分を（360, 260）の位置に表示

p.241 LIST 3-4_1 下から2行目

• float simplaAmount; floatは黒ではなく緑

p.241 LIST 3-4_1 下から2行目コメント

• 誤 //単純化した輪郭線
• 正 //輪郭線の単純さ

p.249 プロジェクトの設計、13〜14行目

• 誤「ですので、ofBox2dJointをのまま使用するのではなく」
• 正「ですので、ofBox2dJointをそのまま使用するのではなく」

p.251 LIST 3-5_A、testApp.hソースコード

• 「void keyPressed (int key);」のインデントが半角スペース一つ右にずれている。

p.252 LIST 3-5_A、testApp.h 8行目

• 誤：vector <CustomCircle> circles;
• 正：vector <CustomCircle*> circles;

p.252 LIST 3-5_A、testApp.h 10行目

• 誤：vector <CustomJoint> joints;
• 正：vector <CustomJoint*> joints;

p.279 LIST 25行目コメント行

• 誤 //軌跡の流さを制限する
• 正 //軌跡の長さを制限する

本書は、インタラクションデザインやメディアアートの現場で現在最も注目されている制作環境、「openFrameworks」の世界初の解説書です。openFrameworksというC++のフレームワークを使用して、プログラミングの初歩から高度な応用まで、具体的なサンプルを作成しながら実践的に学んでいくことを目的にしています。プログラミングの経験のない初心者から、メディアアートに興味を持ち自分で何かを作りたいと考えている方、ProcessingやFlashなど他の環境は経験しているがより強力なプログラミング環境を探し求めている方まで、多くの方々にとって有益な情報を提供しています。

• 2010年2月発売予定
• ISBN：978-4-86100-670-8
• 定価：3,570円（本体3,400円＋税）
• 仕様：304ページ／B5判
• 発売予定日：2010年2月21日
• 著者：田所　淳・比嘉　了・久保田晃弘

amazonの情報ページへ

目次：

はじめに

welcome：Zachary Lieberman
制作環境について／ダウンロードデータについて

第1章　openFrameworks入門
1-1　openFrameworksについて
1-1-1　openFrameworksって何？
1-1-2　openFrameworks開発の歴史
1-1-3　「糊（glue）」としてのopenFrameworks
1-1-4　openFrameworksの特徴—既存のインタラクションを超えて
1-2　作例とコミュニティ
1-2-1　openFrameworksを使用した作品例
1-2-2　openFrameworks情報の入手
1-3　プログラムの入手とインストール
1-3-1　openFrameworks開発のための環境設定
1-3-2　openFrameworksのダウンロード
1-3-3　Xcodeテンプレートの入手
1-3-4　openFrameworksのファイル構成
1-4　サンプルプログラムの起動
1-4-1　サンプルプログラムを起動してみる

Interview 01：The Graffiti Research Lab（G.R.L.）

第2章　openFrameworksプログラミング初級編
2-1　openFrameworksプログラミングを始めよう
2-1-1　この章の流れ
2-2　図形を描く
2-2-1　座標系について
2-2-2　新規プロジェクトを作成する
2-2-3　関数—処理をまとめる
2-2-4　直線を描く—ofLine
2-2-4　四角形を描く—ofRect
2-2-5　円、楕円を描く—ofCircle、ofEllipse
2-2-6　三角形を描く—ofTriangle
2-3　色の設定
2-3-1　コンピュータ上での色の表現
2-3-2　背景色と描画色
2-3-3　色を塗り分ける
2-3-4　透明度の付加
2-4　数値の記憶と計算
2-4-1　数値の計算
2-4-2　変数について
2-4-3　変数を使って図形を描く
2-4-4　画面の幅と高さを取得
2-5　たくさんの図形を一気に描く
2-5-1　繰り返し—for文
2-5-2　規則的に配置する—カウンタ変数を利用した演算
2-5-3　繰り返しを繰り返す
2-6　たくさんの値を記憶する—配列
2-6-1　配列の概念
2-6-2　繰り返しと配列の組み合わせ
2-6-3　乱数の使用
2-7　移動する—アニメーション
2-7-1　図形を移動する
2-7-2　アニメーションのプログラムの構造
2-7-3　物体を直線運動させる
2-8　条件分岐—「もし○○なら××せよ」
2-8-1　もし画面からはみ出たら反対から出現させよ
2-8-2　条件分岐の応用編—壁でバウンドさせる
2-9　たくさんの図形を移動する
2-9-1　たくさんの円を同時に動かす
2-9-2　配列を利用してたくさんの図形をまとめてコントロール
2-10　図形に触れる—インタラクション
2-10-1　インタラクションとは
2-10-2　マウスの位置の検知
2-10-3　マウスによるインタラクション
2-10-4　インタラクションとアニメーションを組み合わせる
2-11　より高度な表現へ
2-11-1　表現に現実味を持たせる
2-11-2　パーティクル—重力と摩擦力を導入
2-11-3　動きの軌跡をフェード

Interview 02：真鍋 大度

第3章　openFrameworksプログラミング中級編
3-1　プロジェクトの構造をより深く理解する
3-1-1　openFrameworksのプロジェクト構造について
3-1-2　openFrameworksとC++の関係
3-1-3　オブジェクト指向プログラミングとは
3-1-4　オブジェクト＝属性（プロパティ）＋動作（メソッド）
3-1-5　クラス＝オブジェクトの設計図
3-1-6　C++でのクラスの作成
3-1-7　ファイルを分割して管理する
3-1-8　UMLクラス図
3-1-9　クラスとしてtestAppを捉え直す
3-1-10　testAppはofBaseAppの子供
3-1-11　openFrameworksプロジェクト構造
3-2　いろいろなメディアを扱う
3-2-1　openFrameworksで扱うことのできるメディア
3-2-2　音を扱う：音とは何か
3-2-3　コンピュータで音を扱うには
3-2-4　波形の生成—ofSoundStream
3-2-5　サウンドの入力—ofSoundStream
3-2-6　サウンドファイルの再生—ofSoundPlayer
3-2-7　画像ファイルを扱う—ofImage
3-2-8　フォントデータを扱う—ofTrueTypeFont
3-2-9　動画の再生—ofVideoPlayer
3-2-10　動画のキャプチャ—ofVideoGrabber
3-3　OOOF：オブジェクト指向oFプログラミング
3-3-1　openFrameworksでオブジェクト指向プログラミング
3-3-2　新規クラスの生成
3-3-3　画面の中心に円を表示する—メソッドの追加 1
3-3-4　円の大きさと場所の初期値を指定する—コンストラクタの作成
3-3-5　円の大きさと場所の情報を取得、設定する—セッターとゲッター
3-3-6　円をアニメーションする—メソッドの追加 2
3-3-7　円が拡大縮小する動きを加える—メソッドの追加 3
3-3-8　画面をクリックすると、どんどん円が増殖する—複数のクラスの生成 1
3-3-9　円をクリックすると、細かな円に分裂する—複数のクラスの生成 2
3-4　アドオンの利用
3-4-1　アドオンとは
3-4-2　アドオンの使用 1—ofxBox2dを使う
3-4-3　アドオンの使用 2—ofxOpenCvを使用する
3-4-4　ofxBox2DとofxOpenCvを組み合せる
3-5　楽器を作る
3-5-1　ここまでの内容を統合する
3-5-2　楽器の構想
3-5-3　楽器の設計
3-5-4　プロジェクトの設計
3-5-5　実装
3-5-6　プロジェクト完成

Interview 03：市川 創太

第4章　openFrameworksプログラミング実践編
4-1　プレイヤーの演奏にリアルタイムに反応するグラフィックス
4-2　被写体の軌跡をビジュアライズ
4-3　物理計算を使ったグラフィックス
4-4　モーフィングのような鏡像

Text：計算によるデザイン（Design by Computations）—インタラクションを超えて

Appendix—Xcodeのテンプレートを使用せずにプロジェクトを作成する方法
Inde