openFrameworksでメディアアートをはじめよう

Life is Tech!ﾁｮｯﾄﾜｶﾙ人向けアドカレ、12/22の記事。

テックテックしてない記事でも可とのことだったので、ゆるめに、ほんのちょっとだけテックな記事を目指して書きます。

クリキャンをメディアアートで参加する人や、今後キャンプをメディアアートで参加してみたい人、openFrameworksやメディアアートにちょっと興味ある、やってみたいけどどうすれば…?という人に届けばいいな、という願いも込めて。

注：この記事での「メディアアート」は「デジタルアート」と近い意味で使ってます(LiTで使ってるニュアンスでしかこの言葉知らないよーという方は気にしなくても大丈夫です)

まずは自己紹介

LiTでは「きー」と呼んでもらっています。高2です。

LiTは'16の夏キャンプからで、その直後から今もずっと大阪土曜スクールに通っています。コースはWebサービス開発コース。

キャンプでの参加コースは、WebP(現Webサービス)、Webデザイン、映像編集(飼ってるインコの動画作ってました 笑)、メディアアート、Unity。

メディアアートコースに参加してopenFrameworksにめちゃめちゃハマり、ちょうど同じスクールにキャンプでの担当メンターが居たので、キャンプ以外でもメンターに質問飛ばしながら色々作ってました。

最近ではWebSコースに居ながらメディアアート的なことやり始めたので、もう一生逃れられないのだと思います…本当に楽しいので。

openFrameworksとは

oFサイトのトップページには「openFrameworksは創造的なコーディングのためのC++のオープンソースツールキットです」と書かれています。イメージをお伝えするならば、C++というプログラミング言語で絵を描けるというやつです。静止画なら数行書くだけでできちゃいます。それから、かなり色々なことが簡単に導入できてしまうので、初めてしまえばかなり手軽なのも特徴。

イメージを捉えるには見るのが一番！youtubeでopenframeworksと調べると沢山の作品が見られます。パーティクル(細かい粒が舞ったり弾けたり)やサウンドビジュアライザ、VJのようなものが多いですね。私もそういうの大好きです。

はじめの一歩

ここではmacユーザー向けにopenFrameworksのセットアップをご紹介

ダウンロードにとにかく時間がかかるので、安定した通信環境で充電しながら行いましょう。それから、放置していたらmacがスリープモードになってしまい何度か失敗した記憶があります。なので、 「システム環境設定」→「省エネルギー」にて、「電源アダプタ」パネルで「ディスプレイがオフのときはコンピュータを自動でスリープさせない」を選択、そしてディスプレイをオフにするまでの時間」スライダを「しない」にドラッグしておくと安心。ここ大事。

openFrameworks for osxをダウンロードします(ダウンロードページ)。

ダウンロードが終わったらファイルを展開し、任意の場所にファイルを移動します。デスクトップがわかりやすいかな。
projectJenerator_osxというのを使えばoFのプロジェクト(制作ファイル)を簡単に作れます。

App StoreでXcodeをインストールします(Xcode on the Mac App Store)。

インストールが終わったら「アプリケーション」への移動を忘れずに！(多分自動で促してくれます)
oFサイトのXcodeセットアップガイドをご参考に。
「ターミナル」はDockの「Launchpad」(ロケットのアイコン)→「その他」の中にあります。よく使うアプリは「Dock(アイコンがたくさん並んでいるバーのこと)でアイコンを二本指クリック」→「オプション▶︎Dockに追加」しておくと便利ですよ！

oFでの開発に役立つサイトと利用のコツ

openFrameworksを学ぶ誰しもが辿り着く場所、それがyoppaさんのサイト。
なんと、oF初心者に必要なことがほとんど書かれている素晴らしいサイトです。(あれっ、今書いてるこの記事、いる？)
数々の大学で講師をされていて、講義資料などをまとめて公開されているので見漁っているうちにどんどんいろんなことを知れます。本当におすすめ。
ここから「インタラクティブアート論」という、クリエイティブコーディングやopenFrameworksについての講義資料が見られますのでぜひぜひ。

利用のコツは、トップページ一番下の「search」で過去の記事(でもなるべく新しいもの)を見つけること。ここは検索能力が問われます…
検索のコツ。最初は「openframeworks」などで調べます。
ここでちょっと使いづらいところが、検索ワードに関係する記事は最新の10個しか遡れないところ。これを解決するためには、
まず出てきた記事の"Read More"をクリックし、記事に飛ぶ→(講義資料っぽいけれど第1回へのリンクがない！)→出てきた記事の講義名(「インタラクティブアート論 2018」など)で再度調べる
こうすることでその講義の資料の全記事へのリンクがある講義紹介ページにたどり着き、講義一連の全てを見られます。過去記事遡りたくなったらこのやり方を試してみてください。ここは自分用メモでもあります 笑



それから、忘れてはならないのがoFサイトのDocumentationページ。
なんでも載っています。そりゃそうだ。ただし、日本語訳されていないページも数多くあるので、読んでも理解できないことがあればgoogle検索。大体疑問に思うところは皆一緒です。

最後に

もう一度言います。XcodeとoF for osxをダウンロードしたらインタラクティブアート論2018の講義スライドを見漁りましょう！
それから、LiTキャンプをメディアアートで参加する方。メディアアートコースのメンターさんなら高確率で知っているので、「こういうのやりたいんです…」というふうに相談するときっといい助言をしてもらえると思います。

最後までお付き合い頂きありがとうございました。
もっとサクッとまとまった文章を書けるようになりたい…

こちらもよろしくお願いします。

github webSですが一年以上JSしか書いていません。オリジナルアプリ、最近はタイピングゲームを作っています。今季中に仕上げるのが目標です。同時に、three.jsで月一作品を公開するという目標も掲げています。最近gitにcommitできてませんねー、がんばろ。
twitter ぶつぶつつぶやいています。時々ラーメンの写真をあげたり作品紹介をしたりもしています。