Blame
|
1 | # Vibe Coding Music with Strudel |
||||||
| 2 | ||||||||
|
3 | *A companion page to the Workshop 2 — Vibe Coding activity.* |
||||||
|
4 | |||||||
| 5 | [Strudel](https://strudel.cc) lets you write live-code music right in the browser — change a number, hear the beat change instantly. This page collects tracks to play with. The class activity track is **[way2.cc/caf](https://way2.cc/caf)** — open that to follow along in the workshop. |
|||||||
| 6 | ||||||||
| 7 | More versions will be added as we find good ones. |
|||||||
| 8 | ||||||||
| 9 | --- |
|||||||
| 10 | ||||||||
| 11 | ## Seven Nation Army — The White Stripes |
|||||||
| 12 | ||||||||
| 13 | The famous E E G E D C B bassline from Jack White's 2003 riff. Everyone knows it; it's a great one to pull apart and remix. |
|||||||
| 14 | ||||||||
|
15 | **Hear the original first:** |
||||||
| 16 | ||||||||
| 17 | {{Video|src=https://www.youtube.com/watch?v=0J2QdDbelmY}} |
|||||||
| 18 | ||||||||
|
19 | ### Versions to explore |
||||||
| 20 | ||||||||
| 21 | **1. Class version (Track 1 from the workshop)** → [way2.cc/caf](https://way2.cc/caf) |
|||||||
| 22 | ||||||||
| 23 | **2. SoundFred's version** — from the YouTube tutorial *[Tutorial for Coding Music in Strudel.cc: Seven Nation Army (by The White Stripes)](https://www.youtube.com/watch?v=59P3TbMsIFc)* by SoundFred. |
|||||||
| 24 | ||||||||
| 25 | Code source: [whitestripes-sevennationarmy.txt](https://github.com/manfredscheucher/strudel-loops/blob/main/whitestripes-sevennationarmy.txt) in Manfred Scheucher's *strudel-loops* repo. |
|||||||
| 26 | ||||||||
| 27 | ```js |
|||||||
| 28 | setcpm(124/4) |
|||||||
| 29 | ||||||||
| 30 | $git:note("<[52@3 52 55@1.5 52@1.5 50] [48@4 47@2 -@2]>").sound("gm_electric_guitar_muted:3") |
|||||||
| 31 | ||||||||
| 32 | $kick:sound("bd!4").bank("AkaiLinn").gain(1/4) |
|||||||
| 33 | ||||||||
| 34 | $snare:sound("[- sd]!2").bank("AkaiLinn").gain(1/4) |
|||||||
| 35 | ``` |
|||||||
| 36 | ||||||||
| 37 | [Open in Strudel (one click)](https://strudel.cc/#c2V0Y3BtKDEyNC80KQoKJGdpdDpub3RlKCI8WzUyQDMgNTIgNTVAMS41IDUyQDEuNSA1MF0gWzQ4QDQgNDdAMiAtQDJdPiIpLnNvdW5kKCJnbV9lbGVjdHJpY19ndWl0YXJfbXV0ZWQ6MyIpCgoka2ljazpzb3VuZCgiYmQhNCIpLmJhbmsoIkFrYWlMaW5uIikuZ2FpbigxLzQpCgokc25hcmU6c291bmQoIlstIHNkXSEyIikuYmFuaygiQWthaUxpbm4iKS5nYWluKDEvNCk=) |
|||||||
| 38 | ||||||||
| 39 | > [!NOTE] |
|||||||
| 40 | > **Playing in Strudel:** press **Ctrl+Enter** to start, **Ctrl+.** to stop. Try changing one number (like `124/4` or a MIDI note) and pressing Ctrl+Enter again — the beat updates live. |
|||||||
| 41 | ||||||||
| 42 | --- |
|||||||
| 43 | ||||||||
|
44 | ## Stranger Things — Kyle Dixon & Michael Stein |
||||||
| 45 | ||||||||
| 46 | The synth theme you pulled apart in Track 2 of the workshop. |
|||||||
| 47 | ||||||||
| 48 | ### Versions to explore |
|||||||
| 49 | ||||||||
| 50 | **1. Class version (Track 2 from the workshop)** → [way2.cc/cae](https://way2.cc/cae) |
|||||||
| 51 | ||||||||
| 52 | **2. farhankk360's intro theme** — a fuller arrangement of the show's opening: warm pads, a heartbeat kick, a bass with a **slider** you can drag while it plays, plus flute and brass lines → [way2.cc/cah](https://way2.cc/cah) |
|||||||
| 53 | ||||||||
|
54 | **3. Another version** — a supersaw arpeggio where the filter drifts by **perlin noise**, so it never sweeps the same way twice → [way2.cc/cad](https://way2.cc/cad) |
||||||
| 55 | ||||||||
| 56 | --- |
|||||||
| 57 | ||||||||
| 58 | ## More real songs, live-coded — open one and remix it |
|||||||
| 59 | ||||||||
| 60 | Each link opens straight in strudel.cc. Press **Ctrl+Enter** to play, then change a number and listen — the same skills you just used. (Search the song name on YouTube if you want to hear the original first.) |
|||||||
| 61 | ||||||||
| 62 | - **Super Mario Bros. theme** — the NES classic rebuilt from two square waves, a triangle wave and white noise, exactly like the real NES sound chip. Find the `muteSquare1` switches at the top and turn channels off to hear each part alone → [way2.cc/cab](https://way2.cc/cab) |
|||||||
| 63 | - **New Order — Blue Monday** — the 1983 club classic: drum machine, that famous bass, and an `arrange()` that builds the song section by section, with a piano-roll view drawing the notes as they play → [way2.cc/cac](https://way2.cc/cac) |
|||||||
| 64 | - **Billie Eilish — Birds of a Feather** → [strudel.cc/?yTnr825wyd9V](https://strudel.cc/?yTnr825wyd9V) |
|||||||
| 65 | - **Grimes — Music 4 Machines** → [strudel.cc/?sOc7cVTqJHUU](https://strudel.cc/?sOc7cVTqJHUU) |
|||||||
| 66 | - **Outrun June '25 — shadesDrawn** — not a cover: an original synthwave piece composed *in* Strudel, layers fading in one by one over a TR-909 beat → [way2.cc/cag](https://way2.cc/cag) |
|||||||
| 67 | ||||||||
|
68 | --- |
||||||
| 69 | ||||||||
|
70 | ## Credits |
||||||
| 71 | ||||||||
|
72 | - **Seven Nation Army** — The White Stripes (Jack White, 2003). Original: [official music video](https://www.youtube.com/watch?v=0J2QdDbelmY) (The White Stripes, YouTube). |
||||||
|
73 | - **Stranger Things** — theme by Kyle Dixon & Michael Stein (Survive), for Netflix's *Stranger Things*. Class version: Strudel cover by "eefano". Intro-theme arrangement: [farhankk360](https://youtube.com/@farhankk360) (credited in the code header). Version 3: shared Strudel patch, no author stated in the code. |
||||||
| 74 | - **Super Mario Bros. theme** — composed by Koji Kondo (Nintendo, 1985). Strudel cover by "Flowhacker" (credited in the code header). |
|||||||
| 75 | - **Blue Monday** — New Order (1983). Strudel cover/remix by "Lewis" (credited in the code header). |
|||||||
| 76 | - **Birds of a Feather** — Billie Eilish (2024). Shared Strudel patch. |
|||||||
| 77 | - **Music 4 Machines** — Grimes. Shared Strudel patch. |
|||||||
| 78 | - **Outrun June '25** — original composition in Strudel by "shadesDrawn" (credited in the code header). |
|||||||
|
79 | - **Video** — *Tutorial for Coding Music in Strudel.cc: Seven Nation Army (by The White Stripes)* by [SoundFred](https://www.youtube.com/@theSoundFred) (YouTube). |
||||||
| 80 | - **Code** — [Manfred Scheucher](https://github.com/manfredscheucher), *strudel-loops* repo (no licence stated — used for educational classroom purposes with attribution). |
|||||||
| 81 | - **Strudel** — [strudel.cc](https://strudel.cc), GNU Affero General Public License (AGPL). |
|||||||
| 82 | ||||||||
| 83 | *Classroom use, with attribution.* |
|||||||
| 84 | ||||||||
| 85 | ← Back to [Year 7 Hub](/dt7/Year%207%20Hub) |
|||||||