Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
LiveCoding入門
Search
Takahiro Hirata
October 17, 2022
Programming
0
280
LiveCoding入門
Takahiro Hirata
October 17, 2022
Tweet
Share
More Decks by Takahiro Hirata
See All by Takahiro Hirata
GPT-4oをAzureで試してみた!
checche
0
270
Azure Machine Learning 使ってみた
checche
0
31
PKIの説明など
checche
0
35
よさそう! AWS CDK
checche
0
84
Other Decks in Programming
See All in Programming
AI時代の開発者評価について
ayumuu
0
230
Boost Your Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
750
By the way Google Cloud Next 2025に行ってみてどうだった
ymd65536
0
110
The Missing Link in Angular’s Signal Story: Resource API and httpResource
manfredsteyer
PRO
0
140
20250429 - CNTUG Meetup #67 / DevOps Taiwan Meetup #69 - Deep Dive into Tetragon: Building Runtime Security and Observability with eBPF
tico88612
0
160
AIコーディングエージェントを 「使いこなす」ための実践知と現在地 in ログラス / How to Use AI Coding Agent in Loglass
rkaga
4
1.2k
Fiber Scheduler vs. General-Purpose Parallel Client
hayaokimura
1
290
オープンソースコントリビュート入門
_katsuma
0
120
Creating Awesome Change in SmartNews! En
martin_lover
0
110
State of Namespace
tagomoris
5
2.4k
Browser and UI #2 HTML/ARIA
ken7253
2
170
RubyKaigi Dev Meeting 2025
tenderlove
1
1.3k
Featured
See All Featured
The Pragmatic Product Professional
lauravandoore
33
6.6k
The World Runs on Bad Software
bkeepers
PRO
68
11k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.2k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Become a Pro
speakerdeck
PRO
28
5.3k
How to train your dragon (web standard)
notwaldorf
91
6k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
14
1.4k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.4k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
A Modern Web Designer's Workflow
chriscoyier
693
190k
What's in a price? How to price your products and services
michaelherold
245
12k
Transcript
LiveCoding入門 平田恭嘉
音楽 高校からいままでドラム ここ数年はギターとかもやッてます
LiveCoding?
LiveCodingとは 講演等でコーディングしながら解説するという意味合いで使われることが多いが、 ここで言うライブコーディングとは即興的にコーディングを行う、一種のパフォーミングアートのこと である。音楽や映像を即興で実装し表現する。
コミュニティ TOPLAP Algorave ICLC
TOPLAP Alex McLeanとNick Collinsにより発足された、ライブコーディングのコミュニティである。 ライブコーディングの探求と普及を目的としている。 すでに日本支部も存在している。 (規模は小さいようだ ) https://toplap.org/
Algorave Algorithmic Raveを省略した造語。TOPLAPコミュニティが主要メンバーのライブイベント。 条件を満たせば誰でも開催することができる。 『Algoraveは「条件式の繰り返しを絶え間なく送り出していくことで全面的ないしは全般的に特徴付 けられた音」によって作られる。』らしい。 https://algorave.com/ https://algorave.tokyo/ レイヴ: ダンス音楽を一晩中流す大規模な音楽イベントやパーティのこと
International Conference on Live Coding (ICLC) ICLCはライブコーディングを専門とした国際学会である。 論文発表やポスターセッションはもちろんのこと、ライブも行われる。 世界中のライブコーディングに関わる研究者、プログラマ、ミュージシャン、デザイナーが集まる。 予稿集のリンク
https://zenodo.org/communities/ iclc/?page=1&size=20
音楽 サウンドをライブコーディングする ツール紹介 FoxDotのセットアップ
ライブコーディングのツール SuperCollider: 音響生成エンジン。ほかのツールでもよく利用される。 FoxDot: Pythonベースのライブコーディング環境。 Tidal Cycles: Haskellベースのライブコーディングのプログラミング言語。ライブコーディング 創始者の1人であるAlex McLeanを中心に開発された。
SonicPi: rubyベースのライブコーディング環境。インストールしたら GUIですぐ遊べます。
Installation SuperCollider SC3 Plugins FoxDot
SuperColliderのセットアップ https://supercollider.github.io/download ↑こちらから自分のOSにあったものをダウンロード /インストールする。 今回は3.11.2をインストール。 コマンドとかを書く ヘルプとか見れる コマンドの実行結果等 SuperColliderのUI
SC3 Pluginsのインストール https://github.com/supercollider/sc3-plugins/releases ↑こちらから自分のOSにあったsc3-plugins-3.11.1をダウンロードし、解凍する。 解凍後、出力されたディレクトリの中身 (たくさんあります)を拡張機能のディレクトリにコピーす る。 SC3 PluginsはSuperColliderの様々な拡張機能の詰め合わせのセット。 macOS
~/Library/Application Support/SuperCollider/Extensions/ Linux ~/.local/share/SuperCollider/Extensions/ Win C:\Users\"ユーザー名"\AppData\Local\SuperCollider\Extensions 拡張機能のディレクトリのパス
FoxDotのインストール pip install FoxDotでPython環境にインストール。 SuperColliderを起動し、Quarks.install("FoxDot")入力し実行。 上のメニューバーから Language -> Recompile Class
Libraryで再コンパイル
音を鳴らす
FoxDotを起動する 1. SuperColliderでFoxDot.startを実行 2. python -m FoxDotを実行 FoxDotのGUIが開けば成功🎉
サンプラー play(): サンプラーの音を出力する。 x: Bass drum o: Snare drum -:
Hi hat closed []: 1拍に音を詰めて再生する (): 順番に1つ選ぶ {}: ランダムに1つ選ぶ d1 >> play("x-o-") d1 >> play("(x-)(-x)o[---]") // x-o[---]-xo[---]
シンセ p1 >> pads([0,1,2,3])といった感じに記述すると、 p1にプレイヤーオブジェクトを割り当てるこ とができる。 pads(): ぽーん。まるい感じ pluck(): ぴょん。爪弾いたような音。
star(): みょーん。シンセのストリングっぽい音? bass(): ぶーん。低音。
音を止める ⌘ + . で全部の音が止まる。 p1.stop()でp1を止める事ができる。
プレイヤーのオプション dur: 音価(音の長さ)を決める、配列で指定可能 amp: 音量を決める 例 p1 >> pluck([0, 2,
4], dur=[1, 1/2, 1/2], amp=0.75) # ドーミソドーミソ
パターン パターンはFoxDotで配列をいい感じにするためのもの。 P[0, 2, 4]またはP(0, 2, 4)という具合に記述する []:順番に鳴らす。():和音 例 p
= P[0, 2, 4] pluck(p) PRange(start, stop, step): pythonのrange()の要領でパターンを作成する。 Pattern.rotate() Pattern.reverse() Pattern.sort()
スケールやキーの設定 マイナースケールに変える Scale.default.set("minor") Scale.default.set(Scale.minor) Scale.default.set([0,2,3,5,7,10]) # 12音階表記 キーを変える Root.default.set(1) #
12音階表記 Root.default.set("C#") BPM Clock.bpm = 144
感想
個人的におもったことなど - かなりアンビエントな感じで現代音楽っぽい - よって退屈さは否めない - 音価を数字で表現できたり、異なる長さのループを再生できることで、手軽にポリリズムを作れ る。また、変拍子も簡単に組める - 音価をよしなに等分してくれるので、
n連符を楽につくれる - ランダムがいい味だしてくれる - 度数を理解している人からすると、メジャースケールが 0,1,2,3,4,5,6で表現されているため コード構成がややこしい (ex. IM9は0,2,4,6,8、普通1,3,5,7,9と捉えたい) - むずかしいかったです
映像 ヴィジュアルをライブコーディング する LiveCodeLab Hydra
LiveCodeLab https://livecodelab.net/play/index.html アクセスすればすぐに使える。 WebGLをつかっている。CoffeeScriptの文法を使っているらしい。 物体をリアルタイムにレンダリングして 場を盛り上げる。
使い方ざっくり 以下の設定を駆使する。わりと簡単。 - 背景: background - 物体の位置/回転: move, rotate -
物体の色とライティング : fill/stroke, ambientLight - 物体の形: box, ball, peg - 繰り返し/条件分岐 - jsの数学系の関数: sin(), cos()
Hydra https://hydra.ojack.xyz/ アクセスすればすぐに使える。 書き方はアナログモジュラーシンセサイザーにおける信号の生成とパッチングをモチーフにしている。 最終的にGLSL(OpenGL Shading Language)というシェーディング言語を使ってレンダリングしてい る。これによりGPUが利用できる。 抽象的な映像をリアルタイムにレンダリングして場を盛り上げる。 個人的にはこっちのほうがアガる。
酔いそうになるので注意。 KORG MS-20 mini
使い方ざっくり アナログシンセのように発振し、メソッドチェーンで変換処理をかけていくイメージでできる。 信号の生成 - osc(周波数, 移動速度, RGBのオフセット): 映像の波がでる - solid(R,
G, B, opacity): 単色 - noise(scale, speed): もわもわしたノイズ - shape(num_edge, size): 多角形 変調 - rotate(rad) - kaleid(n): 万華鏡みたいになる。すっごい 信号の合成 - add, diff, blend, multi 出力 - out(out_name): 最後に書く。引数に出力変数名を記述して合成に使える。フィードバックもできる。
その他の信号生成 カメラ入力をつかう - s0.initCam(): s0にカメラの入力を割り当てる。 マイク入力を使う - a.show(): aにマイクの入力を割り当てる。 -
a.setBins(n): 周波数帯域をnつに分ける。 - a.fft[i]: nつに分けた周波数帯域の i番目要素を取得
参考リンク
https://github.com/toplap/awesome-livecoding 演奏するプログラミング、ライブコーディングの思想と実践
入出力の流れ こんな感じでやりました