今回は、Addonの使用の3回目として、ネットワークを活用したインタラクションについて考えていきます。ofxOscは、openFrameworksでOpen Sound Control(OSC)という通信プロトコルを使用するためのAddonです。OSCは、openFrameworksのアプリケーション同士をEthernetを介して通信することができ、これにより、ネットワークを介して複数のユーザが１つのアプリケーションを操作することが可能となります。またopenFrameworksのアプリケーションを他のアプリケーション、例えば、Max/MSPやPd、SuperCollider、さらにはTouchOSCといったiPhoneアプリなどからコントロールすることが出来るようになります。
ここまで3回にわたって、TidalCyclesを使用したライブコーディングを行ってきました。TidalCyclesで最終的に出力されるのは音 (音響、音楽) でした。それに対して、映像を出力するためのライブコーディングの環境も数多く存在します。
今回は、ビジュアルのためのライブコーディングの環境の中から以下の3つの開発環境/言語を取り上げます。
音のライブコーディングとはまた違った世界を楽しみましょう!
今回はp5.jsのライブラリー活用の2回目として、p5.jsで音を扱うためのp5.soundライブラリーを紹介します。
p5.soundライブラリーを使用することで、サウンドファイルの再生や、マイクやライン入力のキャプチャーだけでなく、音にエフェクトをかけたり、波形自体を生成したりと、サウンドに関する様々な機能が活用できます。さらに、FFTクラスを使用すると、音に含まれる周波数成分をリアルタイムに解析することが可能となります。この機能を使うことで、音の周波数成分を可視化して「音を視る」ことが可能となります。今回は、Soundライブラリーを用いたサウンドファイルの再生から、FFTを使用した音のビジュアライズまでを順番に解説していきます。
今回も、さらにml5.jsを使用して機械学習をつかった応用的なコンテンツを作成していきます。
一つのデータに複数の情報が含まれる場合、全ての情報が必要な情報とは限りません。そのようなデータの中から必要な情報内容だけを取り出したり、有意義な情報に置き換えたりするのが特徴抽出 (Feature Extraction) 処理です。特徴抽出処理を行う事で、機械学習で扱う予測モデルの内容をより有効なものに改善する事が出来ます。
今回は、この特徴抽出を使用したインタラクティブなコンテンツの作成を目指します。まず始めに複数の画像を学習させその特徴を抽出することで画像を判別するサンプルを作成します。さらにその仕組みを応用してジェスチャーによってコントロール可能なインタラクティブなコンテンツの作成に挑戦します。
企業のホームページや、ニュースなどの情報サイトでは、常に大量のWebページを扱い頻繁に更新しています。このような大規模なWebサイトでは、手作業で1ページずつHTMLとCSSを記述していては膨大な作業量になってしまいます。
現在では多くのWebサイトで「コンテンツマネジメントシステム（Contents Management System = CMS）」と呼ばれる、Webサイトを構成するテキストや画像などのデジタルコンテンツを統合・体系的に管理し、配信など必要な処理を行うシステムを使用しています。CMSを利用することで、簡単にページを追加、更新、管理することが可能となり、またサイト全体のデザインの統一やアクセス解析など、様々な機能を使用することが可能となります。
CMSには無料のもの、有料のもの、サーバー側で使用する言語などに応じて様々なシステムがあります。現在CMSのマーケットシェアは、圧倒的にWordPressというシステムで占められています。2017年11月の時点で、全てのCMSのうちWordPressの割合は約60%という調査結果もあります。
今回は、WordPressの無料ブログ版のサービス WordPress.com を使用してCMSの使い方とカスタマイズの基本について紹介します。
今回は物理シミュレーションを行うことができる、ofxBox2DというAddonをとりあげます。
ofxBox2Dは、Box2DというC++で書かれた2Dの物理演算エンジンをopenFrameworksのAddon化したものです。Box2Dは質量、力、速度、摩擦といった古典物理学(ニュートン力学)の演算を高速に行う、物理法則の演算のためのライブラリーで、もともとはC++で書かれていますが、現在では、Java、C#、Python、JavaScriptなど様々な言語に移植されています。ofxBox2Dを使うことで簡単な物理法則を援用したアニメーションだけでなく、2次元のゲームやインタラクティブなコンテンツなどに応用可能です。今回は、ofxBox2Dの導入から、形を定義して物理世界に追加する方法、大量の物体を追加するための工夫などを紹介していきます。
今回から、いよいよml5.jsとp5.jsを活用した機械学習プログラミングに挑戦していきます!
今回は、ml5.jsのパッケージの中でも比較的に簡単にプログラミング可能な、Image Classificationを利用したスケッチを作成します。Image Classification
(画像分類問題)とは、入力画像に対してラベル付けするアルゴリズムです。シンプルな仕組みですが、応用範囲の広い機械学習の活用分野です。
まず始めに画像ファイルを読み込んでラベル付けするサンプルから始めて、Webcamの映像をリアルタイムに分析して映像に映っている物体をラベル付けするプログラムを目指します。
この講義では、ここまで主に２次元平面上での描画による表現を扱ってきました。今回は２次元での表現からさらに（文字通り）次元を越えて、３次元空間での表現について考えていきたいと思います。
openFrameworksで3Dグラフィクスを扱う手法はこれまでとさほど変化はありません。なぜなら、openFrameworksの描画の基本はOpenGLで行っています。OpenGLはそもそも３次元のグラフィクスの描画のために開発されたライブラリであり、最初から３次元空間をとり扱うための様々な機能が備わっています。
しかし、3Dの物体を扱うには、これまでとは違った様々な要素が加わります。カメラ（視点）、ライティング、光と影（シェーディング）、奥行の重なりなどといった２次元の平面には無かった様々な技術や概念の理解が必要となります。
プログラムのサンプルは、以下からダウンロードしてください。
p5.jsは、その設計思想として、構造をあまり複雑にせず創造的な部分に集中できるよう焦点を絞っています。グラフィクスとモーションを作り、マウスやキーボードといった汎用的な入力デバイスに反応する機能が基本です。しかし、それ以上のことを行うために、p5.jsではライブラリー (Libraries) というものが用意されています。ライブラリーとは汎用性の高い複数のプログラムを、再利用可能な形でひとまとまりにしたものです。p5.jsでも用途に応じて様々なライブラリがまとめられ、入手できるようになっています。
今回はp5.jsのライブラリーを使う第１弾として、p5.domを使用します。このライブラリーによって、p5.jsのcanvasの枠を越えて、HTML 5のDOMに直接アクセスすることが可能となります。例えば、Webブラウザで用意されている、ボタンやチェックボックス、スライダーなどのGUIのパーツを利用したり、Webカメラやマイクなどのデバイスへのアクセスしてインタラクションすることが出来るようになります。
Addon(アドオン)とは、openFrameworksに機能を拡張するためのライブラリーやフレームワークです。processingのLibrariesのように、openFrameworks単体ではできなかった様々な機能を実現することが可能となります。Addonは、oF本体の開発者以外でも独自に開発して追加することが可能であり、繰り返し用いる機能や、CやC++で記述された既存のライブラリーをopenFrameworksに統合することが可能となります。
今回はAddonの導入を、まずofxGuiというプロジェクトにGUIを追加するアドオンで行います。ofxGuiを使用することで、例えば周囲の環境が異なる場所でインスタレーションを設置する時など、すぐにパラメータを最適な状態に調整して保存することができ、とても便利です。