タグ

ブックマーク / yoppa.org (27)

  • HTML5実践 – Three.jsで3Dプログラミング

    今回も前回に引き続き、HTML5から使用できるようになった新しい機能について解説していきます。今回は、WebGLというWebブラウザ上で高度な3Dグラフィックを生成、表示できる技術について取り上げます。

    HTML5実践 – Three.jsで3Dプログラミング
    ottonove
    ottonove 2018/11/26
  • 人工知能、機械学習、ライブコーディング - yoppa org

    先日「計算美学しよう!」という研究グループで、ライブコーディングについての簡単なプレゼンとデモをした。その後のディスカッションで人工知能、人工生命、美学といった様々な専門家の議論を専ら横で聞いていていろいろ刺激され、アイデアが湧いてきた。 その後、TidalCyclesの開発者のAlex McLeanによる “Lessons from the Luddites (ラッダイト運動からの教訓)” という記事を読んで、研究会での議論ともかなり重なる部分もあり、人工知能機械学習とライブコーディングの関係についていろいろ思いを巡らせた。アイデアを忘れてしまわないようにメモ的に記録してみる。 個人的には、現在のAIブームにはちょっと懐疑的な部分もある。現在の深層学習のアプローチ、巨大なデータを処理して効率的に学習しながら最適解を見つけていくような方法は、今後もどんどん発展し様々なジャンルに適用されて

    人工知能、機械学習、ライブコーディング - yoppa org
    ottonove
    ottonove 2018/01/26
  • 第12回: 音響と映像の融合 – Minimを使用してProcessingで音を可視化する

    この講義では、前半にProcessingを使用したインタラクティブなアニメーションの基、後半はSonic Piを使用したサウンドプログラミングを行ってきました。今回はいよいよこの両者を融合して、音と映像を同時に用いた表現に挑戦していきたいと思います。 まず始めにProcessingを用いて音を視覚化する方法を検討します。単純に感覚的手法で視覚化するのではなく、音を周波数成分に分解しその変化を視覚的に表現します。ここでは、FFT(高速フーリエ変換)という手法を用います。 次に、この視覚化の手法を用いて、Sonic Piで作成してレコーディングした音をProcessingで読み込み、視覚化する方法について解説します。サウンドの解析には、Processingのライブラリである、Minimを使用します。 スライド資料 音響と映像の融合 – Minimを使用してProcessingで音を可視化する

    第12回: 音響と映像の融合 – Minimを使用してProcessingで音を可視化する
    ottonove
    ottonove 2017/10/20
  • 第13回: 音響と映像の融合 – Minimを使用してProcessingで音を可視化する

    この講義では、前半にProcessingを使用したインタラクティブなアニメーションの基、後半はSonic Piを使用したサウンドプログラミングを行ってきました。今回はいよいよこの両者を融合して、音と映像を同時に用いた表現に挑戦していきたいと思います。 まず始めにProcessingを用いて音を視覚化する方法を検討します。単純に感覚的手法で視覚化するのではなく、音を周波数成分に分解しその変化を視覚的に表現します。ここでは、FFT(高速フーリエ変換)という手法を用います。 次に、この視覚化の手法を用いて、Sonic Piで作成してレコーディングした音をProcessingで読み込み、視覚化する方法について解説します。サウンドの解析には、Processingのライブラリである、Minimを使用します。 スライド資料 音響と映像の融合 – Minimを使用してProcessingで音を可視化する

    第13回: 音響と映像の融合 – Minimを使用してProcessingで音を可視化する
    ottonove
    ottonove 2017/10/20
  • 第12回:Minimによる音響の視覚化、FFTによる音響解析と可視化

    前回のMinimの導入では、サウンドファイルを再生し、波形を表示することができるようになりました。しかし、音の波形を表示したら音響を視覚化したことになるでしょうか。実は我々の耳は音を波形ではなく、周波数に分解して知覚しています。ですので、波形をそのま操作して表示しても、あまり音と一致した映像にはなりません。音を周波数の帯域ごとの音量に分解するには、フーリエ解析という手法を用います。これにより、音を周波数帯域ごとの強さにわけて取得することが可能となります。今回は、このフーリエ解析を利用して、音を可視化してみましょう。 プログラムサンプル7月6日 (Google Docsヘリンク) スライドを直接開く

    第12回:Minimによる音響の視覚化、FFTによる音響解析と可視化
    ottonove
    ottonove 2017/10/20
  • Search Results for “SuperCollider” – Page 5 – yoppa org

    ottonove
    ottonove 2017/10/20
  • openFrameworks入門

    今日やること 火曜日のワークショップでは、openFrameworksを開発環境の軸として使用していきます。今回はまずopenFrameworksの開発環境を準備して、付属のサンプルをいろいろ見てみます。その後、簡単なプログラムを作成してみます。 openFrameworksって何? 開発環境を準備する openFrameworksのダウンロード Mac: Xcodeのセットアップ Win: Visual Studioのセットアップ サンプルを動かしてみる 新規プロジェクトの作成 簡単な形を描画/アニメーション 課題 openFrameworksって何? イントロダクション: ビデオを視聴 OF Showreel from openFrameworks on Vimeo. openFramwroksとは何か? openFrameworksとは何なのか、openFrameworksのトップペ

    openFrameworks入門
  • 番外編: Sonic Piでサウンドプログラミング

    今回は、講評会とオープンキャンパスも終了したので、番外編として今まで扱ってきたopenFrameworksとは別のトピックスをとりあげます。 Sam Aaronを中心に開発された、Sonic Piは、シンプルな文法でありながら格的な音楽制作や音響生成を可能とする、新しい音楽用プログラミング言語であり開発環境です。もともとは、Raspberry Piで動かす教育用の言語としてデザインされていますが、現在では、OS X、Windows版も開発され、汎用的な音楽開発環境となっています。Max/MSPやPdといったグラフィカルな開発環境とは別の文字ベースのプログラミング環境ですが、SuperColliderやCsoundといった他の音楽プログラミング言語より簡単に習得が可能です。 今回は、このSonic Piを紹介していきます。 スライド資料 番外編: Sonic Piでサウンドプログラミング

    番外編: Sonic Piでサウンドプログラミング
  • Tidalでライブコーディング! – セットアップ編

    注意!! : TidalCyclesがver 0.8にアップデートされ、インストールが大幅に簡略化されました。新しいバージョンでのインストール方法はこちらを参照してください。 TidalCycles 0.8 リリース Tidalとは? Tidalは、Alex McLean氏によって開発されたHaskellを拡張したライブコーディング(Live Coding)環境です。 Tidal http://tidal.lurk.org/ Alex McLean http://yaxu.org/ そもそもライブコーディングとは何かというと、ざっくりと言うと、プログラムをリアルタイムに実行しながらコーディングする行為自体をパフォーマンスするジャンルです。主に、音楽や映像を生成することが多いですが、Webや詩などその適用範囲は拡がっています。 Wikipedia https://en.wikipedia.o

    Tidalでライブコーディング! – セットアップ編
  • SuperCollider自主練 – 基礎編その4

    1.9 Synthの定義 これまでのサンプルは、音を再生する際に Synth(“temp__0” : 1000) というようなメッセージが出力されていた。 内部的に繋ぎあわされたUGenのセットは、SynthDef(Synthの定義)にまとめられる、そこではどのUgenを用いるのか、また、どのように繋りあうのかが記述されている。SCのサーバーはそれらの定義を解釈して音響を生成する。 実はこれまでの例で用いてきた、{}.play という書式を用いた際には、SCはこれらの処理を目に見えないところで自動的に行い、一時的な名前をつけてSynthを生成し、自動処理していた。 より明白な方法でこの処理を行うことが可能。作成したパッチをSynthDefという形式で包みこんで、名前をつけて特定する。また、この際に名前をつけるだけでなく、出力するバスをOut.arメッセージを使用して指定しなければならない。

    SuperCollider自主練 – 基礎編その4
  • 第3回: Web応用1 – Webブラウザでプログラミング、p5.js入門

    この講義のここまで前半3回では「Web基礎」と題して、HTMLCSSの基、そしてTumblrを使用したオンライン・ポートフォリオの作成について解説してきました。前半のまとめとして、作成したオンライン・ポートフォリオのベースとなる部分を提出してもらいます。提出方法は授業内で指示します。 いよいよ後半は、サウンド&ネットのサウンドのパートとも協力して、Web上で音を使用した作品を公開することを最終目標に、新たな内容に進んでいきます。 JavaScript – Webブラウザでプログラミングする これまで取り扱ってきた、HTMLCSSは人工的に仕様が策定された言語ではありますが、プログラミング言語ではありませんでした(HTMLはマークアップ言語、CSSはスタイルシート言語)。 HTMLCSSとは別に、Webブラウザ上で動作させることのできるプログラミング言語が存在します。その代表的な言語

    第3回: Web応用1 – Webブラウザでプログラミング、p5.js入門
  • 第5回: Web応用2 – P5.jsでサウンドプログラミング

    前回に引き続きp5.jsでWebブラウザ上でプログラミングしていきます。今回からは、p5.jsでサウンドを扱っていきます。最終目標のイメージとして、音と映像をインタラクティブに操作する作品、例えば、patatapのような作品をWebブラウザ上で発表します。 patatap – http://www.patatap.com/ サンプルファイル 今回とりあげるプログラムのサンプルは、全て下記からダウンロード可能です。 https://github.com/tado/SoundNet14 サウンドファイルの準備 手元にサウンドファイルを準備します。もし、手元に適当なサウンドがない場合には、freesoundやsoundcloudからフリーのサウンド素材をダウンロードして使用しましょう。 最終的に作品で使用するサウンドは、金曜日のサウンドの授業で作成したもので作成します。 サウンドファイルを再生す

    第5回: Web応用2 – P5.jsでサウンドプログラミング
  • 第4回: Web応用2 – P5.jsでサウンドプログラミング

    前回に引き続きp5.jsでWebブラウザ上でプログラミングしていきます。今回からは、p5.jsでサウンドを扱っていきます。最終目標のイメージとして、音と映像をインタラクティブに操作する作品、例えば、patatapのような作品をWebブラウザ上で発表します。 patatap – http://www.patatap.com/ スライド資料 Web応用2 – P5.jsでサウンドプログラミング

    第4回: Web応用2 – P5.jsでサウンドプログラミング
  • Interactive Music II – 東京藝術大学

    2013.10.01 : SuperCollider入門 2013.10.09 : SuperCollider入門 2 – 関数とUGen 2013.10.16 : SuperCollider入門 3 – 音を混ぜる(Mix)、楽器を定義(SynthDef) 2013.10.24 : SuperCollider入門 4 – 楽器を定義、変調合成(RM, AM, FM) 2013.10.30 : SuperCollider入門 5 – 時間構造をつくる 2013.11.06 : SuperCollider実習 1 – オリジナルの楽器を作ろう! 2013.11.14 : SuperCollider応用 JITLib – ライブコーディング 1 2013.11.27 : SuperCollider応用 JITLib – ライブコーディング 2 2013.12.05 : SuperCollide

    Interactive Music II – 東京藝術大学
  • Shadertoneで遊んでみた – 導入編

    Shadertoneで遊んでみたら、なかなか面白かったので、備忘録としてブログに書いてみる。 Shadertoneは、ソースコードがGithubで公開されている。 https://github.com/overtone/shadertone このリポジトリの要約をみると “A mix of www.shadertoy.com and Overtone” とある。理解してみるとなかなか的を得た要約なのだけれど、最初は何のことやらという感じだったのでここから解読してみる。 まず、shadertoyの方だけれど、こちらはGLSL(Shader)をWebブラウザ上で実行とコーディングする環境。GLSL sandbox に近い感じ。まあ、こちらは理解できる。 問題は、Overtoneのほうで、こちらはオフィシャルのWebサイトが用意されている。 http://overtone.github.io/

    Shadertoneで遊んでみた – 導入編
    ottonove
    ottonove 2015/08/24
  • 第11回: Processingによる音の可視化、アプリケーション間でサウンドをルーティングする

    前回までのOSCによるSuperColliderとProcessingとの連携とはまた別の方法で、双方のアプリケーションを用いた音の視覚化を試みてみたいと思います。 まず始めにProcessingを用いて音を視覚化する方法を、より厳密に検討します。単純に感覚的手法で視覚化するのではなく、音を周波数成分に分解しその変化を視覚的に表現します。ここでは、FFT(高速フーリエ変換)という手法を用います。 次に、この視覚化の手法を用いて、SuperColliderの音をProcessingに送り、視覚化する方法について解説します。Soundflowerというユーティリティーを用いて仮想的なサウンドデバイスを生成し、アプリケーション間で音をルーティングします。 スライド資料 授業内で使用するスライド資料は、下記から参照してください。 スライド資料12月18日 サンプルプログラム サンプルプログラムは、

    第11回: Processingによる音の可視化、アプリケーション間でサウンドをルーティングする
    ottonove
    ottonove 2015/07/17
  • openFramewoks – OSC (Open Sound Control) を利用したネットワーク連携

    今回は、ネットワークを使用したopenFrameworks同士の連携と、openFrameworksと他のアプリケーションとの連携について取り上げます。openFrameworksでネットワークを利用す方法はいくつかありますが、今回はその中で比較的扱い易いプロトコルである、Open Sound Control (OSC) についてとりあげたいと思います。 Open Sound Control (OSC)とは Open Sound Controlは、カリフォルニア大学バークレー校にある CNMAT(The Center for New Music and Audio Technologies)が開発した、通信プロトコルです。その特徴について、CNMATのページではOSCについて下記のように要約されています。 Open Sound Control (OSC) is a protocol for

    openFramewoks – OSC (Open Sound Control) を利用したネットワーク連携
  • Pd入門2 – 音響合成、Pdでシンセサイザーをつくる

    今回から、より格的にPdで音を扱う方法について解説していきます。今回は音響合成、つまりシンセサイザーが音を合成するしくみをPdで再現してみます。今回は、代表的な音響合成の仕組み「加算合成」「減算合成」「変調合成 (AM、RM、FM)」という3つの方式についてPdで実際にプログラミングしながら学んでいきます。 サンプルファイルのダウンロード 今回の解説でとりあげた、Pdのサンプルは下記のGithubのリポジトリからダウンロードしてください。 サンプルファイルのダウンロード 今日の内容 前回に引き続きPdの基を学んでいきます。今回は「Pdでシンセサイザーをつくる」というテーマで進めていきます。 コンピューターが一般に普及する以前から、世の中には多くの電子楽器が存在し、その歴史は100年以上に及びます。そして、現在も進化を続けています。その歴史の中で、様々な音響合成(= 音色を合成する技術)

    Pd入門2 – 音響合成、Pdでシンセサイザーをつくる
  • 第6回: Web応用3 – 最終課題「インタラクティブ・サウンド・アニメーション」に向けて

    最終課題のテーマ :「インタラクティブ・サウンド・アニメーション」 金曜日のサウンドの授業で作成した音を使用して、Webブラウザ上でインタラクティブなアニメーション作品を制作し発表する。 音響素材 : サウンド(矢坂先生) プログラミング : ネット(田所) この2つの要素を融合する インタラクションは、キーボード操作を基とするが、それ以外のインタラクション(マウス、Webカメラ、センサー?)を使うのは自由 授業では、p5.jsを使用して解説するが、それ以外のJavascriptのライブラリ、その他の言語を使用しても良い ただし作品はWebブラウザで発表できるものに限定 先週のプログラムの復習 先週作成した、キー入力によって、アニメーションと音を再生するサンプルについて、再度復習します。 sketch.js var sample = []; var animation; var num;

    第6回: Web応用3 – 最終課題「インタラクティブ・サウンド・アニメーション」に向けて
  • 第1回: ガイダンス、SuperCollider入門

    授業の概要と進め方の説明 今回は第1回目ということで、この“Interactive Music II”ではどんな内容を取り扱っていくのか、またどのように進めていくのか、ガイダンスを行います。 また、この授業で主に用いる音響合成のためのプログラミング言語であり統合開発環境(IDE)のSuperColliderの入手方法やインストール方法などの導入と、簡単な使用方法を開設します。

    第1回: ガイダンス、SuperCollider入門