begin 2 year post
8
pnpm-lock.yaml
generated
@ -482,8 +482,8 @@ importers:
|
|||||||
specifier: ^4.22.0
|
specifier: ^4.22.0
|
||||||
version: 4.22.0
|
version: 4.22.0
|
||||||
'@astro-community/astro-embed-youtube':
|
'@astro-community/astro-embed-youtube':
|
||||||
specifier: ^0.4.3
|
specifier: ^0.4.4
|
||||||
version: 0.4.3(astro@4.0.8)
|
version: 0.4.4(astro@4.0.8)
|
||||||
'@astrojs/mdx':
|
'@astrojs/mdx':
|
||||||
specifier: ^2.0.3
|
specifier: ^2.0.3
|
||||||
version: 2.0.3(astro@4.0.8)
|
version: 2.0.3(astro@4.0.8)
|
||||||
@ -806,8 +806,8 @@ packages:
|
|||||||
leven: 3.1.0
|
leven: 3.1.0
|
||||||
dev: true
|
dev: true
|
||||||
|
|
||||||
/@astro-community/astro-embed-youtube@0.4.3(astro@4.0.8):
|
/@astro-community/astro-embed-youtube@0.4.4(astro@4.0.8):
|
||||||
resolution: {integrity: sha512-zXtPmR9yxrTo6cuLhH8v+r62bsXbsLJgsU2FiZalPr4bXJxAUQEIlG46S/qK0AEXi9uNShKqy4+zBaJ98xTVEg==}
|
resolution: {integrity: sha512-fYlycLrJFNnibZ9VHPSJO766kO2IgqYQU4mBd4iaDMaicL0gGX9cVZ80QdnpzGrI6w0XOJOY7prx86eWEVBy8w==}
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
astro: ^2.0.0 || ^3.0.0-beta || ^4.0.0-beta
|
astro: ^2.0.0 || ^3.0.0-beta || ^4.0.0-beta
|
||||||
dependencies:
|
dependencies:
|
||||||
|
|||||||
7
website/.astro/types.d.ts
vendored
@ -262,6 +262,13 @@ declare module 'astro:content' {
|
|||||||
collection: "blog";
|
collection: "blog";
|
||||||
data: InferEntrySchema<"blog">
|
data: InferEntrySchema<"blog">
|
||||||
} & { render(): Render[".mdx"] };
|
} & { render(): Render[".mdx"] };
|
||||||
|
"year-2.mdx": {
|
||||||
|
id: "year-2.mdx";
|
||||||
|
slug: "year-2";
|
||||||
|
body: string;
|
||||||
|
collection: "blog";
|
||||||
|
data: InferEntrySchema<"blog">
|
||||||
|
} & { render(): Render[".mdx"] };
|
||||||
};
|
};
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|||||||
@ -13,7 +13,7 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@algolia/client-search": "^4.22.0",
|
"@algolia/client-search": "^4.22.0",
|
||||||
"@astro-community/astro-embed-youtube": "^0.4.3",
|
"@astro-community/astro-embed-youtube": "^0.4.4",
|
||||||
"@astrojs/mdx": "^2.0.3",
|
"@astrojs/mdx": "^2.0.3",
|
||||||
"@astrojs/react": "^3.0.9",
|
"@astrojs/react": "^3.0.9",
|
||||||
"@astrojs/rss": "^4.0.2",
|
"@astrojs/rss": "^4.0.2",
|
||||||
|
|||||||
BIN
website/public/img/autocomplete.png
Normal file
|
After Width: | Height: | Size: 165 KiB |
BIN
website/public/img/strudel-alien-live-coding.png
Normal file
|
After Width: | Height: | Size: 387 KiB |
BIN
website/public/img/strudel-live-coding-mars-college.jpg
Normal file
|
After Width: | Height: | Size: 242 KiB |
BIN
website/public/img/strudel-monkeys.png
Normal file
|
After Width: | Height: | Size: 224 KiB |
BIN
website/public/img/strudel-scope.png
Normal file
|
After Width: | Height: | Size: 497 KiB |
BIN
website/public/img/strudel-themes.png
Normal file
|
After Width: | Height: | Size: 511 KiB |
BIN
website/public/img/workshop-space.png
Normal file
|
After Width: | Height: | Size: 1.3 MiB |
6
website/src/components/Youtube.jsx
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
import LiteYouTubeEmbed from 'react-lite-youtube-embed';
|
||||||
|
import 'react-lite-youtube-embed/dist/LiteYouTubeEmbed.css';
|
||||||
|
|
||||||
|
export function Youtube(props) {
|
||||||
|
return <LiteYouTubeEmbed {...props} />;
|
||||||
|
}
|
||||||
161
website/src/content/blog/year-2.mdx
Normal file
@ -0,0 +1,161 @@
|
|||||||
|
---
|
||||||
|
title: '2 Years of Strudel'
|
||||||
|
description: ''
|
||||||
|
date: '2024-01-22'
|
||||||
|
tags: ['meta']
|
||||||
|
author: froos
|
||||||
|
---
|
||||||
|
|
||||||
|
import { YouTube } from '@astro-community/astro-embed-youtube';
|
||||||
|
import LiteYouTubeEmbed from 'react-lite-youtube-embed';
|
||||||
|
import 'react-lite-youtube-embed/dist/LiteYouTubeEmbed.css';
|
||||||
|
|
||||||
|
Strudel is now 2 years old! This was the first commit to the strudel repo:
|
||||||
|
|
||||||
|
```log
|
||||||
|
commit 38b5a0d5cdf28685b2b5e18d460772b70246207b
|
||||||
|
Author: Alex McLean <alex@slab.org>
|
||||||
|
Date: Sat Jan 22 20:24:36 2022 +0000
|
||||||
|
|
||||||
|
Initial commit
|
||||||
|
```
|
||||||
|
|
||||||
|
I have already written these 2 posts about the first year of strudel:
|
||||||
|
|
||||||
|
- [Introducing Strudel](https://loophole-letters.vercel.app/strudel)
|
||||||
|
- [1 Year of Strudel](https://loophole-letters.vercel.app/strudel1year)
|
||||||
|
|
||||||
|
To continue that tradition, let me recap what happened around Strudel in 2023, at least what I have noticed:
|
||||||
|
|
||||||
|
## ICLC 2023
|
||||||
|
|
||||||
|
I presented strudel at the [International Conference on Live Coding (ICLC)](https://iclc.toplap.org/2023/), which took place in April in Utrecht.
|
||||||
|
Here is the (pretty technical) video of my presentation:
|
||||||
|
|
||||||
|
import { Youtube } from '@src/components/Youtube';
|
||||||
|
|
||||||
|
<Youtube id="ZzDSW08IAdU" params="start=2805" client:only="react" />
|
||||||
|
|
||||||
|
For the conference, I wrote a paper with Alex McLean, called [Strudel: Live Coding Patterns on the Web](https://zenodo.org/records/7842142).
|
||||||
|
For me personally, this was my first major contact with the live coding scene and it was a very memorable experience!
|
||||||
|
|
||||||
|
## Workshops and Courses
|
||||||
|
|
||||||
|
A lot of workshops have been using strudel in the last year, from many parts of the world:
|
||||||
|
[Iceland](http://www.raflost.is/live-coding-for-beginners/), [UK](https://gutlevel.co.uk/whatson/patternclub8),
|
||||||
|
[Japan](https://yoppa.org/kanazawa23), [France](https://www.stereolux.org/agenda/workshop-de-decouverte-de-la-musique-algorithmique-avec-strudel-avec-camille-amet) and the [US](https://www.nycresistor.com/2023/09/25/making-music-with-code-9-30-2023/) (probably more I've missed).
|
||||||
|
I've also given workshops in [Switzerland](https://basel.codes/2023/index.html) and [Germany](https://www.cityofmediaarts.de/de/events/strudel-live-coding-workshop/), where we even had real strudel, thanks to [TOPLAP Karlsruhe](https://toplap-ka.de/)!
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Additionally, there is now a [Creative Coding](https://www.chalmers.se/en/collaborate-with-us/activities-for-schools/creative-coding/) course at Chalmers in Sweden, consisting of "a 10-week series of workshops [...] for younger girls to have fun and experiment with code and music".
|
||||||
|
I was very delighted to see this video of the girls having fun with Strudel:
|
||||||
|
|
||||||
|
<Youtube id="4zgHeNpG4wU" client:only="react" />
|
||||||
|
|
||||||
|
The course was also encompassed by a study on female empowerement through Creative Coding, read more in [Jasmina Maric's paper "Singing Code"](https://www.academia.edu/106106710/Singing_Code).
|
||||||
|
|
||||||
|
Another bigger installment was the [(Algo|Afro) Futures programme](https://algo-afro-futures.lurk.org/) led by Antonio Roberts, which is "a mentoring programme for early career Black artists who want to explore creative coding and live coding".
|
||||||
|
For the final concert the recorded this amazing live stream:
|
||||||
|
|
||||||
|
<Youtube id="zUoZvkZ3J7Q" params="start=842" client:only="react" />
|
||||||
|
|
||||||
|
I am so happy to see that the project I've co-created has had such an impact already, making live coding workshops more easy and accessible.
|
||||||
|
In my opinion, the reasons why people seem to choose strudel for teaching are:
|
||||||
|
|
||||||
|
- it does not require an installation, so it even runs on your phone / tablet or a chromebook
|
||||||
|
- in-code and behind-code visualizations help learners to understand what the system is doing
|
||||||
|
- the interactive documentation
|
||||||
|
- the simple javascript syntax, which is very similar to [hydra](https://hydra.ojack.xyz)
|
||||||
|
- tidal's intuitive mini notation + its deep pattern engine is also interesting for the most advanced users
|
||||||
|
- strudel might also be a "gateway drug" for tidal, which is probably the most used live coding language
|
||||||
|
|
||||||
|
## Performances
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
People are starting to use Strudel for performances, many of which can be watched in the new [Showcase](http://localhost:4321/intro/showcase/)!
|
||||||
|
The above photo comes from the [Mars College Department of Future Music](https://mars.college/gallery/live_coding/)
|
||||||
|
|
||||||
|
## New Features
|
||||||
|
|
||||||
|
Let's talk about some of the major features that landed since last year.
|
||||||
|
|
||||||
|
### Audio Engine Improved
|
||||||
|
|
||||||
|
The audio engine has gotten a lot of attention! Once integrated into Strudel itself, the engine has been pulled out and named [superdough](https://www.npmjs.com/package/superdough),
|
||||||
|
the name being based on [SuperDirt](https://github.com/musikinformatik/SuperDirt), which is the audio engine of Tidal.
|
||||||
|
superdough is now also used by [topos](https://topos.live/), a creation of [Bubo](https://github.com/Bubobubobubobubo/), who helped me implement a bunch of new features.
|
||||||
|
Lately, [Jade Rowland](https://github.com/daslyfe) has also developed many synthesis features into superdough! Here is a non-exhaustive list of new features:
|
||||||
|
|
||||||
|
- [filter envelopes](https://strudel.cc/learn/effects/#filter-envelope) + [24db filter option](https://strudel.cc/learn/effects/#ftype)
|
||||||
|
- [pitch envelopes](https://strudel.cc/learn/effects/#pitch-envelope)
|
||||||
|
- [fm synthesis](https://strudel.cc/learn/synths/#fm-synthesis)
|
||||||
|
- [wavetable synthesis](https://strudel.cc/recipes/recipes/#wavetable-synthesis)
|
||||||
|
- [phaser](https://strudel.cc/learn/effects/#phaser)
|
||||||
|
- [vibrato](https://strudel.cc/learn/synths/#vibrato)
|
||||||
|
- [noise](https://strudel.cc/learn/synths/#noise)
|
||||||
|
- [an integration of the zzfx synth](https://strudel.cc/learn/synths/#zzfx)
|
||||||
|
- [compressor](https://strudel.cc/learn/effects/#compressor)
|
||||||
|
- multichannel audio / audio device selection
|
||||||
|
|
||||||
|
import { MiniRepl } from '@src/docs/MiniRepl';
|
||||||
|
|
||||||
|
Here's an example that shows off filter envelopes:
|
||||||
|
|
||||||
|
<MiniRepl
|
||||||
|
client:visible
|
||||||
|
tune={`// "acidic tooth" @by eddyflux
|
||||||
|
stack(
|
||||||
|
note("[<g1 f1>/8](<3 5>,8)")
|
||||||
|
.clip(perlin.range(.15,1.5))
|
||||||
|
.release(.1)
|
||||||
|
.s("sawtooth")
|
||||||
|
.lpf(sine.range(400,800).slow(16))
|
||||||
|
.lpq(cosine.range(6,14).slow(3))
|
||||||
|
.lpenv(sine.mul(4).slow(4))
|
||||||
|
.lpd(.2).lpa(.02)
|
||||||
|
.ftype('24db')
|
||||||
|
.rarely(add(note(12)))
|
||||||
|
.room(.2).shape(.3).postgain(.5)
|
||||||
|
.superimpose(x=>x.add(note(12)).delay(.5).bpf(1000))
|
||||||
|
.gain("[.2 1@3]*2") // fake sidechain
|
||||||
|
,
|
||||||
|
stack(
|
||||||
|
s("bd*2").mask("<0@4 1@16>"),
|
||||||
|
s("hh*8").gain(saw.mul(saw.fast(2))).clip(sine)
|
||||||
|
.mask("<0@8 1@16>")
|
||||||
|
).bank('RolandTR909')
|
||||||
|
)
|
||||||
|
`}
|
||||||
|
/>
|
||||||
|
|
||||||
|
### Editor Quality of Life Improvements
|
||||||
|
|
||||||
|
You can now change the theme and font of the editor:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
You can now enable autocompletion in the settings:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
If you enable tooltips, you will get the same info by hovering the mouse over functions while holding the ctrl key!
|
||||||
|
|
||||||
|
### New Visualizations
|
||||||
|
|
||||||
|
There is now a new `.spiral()` visualization that renders events in a spiral, elevating the cyclical nature of time (+ swirl also means Strudel in german).
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Ah yes and you see one of the less readable fonts in this screenshot too :)
|
||||||
|
|
||||||
|
The `.scope()` function renders you an oscilloscope:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
The pianoroll also got some more options, including the ability to set labels:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
https://kidscodecs.com/strudel-music-language/
|
||||||