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
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Takahiro Hirata
October 17, 2022
Programming
370
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
LiveCoding入門
Takahiro Hirata
October 17, 2022
More Decks by Takahiro Hirata
See All by Takahiro Hirata
GPT-4oをAzureで試してみた!
checche
0
340
Azure Machine Learning 使ってみた
checche
0
97
PKIの説明など
checche
0
75
よさそう! AWS CDK
checche
0
96
Other Decks in Programming
See All in Programming
才能?センス?知らん、 続けたもん勝ちだ。-- 結婚・出産・癌を越えてなお、私がプロダクトを創り続ける理由
16bitidol
2
920
Generative UI & AI-Assistants for Your Angular Solutions
manfredsteyer
PRO
0
120
関数型プログラミングのメリットって何だろう?
wanko_it
0
200
광주소프트웨어마이스터고등학교 DevFest 특강 - 바이브 코딩 시대에서 주니어 개발자로 살아남는 방법
utilforever
1
150
初めてのKubernetes 本番運用でハマった話
oku053
0
130
The Bowling Game- From Imperative to Functional Programming - Part 1
philipschwarz
PRO
0
350
Laravelで学ぶ Webアプリケーションチューニング入門/web_application_tuning_101
hanhan1978
4
1.3k
PHP初心者セッション2026 〜生成AIでは見えない裏側を知る:今だからLAMPを通して仕組みを学ぶ〜
kashioka
0
680
Embedded SREと共に達成した会員管理システムのAWS移行 - SRE NEXT 2026 ランチスポンサーセッション
niftycorp
PRO
1
3.1k
自作OSでスライド発表する
uyuki234
1
3.9k
今さら聞けない .NET CLI
htkym
0
140
生成AI導入の「期待外れ」を乗り越える ー 開発フロー改革が目指す、真の組織変革
starfish719
0
2.4k
Featured
See All Featured
30 Presentation Tips
portentint
PRO
1
350
Designing for Timeless Needs
cassininazir
1
400
Being A Developer After 40
akosma
91
590k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
520
The agentic SEO stack - context over prompts
schlessera
0
850
The Limits of Empathy - UXLibs8
cassininazir
1
550
Leading Effective Engineering Teams in the AI Era
addyosmani
9
2.2k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
4k
My Coaching Mixtape
mlcsv
0
180
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.5k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
340
Context Engineering - Making Every Token Count
addyosmani
9
1k
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 演奏するプログラミング、ライブコーディングの思想と実践
入出力の流れ こんな感じでやりました