diff --git a/talk/deck.mdx b/talk/deck.mdx index 6d8fc2bd4..79bd09d64 100644 --- a/talk/deck.mdx +++ b/talk/deck.mdx @@ -56,11 +56,12 @@ Alex McLean, Felix Roos & Tidal Cycles Community
- zero-install live coding editor for the web -- based on a port of Tidal Cycles -- terse language for algorithmic patterns -- dynamic music sequencing +- Tidal Cycles port to JavaScript +- a terse language for algorithmic patterns +- for dynamic music sequencing - algorithmic composition - live improvisation +- a set of reusable packages - probably more exciting than your regular DAW
@@ -83,7 +84,7 @@ Alex McLean, Felix Roos & Tidal Cycles Community - ## About Me @@ -185,7 +186,7 @@ stack( ).reset(">") .cutoff(perlin.slow(7).range(100,20000)) .webdirt().slow(3/2)`,*/ - /* `stack( // drum pattern by yaxu + /* `stack( // drum pattern by yaxu "24*2 [~ 25]".chunk(4, x => x.sub("12").fast(2)) .tone(membrane().toDestination()), "~ x ~ x".every(2, x => x.fast(2)).iter(4) @@ -204,7 +205,7 @@ stack( -## What is Live Coding? +## Live Coding "In live coding performance, performers create time-based works by programming them while these same works are being @@ -222,13 +223,13 @@ stack( -## What is Tidal Cycles? +## Tidal Cycles
-- A popular software for live coding music -- a powerful pattern language, inspired by konnakol and weaving -- find out more at tidalcycles.org +- A popular software for live coding music, developed since 2009 +- a powerful pattern language, inspired by classical music +- functional reactive programming (FRP)
@@ -279,12 +280,14 @@ stack( Jeff Atwood, 2009{' '} +![tidal-vortex-strudel](./tidal-vortex-strudel.png) + -![strudel port quote](./strudel-port.png) -
+![strudel port quote](./strudel-port.png) + - Started by Alex McLean in January 2022 - based on a port of a rewrite of Tidal - I implemented the REPL + additional strudel packages @@ -316,7 +319,93 @@ stack( - + +## User Code + +
+ +- JavaScript + syntax sugar (transpilation with shift-ast) +- "Mini Notation" for terse rhythm notation +- `seq(c3, [e3, g3])` === `"c3 [e3 g3]"` +- All Parameters can be a Pattern + +
+ +") + .scale(cat('F#2 major','A2 major').slow(8)) + .note().piano().out().pianoroll({autorange:1,cycles:16,fold:1,inactive:'orange'})`, + /* `stack( + // melody + \`< + [e5 ~] [[d5@2 c5] [~@2 e5]] ~ [~ [c5@2 d5]] [e5 e5] [d5 c5] [e5 f5] [g5 a5] + [~ c5] [c5 d5] [e5 [c5@2 c5]] [~ c5] [f5 e5] [c5 d5] [~ g6] [g6 ~] + [e5 ~] [[d5@2 c5] [~@2 e5]] ~ [~ [c5@2 d5]] [e5 e5] [d5 c5] [a5 g5] [c6 [e5@2 d5]] + [~ c5] [c5 d5] [e5 [c5@2 c5]] [~ c5] [f5 e5] [c5 d5] [~ [g6@2 ~] ~@2] [g5 ~] + [~ a5] [b5 c6] [b5@2 ~@2 g5] ~ + [f5 ~] [[g5@2 f5] ~] [[e5 ~] [f5 ~]] [[f#5 ~] [g5 ~]] + [~ a5] [b5 c6] [b5@2 ~@2 g5] ~ + [eb6 d6] [~ c6] ~!2 + >\` + .legato(.95), + // sub melody + \`< + [~ g4]!2 [~ ab4]!2 [~ a4]!2 [~ bb4]!2 + [~ a4]!2 [~ g4]!2 [d4 e4] [f4 gb4] ~!2 + [~ g4]!2 [~ ab4]!2 [~ a4]!2 [~ bb4]!2 + [~ a4]!2 [~ g4]!2 [d4 e4] [f4 gb4] ~!2 + [~ c5]!4 [~ a4]!2 [[c4 ~] [d4 ~]] [[eb4 ~] [e4 ~]] + [~ c5]!4 [~ eb5]!2 [g4*2 [f4 ~]] [[e4 ~] [d4 ~]] + >\`, + // bass + \`< + c3!7 a3 f3!2 + e3!2 ~!4 + c3!7 a3 f3!2 + e3!2 ~!4 + f3!2 e3!2 d3!2 ~!2 + f3!2 e3!2 ab3!2 ~!2 + >\` + .legato(.5) +).fast(2).pianoroll({fold:1,cycles:8,overscan:8}) +.note().piano().out()`, + `stack( +"c2 ", +"<[e3,[g3 a3 bb3 a3]]!11 [e3,g3]>".slow(2) + .struct("<[[x@2 x]*4]!11 [[~@2 x] [[x@2 ~]*9]@3]>".slow(2)) +) + .velocity("[.7@2 .9]*2".add(rand.range(-.1,.1))) + .transpose("<1 6 1@2 6@2 1@2 8 6 1 8>/2") + .pianoroll({ fold:1, cycles:16 }) +.note().piano().out()`, */ + ]} +/> + + ## 🍭 Syntax Sugar @@ -352,85 +441,28 @@ mini('c3 [e3 g3]') -## Mini Notation - -\* \[\] ~ , / <\> ! @ \(\) +## 👁 Parsing Mini Notation
-- Embedded Domain Specific Language -- PEG grammar based on [krill](https://github.com/Mdashdotdashn/krill/) by Marc Resibois -- `"c3 [e3 g3]"` === `seq(c3, [e3, g3])` +1. write [peg](https://github.com/tidalcycles/strudel/blob/main/packages/mini/krill.pegjs), generate [parser](https://github.com/tidalcycles/strudel/blob/main/packages/mini/krill-parser.js) with [parser generator (peggyjs)](https://peggyjs.org/) +2. pass string to generated parser: `mini('c3 [e3 g3]')` +3. obtain Abstract Syntax Tree (AST) +4. [transform](https://github.com/tidalcycles/strudel/blob/main/packages/mini/mini.mjs#L76) AST into Pattern: `seq('c3', ['e3', 'g3'])`
-\` - .legato(.95), - // sub melody - \`< - [~ g4]!2 [~ ab4]!2 [~ a4]!2 [~ bb4]!2 - [~ a4]!2 [~ g4]!2 [d4 e4] [f4 gb4] ~!2 - [~ g4]!2 [~ ab4]!2 [~ a4]!2 [~ bb4]!2 - [~ a4]!2 [~ g4]!2 [d4 e4] [f4 gb4] ~!2 - [~ c5]!4 [~ a4]!2 [[c4 ~] [d4 ~]] [[eb4 ~] [e4 ~]] - [~ c5]!4 [~ eb5]!2 [g4*2 [f4 ~]] [[e4 ~] [d4 ~]] - >\`, - // bass - \`< - c3!7 a3 f3!2 - e3!2 ~!4 - c3!7 a3 f3!2 - e3!2 ~!4 - f3!2 e3!2 d3!2 ~!2 - f3!2 e3!2 ab3!2 ~!2 - >\` - .legato(.5) -).fast(2).pianoroll({fold:1,cycles:8,overscan:8})`, - `stack( -"c2 ", -"<[e3,[g3 a3 bb3 a3]]!11 [e3,g3]>".slow(2) - .struct("<[[x@2 x]*4]!11 [[~@2 x] [[x@2 ~]*9]@3]>".slow(2)) -) - .velocity("[.7@2 .9]*2".add(rand.range(-.1,.1))) - .transpose("<1 6 1@2 6@2 1@2 8 6 1 8>/2") - .pianoroll({ fold:1, cycles:16 })`, */ - ]} -/> + + +[OhmJS Editor](https://ohmjs.org/editor/) + + + +## High Level Overview + +
➡️
+ + - -## High Level Overview - -
➡️
- - - ## 🕵🏽 Querying Events @@ -526,7 +533,7 @@ seq('c3', ['e3', 'g3']) // <--- Pattern The scheduler will query the active pattern at regular intervals! - ## 🗓️ Scheduling @@ -561,7 +568,7 @@ setInterval(() => { ## Sound Output -Patterns are wrapped with param functions to control different aspects of the sound. +Patterns are wrapped with param functions to compose different properties of the sound. -
+```js +{ note: 'a4', s: 'sawtooth', gain: 0.5, cutoff: 267 } +``` -- `.out()` will turn each event value into a Web Audio Graph! -- Everything until the output are just objects in time, which can be used for any time-based output +![waa nodes](./waa-nodes.png) -
+Supports Web Audio API, Web MIDI, OSC, Speech, Web Serial, ... ? @@ -590,7 +598,7 @@ Patterns are wrapped with param functions to control different aspects of the so - Alternative Sound Backends - Collaborative Mode -- Context Aware Documentation +- Context Aware Documentation / Completion / Visualization - Port more Tidal Features
@@ -599,9 +607,9 @@ Patterns are wrapped with param functions to control different aspects of the so
-- REPL: [strudel.tidalcycles.org](https://strudel.tidalcycles.org/?EeNsQ8hdNZwN) (-> [offline version](http://localhost:3000/#Y29uc3QgZGVsYXkgPSBuZXcgRmVlZGJhY2tEZWxheSgxLzMsIC41KS5jaGFpbih2b2woLjIpLCBvdXQoKSkKbGV0IGthbGltYmEgPSBhd2FpdCBzYW1wbGVyKHsKICBDNTogJy4vc2FtcGxlcy9rYWxpbWJhL2thbGltYmEtYzUubXAzJwp9KQprYWxpbWJhID0ga2FsaW1iYS5jaGFpbih2b2woMC42KS5jb25uZWN0KGRlbGF5KSxvdXQoKSk7CmNvbnN0IHNjYWxlcyA9IGNhdCgnQyBtYWpvcicsICdDIG1peG9seWRpYW4nLCAnRiBseWRpYW4nLCBbJ0YgbWlub3InLCAnRGIgbWFqb3InXSkKCnN0YWNrKAogICJbMCAyIDQgNiA5IDIgMCAtMl0qMyIKICAuYWRkKCI8MCAyPi80IikKICAuc2NhbGUoc2NhbGVzKQogIC5zdHJ1Y3QoIngqOCIpCiAgLnZlbG9jaXR5KCI8LjggLjMgLjY%2BKjgiKQogIC5zbG93KDIpCiAgLnRvbmUoa2FsaW1iYSksCiAgIjxjMiBjMiBmMiBbW0YyIEMyXSBkYjJdPiIKICAuc2NhbGUoc2NhbGVzKQogIC5zY2FsZVRyYW5zcG9zZSgiWzAgPDIgND5dKjIiKQogIC5zdHJ1Y3QoIngqNCIpCiAgLnZlbG9jaXR5KCI8LjggLjU%2BKjQiKQogIC52ZWxvY2l0eSgwLjgpCiAgLnNsb3coMikKICAudG9uZShrYWxpbWJhKQopCiAgLmxlZ2F0bygiPC40IC44IDEgMS4yIDEuNCAxLjYgMS44IDI%2BLzgiKQogIC5mYXN0KDEpCi5waWFub3JvbGwoe2F1dG9yYW5nZTowfSk%3D)) +- Strudel REPL: [strudel.tidalcycles.org](https://strudel.tidalcycles.org/?EeNsQ8hdNZwN) (-> [offline version](http://localhost:3000/#Y29uc3QgZGVsYXkgPSBuZXcgRmVlZGJhY2tEZWxheSgxLzMsIC41KS5jaGFpbih2b2woLjIpLCBvdXQoKSkKbGV0IGthbGltYmEgPSBhd2FpdCBzYW1wbGVyKHsKICBDNTogJy4vc2FtcGxlcy9rYWxpbWJhL2thbGltYmEtYzUubXAzJwp9KQprYWxpbWJhID0ga2FsaW1iYS5jaGFpbih2b2woMC42KS5jb25uZWN0KGRlbGF5KSxvdXQoKSk7CmNvbnN0IHNjYWxlcyA9IGNhdCgnQyBtYWpvcicsICdDIG1peG9seWRpYW4nLCAnRiBseWRpYW4nLCBbJ0YgbWlub3InLCAnRGIgbWFqb3InXSkKCnN0YWNrKAogICJbMCAyIDQgNiA5IDIgMCAtMl0qMyIKICAuYWRkKCI8MCAyPi80IikKICAuc2NhbGUoc2NhbGVzKQogIC5zdHJ1Y3QoIngqOCIpCiAgLnZlbG9jaXR5KCI8LjggLjMgLjY%2BKjgiKQogIC5zbG93KDIpCiAgLnRvbmUoa2FsaW1iYSksCiAgIjxjMiBjMiBmMiBbW0YyIEMyXSBkYjJdPiIKICAuc2NhbGUoc2NhbGVzKQogIC5zY2FsZVRyYW5zcG9zZSgiWzAgPDIgND5dKjIiKQogIC5zdHJ1Y3QoIngqNCIpCiAgLnZlbG9jaXR5KCI8LjggLjU%2BKjQiKQogIC52ZWxvY2l0eSgwLjgpCiAgLnNsb3coMikKICAudG9uZShrYWxpbWJhKQopCiAgLmxlZ2F0bygiPC40IC44IDEgMS4yIDEuNCAxLjYgMS44IDI%2BLzgiKQogIC5mYXN0KDEpCi5waWFub3JvbGwoe2F1dG9yYW5nZTowfSk%3D)) - Interactive Tutorial: [strudel.tidalcycles.org/tutorial](https://strudel.tidalcycles.org/) -- News: [@tidalcycles](https://twitter.com/tidalcycles) +- Stay Tuned: [@tidalcycles](https://twitter.com/tidalcycles) - Github: [https://github.com/tidalcycles/strudel](https://github.com/tidalcycles/strudel)
@@ -645,7 +653,7 @@ Patterns are wrapped with param functions to control different aspects of the so ]} /> - + ## Strudel Packages diff --git a/talk/public/tidal-vortex-strudel.png b/talk/public/tidal-vortex-strudel.png new file mode 100644 index 000000000..ef23871aa Binary files /dev/null and b/talk/public/tidal-vortex-strudel.png differ diff --git a/talk/public/waa-nodes.png b/talk/public/waa-nodes.png new file mode 100644 index 000000000..cece1aa91 Binary files /dev/null and b/talk/public/waa-nodes.png differ