openFrameworks + OOP – オブジェクト指向プログラミング入門
これまでのopenFrameworksのプロジェクトは、ofApp.h と ofApp.cpp という2つのファイルに全てのプログラムを記述してきました。しかし、この方法では徐々にプロジェクトが複雑になり巨大化するうちに、扱いが困難になってきます。プログラミングをわかりやすく保つには、役割ごとに内容を分割して記述すべきです。openFrameworksの元となるプログラミング言語であるC++では「オブジェクト」という単位でプログラムを構造化していきます。このオブジェクトを基本単位にしたプログラミング手法のことを「オブジェクト指向プログラミング (Object Oriented Programing = OOP)」と呼びます。OOPはC++だけでなく、Java、Python、Ruby、C#、Objective-C、Swiftなどでも利用されていて、現在のプログラミング言語の主流となっているパ
第4回: インタラクション 2 – 顔をつかったインタラクション、FaceTracker
今回も、前回に引き続き映像とのインタラクションについて考えていきます。 前回はOpenCVを使用して、映像解析の基本を体験しました。今回はより高度な映像解析の例として、顔の表情をトラッキングして解析する「フェイス・トラッキング (Face Tracking)」の技術を実際にプログラミングしながら体験します。 フェイス・トラッキングは計算量が多くProcessing単体では処理が追いつかないので、今回は解析部分はopnenFrameworksを使用します。openFrameworksで解析した結果をOSC (Open Sound Control) でProcessingに送出してその数値を元にProcessing側で視覚化して表現に利用していきます。 この手法は、このWSで今後行うセンサー(久世先生担当)の情報をProcessingで視覚化する際にも使用する手法です。しっかりマスターしましょ
第12回: Processingによる音の可視化、minimライブラリを活用する
前回のProcessing soundライブラリを使用した音響の可視化は、バージョンによって挙動が不安定でした。そこで、今回は前回のリベンジとして、より確実なminimライブラリを使用する方法で再度Processingによる音響の視覚化に挑戦します。基本的な原理の理解から、高度なオーディオ・ビジュアル表現まで順を追って解説していきます。 スライド資料 授業内で使用するスライド資料は、下記から参照してください。 スライド資料12月25日 サンプルプログラム サンプルプログラムは、下記からダウンロードしてください。 サンプルプログラム12月18日 松岡寛治 — 03 December 2018 14:30 大変興味深い内容でした。自分でやってみようと思います。 Name (required) Email (required) Website Your comment (required)
第11回: Processingによる音の可視化、アプリケーション間でサウンドをルーティングする
前回までのOSCによるSuperColliderとProcessingとの連携とはまた別の方法で、双方のアプリケーションを用いた音の視覚化を試みてみたいと思います。 まず始めにProcessingを用いて音を視覚化する方法を、より厳密に検討します。単純に感覚的手法で視覚化するのではなく、音を周波数成分に分解しその変化を視覚的に表現します。ここでは、FFT（高速フーリエ変換）という手法を用います。 次に、この視覚化の手法を用いて、SuperColliderの音をProcessingに送り、視覚化する方法について解説します。Soundflowerというユーティリティーを用いて仮想的なサウンドデバイスを生成し、アプリケーション間で音をルーティングします。 スライド資料 授業内で使用するスライド資料は、下記から参照してください。 スライド資料12月18日 サンプルプログラム サンプルプログラムは、
ワークショップ「かたちと音をコーディングしよう!」応募ページ
SFCサイバー・サウンド・プロジェクト（CSP）によるワークショップの応募ページです。 CSPでは、SFC Open Research Forum 2014の一環として、ワークショップを実施します。コーディング（プログラミング）作業を極力排した、オーディオビジュアル作品制作を体験します。「画像 → 音」「音 → 画像」変換プログラムを利用して、視覚的にサウンドを操作し、聴覚的にかたちを生みだします。 プログラミングのスキルは問いません。コンピュータ（MacまたはWindows）の基本操作さえ習得していれば参加可能です。 スライド資料 当日使用するスライド資料は、下記から参照してください。 ワークショップ、スライド資料 概要 講師: 田所 淳 日時: 2014年11月22日（土）、13:15 〜 18:00 定員: 8名 参加費: 無料 会場: 東京ミッドタウン ホール B1F ワークショッ
第9回: openFrameworks 複数のシーンの管理・切替え、ofxStateMachine
openFrameworksで作品をつくる際に、場合によっては一つのアプリケーションの中で複数の場面を切り替える必要が出てくる場合があります。そうした際にtestAppクラスの中に全ての場面を詰め込もうとすると、各操作での条件分岐などが複雑になり、扱いが大変となります。今回は、大量の場面を効率的に取り扱う方法について考えていきます。 サンプルファイル 紹介したサンプルは、いつものようにGithubからダウンロード（もしくは、pull）してください。 https://github.com/tado/tau_ma2_14 スライド資料 スライド資料は下記から参照してください。 スライド資料11月11日
第7回: openFrameworks 作品制作のためのTips、画像・動画を使用、グリッチ（glitch）
第7回: openFrameworks 作品制作のためのTips、画像・動画を使用、グリッチ（glitch） ワークショップの後半は、作品制作のためのTipsとなるようなテーマを各回とり上げていこうと思います。 今回は、作品に画像（Jpeg、PNG、GIFなど）や動画（mp4、mov、aviなど）のデータを読み込んで表示・再生する方法を紹介します。さらに画像や動画のピクセル単位でのデータにアクセスしその情報から画像や動画を再構成する方法について紹介します。最後に、おまけとして画像データをわざと破壊することで崩れた画像を生成する「グリッチ（glitch）」というテクニックを紹介します。 サンプルファイル 紹介したサンプルは、いつものようにGithubからダウンロード（もしくは、pull）してください。 https://github.com/tado/tau_ma2_14 スライド資料 スライ
SSAW14 – サウンド&ソフトウェアアート 2014
多摩美術大学メディア芸術コース 対象：2年 (選択必修) 前期・第1クォーター 火曜、3〜4限 206教室 この授業について 安価な電子部品や、分解した電気製品・玩具を利用(ハック)してその可能性を最大限に発揮させたり、Arduinoという汎用のデバイスにセンサーを接続したりプログラムを書くことで、創造的なインターフェイス・デザインとしての自作電子楽器や映像装置を制作します。最終発表会では、創作した楽器を用いたパフォーマンスを行って、身体と電子デバイスが呼応したハイブリッドな音楽制作の可能性を探求します。 講義ノート Mozziを使ってみる センサーでMozziをコントロール Mozziでサンプリング&プレイバック PdとMozziを連携する
メディア芸術演習 VI – メディア・アート II 2014
多摩美術大学美術学部情報デザイン学科メディア芸術コース 対象: 3年 後期 担当: 火曜 3〜4限: 田所 淳 水曜 3〜4限: 平川 紀道 助手: 時里充 演習について この演習の田所担当の火曜日では、openFrameworksを始めとする、オープンソースのソフトウェアフレームワークを用いて、メディアアート作品を制作するための実践的なスキルの習得を目標とします。 ここ数年、openFrameworksやProcessing、PureData、vvvvなどの開発フレームワークの発展に共なって、「クリエイティブ・コーディング (creative coding)」と呼ばれるコードによる表現も徐々に市民権を得てきています。こうしたコードによる表現は、メディアアートやコンピュータアートの分野で今後も重要な役割を果たしていくでしょう。 コード（プログラミング）による表現と一口にいっても、そのジャン
第8回: openFrameworks 3Dグラフィクス、OpenGL
このワークショップでは、ここまで主に２次元平面上での描画による表現を扱ってきました。今回は２次元での表現からさらに（文字通り）次元を越えて、３次元空間での表現について考えていきたいと思います。 とはいっても、その手法はこれまでとさほど変化はありません。なぜなら、openFrameworksの描画の基本はOpenGLで行っています。OpenGLはそもそも３次元のグラフィクスの描画のために開発されたライブラリであり、最初から３次元空間をとり扱うための様々な機能が備わっています。 とはいえ、3Dの物体を扱うには、これまでとは違った様々な要素が加わります。カメラ（視点）、ライティング、光と影（シェーディング）、奥行の重なりなどといった２次元の平面には無かった様々な技術や概念の理解が必要となります。 サンプルファイル 紹介したサンプルは、いつものようにGithubからダウンロード（もしくは、pull
第6回: Web応用3 – 最終課題「インタラクティブ・サウンド・アニメーション」に向けて
最終課題のテーマ :「インタラクティブ・サウンド・アニメーション」 金曜日のサウンドの授業で作成した音を使用して、Webブラウザ上でインタラクティブなアニメーション作品を制作し発表する。 音響素材 : サウンド（矢坂先生） プログラミング : ネット（田所） この2つの要素を融合する インタラクションは、キーボード操作を基本とするが、それ以外のインタラクション（マウス、Webカメラ、センサー?）を使うのは自由 授業では、p5.jsを使用して解説するが、それ以外のJavascriptのライブラリ、その他の言語を使用しても良い ただし作品はWebブラウザで発表できるものに限定 先週のプログラムの復習 先週作成した、キー入力によって、アニメーションと音を再生するサンプルについて、再度復習します。 sketch.js var sample = []; var animation; var num;
第5回: Web応用2 – P5.jsでサウンドプログラミング
前回に引き続きp5.jsでWebブラウザ上でプログラミングしていきます。今回からは、p5.jsでサウンドを扱っていきます。最終目標のイメージとして、音と映像をインタラクティブに操作する作品、例えば、patatapのような作品をWebブラウザ上で発表します。 patatap – http://www.patatap.com/ サンプルファイル 今回とりあげるプログラムのサンプルは、全て下記からダウンロード可能です。 https://github.com/tado/SoundNet14 サウンドファイルの準備 手元にサウンドファイルを準備します。もし、手元に適当なサウンドがない場合には、freesoundやsoundcloudからフリーのサウンド素材をダウンロードして使用しましょう。 最終的に作品で使用するサウンドは、金曜日のサウンドの授業で作成したもので作成します。 サウンドファイルを再生す
第4回: Web応用1 – Webブラウザでプログラミング、p5.js入門
この講義のここまで前半3回では「Web基礎」と題して、HTMLとCSSの基本、そしてTumblrを使用したオンライン・ポートフォリオの作成について解説してきました。前半のまとめとして、作成したオンライン・ポートフォリオのベースとなる部分を提出してもらいます。提出方法は授業内で指示します。 いよいよ後半は、サウンド&ネットのサウンドのパートとも協力して、Web上で音を使用した作品を公開することを最終目標に、新たな内容に進んでいきます。 JavaScript – Webブラウザでプログラミングする これまで取り扱ってきた、HTMLやCSSは人工的に仕様が策定された言語ではありますが、プログラミング言語ではありませんでした（HTMLはマークアップ言語、CSSはスタイルシート言語）。 HTMLやCSSとは別に、Webブラウザ上で動作させることのできるプログラミング言語が存在します。その代表的な言語
第3回: openFrameworks基本 – プログラムの構造をつくる、OOP入門
Githubでのサンプル配布 今回から講義内で使用するサンプルプログラムをGithubというWebサービスを使用して、配布していきます。 Github メディア芸術演習 VI – メディア・アート II 2014 Githubの仕組みを理解するためには、まずGitというバージョン管理システムについて簡単に知っておく必要があります。 バージョン管理システムとは、コンピュータ上のファイルの変更履歴を管理するためのシステムで、主にプログラムのソースコードやテキストファイルなどの管理に用いられます。プログラミングをしていて、更新した内容がうまく作動せず、過去の特定の時点まで状態を戻す必要になる場合があります。そのために、毎回変更を加える前に手動でバックアップするのは面倒ですし、ファイル容量も無駄に使用してしまいます。現在のソフトウェア開発の現場では、バージョン管理システムを使用して効率的に作業履歴
Processingによるデータの可視化 – 時系列のデータを可視化する
今日の目標 時系列のデータファイル(タブ区切りのテキスト)を読みこみ、Processingで可視化する 「ビジュアライジング・データ」の4章、「時系列」のサンプルプログラムを解析 まずは普通にグラフ化する手法を学ぶ Visualizing Dataのサンプルプログラムをダウンロード 書籍「ビジュアライジング・データ」のサンプルプログラム一式をダウンロードする 今日の内容のベースとなる、時系列のデータをプロットするプログラムもこの中に収録されている ダウンロードURL http://benfry.com/writing/archives/3 シンプルなプロット表示を理解する 時系列のデータを点の連なりで表現 「ch04-milkteacoffee」→「figure_01_just_points」を開く まずは実行してみる 点によるシンプルなプロットが表示される このプロットは、dataフォル
第８回：画像処理・再合成
今回は、画像処理について考えていきます。Processingに画像ファイルを読み込んで表示したり、画像の情報を分析して再合成する方法について解説します。
openFrameworksで、Leap Motionを使ってみた: その2 – Leap Motion SDKから情報を取得
openFrameworksで、Leap Motionを使ってみた: その2 – Leap Motion SDKから情報を取得 前回のエントリーが好評だったので、さらにLeap Motionについて。 前回紹介したように、ofxLeapMotionでは、あらかじめ用意されているofxLeapMotionSimpleHandクラスを使用すると、とても簡単に手の座標などを取得できる。とはいえ、Leap MotionのSDKで用意されているフルの機能を活用できるところまでは充実していないよう。 しかし、ofxLeapMotionでは、Leap Motion SDKの情報を直接取得できる方法も用意されている。これを使用するとより多彩な情報が取得可能。詳しくは、Leap Motionから提供されているDocumentationを参照。 下記のサンプルでは、まずLeapの手(Hand)を取得して、それ
openFrameworksで、Leap Motionを使ってみた!
待ちに待ったLeap Motionがようやく届いたので、ちょびっとだけ触ってみた。 インストールとセットアップはとにかく簡単。Leap Motionのセットアップページに行って、一式ダウンロードとインストールするだけで、すぐに動作する。デモアプリの完成度もなかなかのもの。ユーザーにストレスを感じさせない環境構築までのナビゲーションのスムーズさに唸らされる。 ひと通り遊んだところで、openFrameworksからLeap Motionを使ってみることに。そのものズバリなofxLeapMotionというアドオンが開発されているので、それをそのまま利用できる。ただし、いくつかバージョンがありいくつか試した中で下記のリポジトリのバージョンが問題なくビルドできて、Leap Motionからのメッセージも受信できた。 https://github.com/jasonrwalters/ofxLeapM
Processingによるネットワーク情報のビジュアライズ 2
最終課題の提出方法 最終課題は以下の方法で制作・提出してください。 最終課題テーマ「芸大のネットワーク情報をビジュアライズ」 配布したJSONデータを利用して、芸大のネットワーク情報をビジュアライズ(可視化)してください。この授業ではProcessingを視覚化のツールとして使用しましたが、その他のツールや自分で独自にプログラミングしても構いません。ただし、最終的にWebブラウザで閲覧できる形式にしてください。 提出期限: 2013年7月31日 提出方法: 作成したプログラム一式をZip圧縮して、以下のメールアドレスに送付してください。 tadokoro+geidai13[at]gmail.com …※ [at]を@に変換 今回も芸大のネットワークの状況をビジュアライズ(視覚化)する手法について、サンプルをみながら解説していきます。 サンプルファイルのダウンロード Processingのソ
Bio Media Art Workshop 2013 (BMAW13)
2013.06.09 : ガイダンス – Bio Media Art Workshopについて、Processingの復習 2013.06.16 : ProcessingとArduinoを接続する 2013.06.23 : ProcessingとArduinoを接続する 2 – 時系列データの視覚化、Touche導入 2013.06.30 : Toucheセンサーを使う 1 – Toucheセンサーで物体へのタッチを検出 2013.07.07 : Toucheセンサーを使う 2 – Touche for Arduinoの値をつかってProcessingで表現する 2013.07.15 : Toucheセンサーを使う 3 – Touche for Arduinoで音を扱う 2013.07.21 : Toucheセンサーを使う 4 – Touche for Arduinoで音を扱う2、複数のサ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
