HydraとAlgorave入門：画面を楽器にするライブコーディングの鑑賞と実践
Algoraveのイベントに足を運んでも、スクリーンに次々と流れるコードの意味が追えず、何が起きているのか分からないまま圧倒されて終わってしまった経験はないでしょうか。コードをその場で書き換えて音や映像を生み出すライブコーディングは、完成品を鑑賞する従来のジェネラティブアートとは鑑賞の文脈が根本から異なります。この記事では、Webブラウザで動く映像シンセサイザー「Hydra」を手がかりに、スクリーン上で繰り広げられる即興コードの構造を紐解き、鑑賞の視点と自分自身で最初の一歩を踏み出すための実践法を整理します。
静止したアルゴリズムから、脈打つ即興へ：ライブコーディングという表現形式
p5.js や Processing で作るジェネラティブアートは、多くの場合「書く、実行する、眺める」という順序で進みます。コードは作品の裏側にあり、完成した出力が作品として扱われます。ライブコーディングはこの順序を壊します。コードを書く行為そのものが上演になり、画面にはコードが映し出されます。
この考え方は、ライブコーディングのコミュニティ TOPLAP が 2004 年ごろに掲げた「Show us your screens(画面を見せよ)」という合言葉によく表れています。観客は結果だけでなく、結果を生む思考の途中経過も目にします。コードは設計図から譜面に近い存在へ変わります。ただし楽譜と違い、演奏と作曲が同じ時間に起きます。
Algorave は、アルゴリズムで音楽や映像を生成しながら踊る場として、2010 年代前半に英国のライブコーディング・コミュニティから広がったイベント形式です。Tidal Cycles を開発した Alex McLean らが関わってきたことで知られます。クラブの暗がりでキーボードを叩く人の指が、フロアの身体を動かします。コードを書く人も踊る人も、同じ時間を共有しています。
画面そのものが楽器になる：ブラウザベース映像シンセサイザー「Hydra」の思想
Hydra は、Olivia Jack が開発したブラウザ上で動く映像シンセサイザーです。公式エディタを開けば、インストール不要でそのまま映像を生成できます。内部では WebGL を使っています。発想の源はアナログのモジュラー・ビデオシンセサイザーで、発振器を作り、変形し、重ね合わせ、別の信号で揺らすという流れを JavaScript のメソッドチェーンで表現します。
osc(10, 0.1, 1.2)
.kaleid(4)
.modulate(noise(3), 0.2)
.out(o0)osc が縞模様の波形を生み、kaleid が万華鏡のように折り返し、modulate が別のノイズで座標を揺らします。最後の .out(o0) が出力バッファへの書き出しです。数値を一つ変えて実行し直すだけで、映像の質感が大きく変わります。エディタでは Ctrl+Enter で現在の行やブロックを、Ctrl+Shift+Enter でコード全体を評価できます。この手軽さが、即興の速度を支えています。
Hydra の設計は、アナログ機材の「つなぎ替え」の身体感覚をテキストに移したものと言えます。数値は摘まみで、メソッドチェーンはパッチケーブルです。関数を差し込んだり抜いたりする操作は、楽器のセッティングを変える動作に近い感覚があります。
p5.js や Three.js との関係も気になるところです。p5.js が「一枚の絵を丁寧に組み立てる」道具だとすると、Hydra は「流れ続ける信号を加工する」道具です。Hydra は外部のキャンバスや映像を入力ソースとして取り込む仕組みも備えているため、p5.js で描いた図形を Hydra で歪ませる構成も試せます。具体的な書き方は Hydra の公式ドキュメントで確認してください。
エラーと偶然を受け入れる美学：Algoraveの現場に見る「失敗の可視化」
ライブコーディングの現場で目を引くのは、エラーの扱いです。括弧を閉じ忘れたり、存在しない関数名を打ち間違えたりすると、実行は失敗してエラーが表示されます。通常の開発では隠したい瞬間です。ライブの場では、これも上演の一部になります。
Hydra のエディタは、評価に失敗すると直前までの映像を保ったまま動き続けます。そのため、エラーが出ても映像が突然消えるとは限りません。演奏者は動き続ける映像を見ながら、間違いを直します。観客は、直す手つきや焦らない間合いに、技術と人柄の両方を感じ取ります。
偶然も表現の核になります。乱数やノイズ、音の入力で値が揺れるので、パフォーマーでさえ次の瞬間の絵を完全には予測できません。そのため、上演は「狙った絵を再現する」というより、「出てきた絵に応答する」対話の形になります。この点は、完成を目指すジェネラティブアートと大きく異なります。
鑑賞者は、次のような点に注目すると、見え方が変わります。
- 変更が映像に反映されるまでの、時間差と驚きの表情
- 変更前の状態をどこまで残し、どこから崩すかという判断
- エラーが起きたときの対処と、その間の映像の持たせ方
- 音の変化と映像の変化が、どの程度連動しているか
結果としての美しさだけでなく、判断の連なりを読むことが、メディアアート鑑賞の新しい視点になります。
どこで体験し、どう楽しむか：国内外のコミュニティと配信プラットフォーム
まず手軽なのは、配信で観ることです。TOPLAP は定期的にオンラインでのライブ配信を行ってきた団体で、世界中のライブコーダーが画面を共有します。YouTube や Twitch のアーカイブから、過去の上演を見返せるものも多くあります。コードが映る配信なら、気になった一行をその場で自分のエディタに写して試せます。
音の側では、Tidal Cycles、Sonic Pi、SuperCollider、そして JavaScript で動く Strudel などが使われます。Hydra はこうした音のツールと組み合わせて使われることが多く、映像担当と音担当が分かれて共演する形もよく見られます。複数人で同じコードを編集する Flok のようなツールも知られています。
国内でも、東京などでライブコーディングや Algorave 系のイベントが開かれてきました。ただし開催頻度や会場は時期によって変わります。最新の情報は、各コミュニティの SNS やイベント告知ページで確認してください。研究面では、ライブコーディングの国際会議 ICLC があり、論文や上演記録が公開されています。作品を「聴く」だけでなく「読む」入口としても役立ちます。
会場に足を運ぶ際の作法は、特別なものではありません。スクリーンのコードを眺め、気に入った瞬間に身体を揺らしてください。演奏者の手元が見える位置を探すのも、一つの楽しみ方です。上演後に「あの変化はどう書いたのですか」と声をかけると、多くの演奏者が喜んで話してくれる、という経験談もよく耳にします。
最初の一行を鳴らすために：鑑賞者からパフォーマーへの第一歩
最初の一歩は、とても小さくて構いません。Hydra の公式エディタを開き、最初から入っているサンプルの数値を一つ変えてみてください。変えた瞬間に映像が応えます。この応答の速さが、ライブコーディングの核心です。
次の段階として、次のような練習をおすすめします。
- 一つの関数だけを使い、引数を変え続けて動きを観察する
.modulateや.rotateを一つずつ足して、変化の質を比べる() =>を使って時間で変わる値を渡し、自動で動く映像を作る- 好みの形が見つかったら、コードを URL で共有して他の人に見せる
人前で演奏するときは、あらかじめ全体を準備せず、短い断片を用意しておき、その場でつなぎ替える方法が一般的です。完成した手順ではなく、使い慣れた語彙を持つことが、即興の自由につながります。
最後に、ライブコーディングは技術を披露する場ではなく、考えながら作る時間を分かち合う場だということを覚えておいてください。コードを読み、書き、直す姿を共有できれば、観客と演奏者の境界は自然にゆるみます。次に画面の中の光芒を見るときは、その背後で動く手と思考にも目を向けてみてください。
