jevstrudel.git / website / src / pages / workshop / first-sounds.mdx
first-sounds.mdx380 lines · 10.1 KB · raw
1---
2title: First Sounds
3layout: ../../layouts/MainLayout.astro
4---
5
6import { MiniRepl } from '@src/docs/MiniRepl';
7import Box from '@components/Box.astro';
8import QA from '@components/QA';
9
10# First Sounds
11
12This is the first chapter of the Strudel Workshop, nice to have you on board!
13
14## Code Fields
15
16The workshop is full of interactive code fields. Let's learn how to use those. Here is one:
17
18<MiniRepl client:visible tune={`sound("casio")`} dirt />
19
20<Box>
21
221. ⬆️ click into the text field above ⬆️
232. press `ctrl`+`enter` to play
243. change `casio` to `metal`
254. press `ctrl`+`enter` to update
265. press `ctrl`+`.` to stop
27
28</Box>
29
30Congratulations, you are now live coding!
31
32## Sounds
33
34We have just played a sound with `sound` like this:
35
36<MiniRepl client:visible tune={`sound("casio")`} />
37
38<Box>
39
40`casio` is one of many standard sounds.
41
42Try out a few other sounds:
43
44```
45insect wind jazz metal east crow casio space numbers
46```
47
48You might hear a little pause while the sound is loading
49
50</Box>
51
52**Change Sample Number with :**
53
54One Sound can contain multiple samples (audio files).
55
56You can select the sample by appending `:` followed by a number to the name:
57
58<MiniRepl client:visible tune={`sound("casio:1")`} />
59
60<Box>
61
62Try different sound / sample number combinations.
63
64Not adding a number is like doing `:0`
65
66</Box>
67
68Now you know how to use different sounds.
69For now we'll stick to this little selection of sounds, but we'll find out how to load your own sounds later.
70
71## Drum Sounds
72
73By default, Strudel comes with a wide selection of drum sounds:
74
75<MiniRepl client:visible tune={`sound("bd hh sd oh")`} />
76
77<Box>
78
79These letter combinations stand for different parts of a drum set:
80
81<img src="/img/drumset.png" />
82
83<a class="text-right text-xs" href="https://de.wikipedia.org/wiki/Schlagzeug#/media/Datei:Drum_set.svg" target="_blank">
84  original image by Pbroks13
85</a>
86
87- `bd` = **b**ass **d**rum
88- `sd` = **s**nare **d**rum
89- `rim` = **rim**shot
90- `hh` = **h**i**h**at
91- `oh` = **o**pen **h**ihat
92- `lt` = **l**ow tom
93- `mt` = **m**iddle tom
94- `ht` = **h**igh tom
95- `rd` = **r**i**d**e cymbal
96- `cr` = **cr**ash cymbal
97
98Try out different drum sounds!
99
100</Box>
101
102To change the sound character of our drums, we can use `bank` to change the drum machine:
103
104<MiniRepl client:visible tune={`sound("bd hh sd oh").bank("RolandTR909")`} />
105
106In this example `RolandTR909` is the name of the drum machine that we're using.
107It is a famous drum machine for house and techno beats.
108
109<Box>
110
111Try changing `RolandTR909` to one of
112
113- `AkaiLinn`
114- `RhythmAce`
115- `RolandTR808`
116- `RolandTR707`
117- `ViscoSpaceDrum`
118
119There are a lot more, but let's keep it simple for now
120
121🦥 Pro-Tip: Mark a name via double click. Then just copy and paste!
122
123</Box>
124
125## Sequences
126
127In the last example, we already saw that you can play multiple sounds in a sequence by separating them with a space:
128
129<MiniRepl client:visible tune={`sound("bd hh sd hh")`} punchcard />
130
131Notice how the currently playing sound is highlighted in the code and also visualized below.
132
133<Box>
134
135Try adding more sounds to the sequence!
136
137</Box>
138
139**The longer the sequence, the faster it runs**
140
141<MiniRepl client:visible tune={`sound("bd bd hh bd rim bd hh bd")`} punchcard />
142
143The content of a sequence will be squished into what's called a cycle. A cycle is 2s long by default.
144
145**One per cycle with `< .. >`**
146
147Here is the same sequence, but this time sourrounded with `< .. >` (angle brackets):
148
149<MiniRepl client:visible tune={`sound("<bd bd hh bd rim bd hh bd>")`} punchcard />
150
151This will play only one sound per cycle. With these brackets, the tempo doesn't change when we add or remove elements!
152
153Because this is now very slow, we can speed it up again like this:
154
155<MiniRepl client:visible tune={`sound("<bd bd hh bd rim bd hh bd>*8")`} punchcard />
156
157Here, the `*8` means we make the whole thing 8 times faster.
158
159<Box>
160
161Wait a minute, isn't this the same as without `< ... >*8`? Why do we need it then?
162
163That's true, the special thing about this notation is that the tempo won't change when you add or remove elements, try it!
164
165Try also changing the number at the end to change the tempo!
166
167</Box>
168
169**changing the tempo with setcpm**
170
171<MiniRepl
172  client:visible
173  tune={`setcpm(90/4)
174sound("<bd hh rim hh>*8")`}
175  punchcard
176/>
177
178<Box>
179
180cpm = cycles per minute
181
182By default, the tempo is 30 cycles per minute = 120/4 = 1 cycle every 2 seconds
183
184In western music terms, you could say the above are 8ths notes at 90bpm in 4/4 time.
185But don't worry if you don't know these terms, as they are not required to make music with Strudel.
186
187</Box>
188
189**Add a rests in a sequence with '-' or '~'**
190
191<MiniRepl client:visible tune={`sound("bd hh - rim - bd hh rim")`} punchcard />
192
193**Sub-Sequences with [brackets]**
194
195<MiniRepl client:visible tune={`sound("bd [hh hh] sd [hh bd] bd - [hh sd] cp")`} punchcard />
196
197<Box>
198
199Try adding more sounds inside a bracket!
200
201</Box>
202
203Similar to the whole sequence, the content of a sub-sequence will be squished to its own length.
204
205**Multiplication: Speed things up**
206
207<MiniRepl client:visible tune={`sound("bd hh*2 rim hh*3 bd [- hh*2] rim hh*2")`} punchcard />
208
209**Multiplication: Speed up subsequences**
210
211<MiniRepl client:visible tune={`sound("bd [hh rim]*2 bd [hh rim]*1.5")`} punchcard />
212
213**Multiplication: Speeeeeeeeed things up**
214
215<MiniRepl client:visible tune={`sound("bd hh*32 rim hh*16")`} punchcard />
216
217<Box>
218
219Pitch = really fast rhythm
220
221</Box>
222
223**Sub-Sub-Sequences with [[brackets]]**
224
225<MiniRepl client:visible tune={`sound("bd [[rim rim] hh] bd cp")`} punchcard />
226
227<Box>
228
229You can go as deep as you want!
230
231</Box>
232
233**Play sequences in parallel with comma**
234
235<MiniRepl client:visible tune={`sound("hh hh hh, bd casio")`} punchcard />
236
237You can use as many commas as you want:
238
239<MiniRepl client:visible tune={`sound("hh hh hh, bd bd, - casio")`} punchcard />
240
241Commas can also be used inside sub-sequences:
242
243<MiniRepl client:visible tune={`sound("hh hh hh, bd [bd,casio]")`} punchcard />
244
245<Box>
246
247Notice how the 2 above are the same?
248
249It is quite common that there are many ways to express the same idea.
250
251</Box>
252
253**Multiple Lines with backticks**
254
255<MiniRepl
256  client:visible
257  tune={`sound(\`bd*2, - cp, 
258- - - oh, hh*4,
259[- casio]*2\`)`}
260  punchcard
261/>
262
263**selecting sample numbers separately**
264
265Instead of selecting sample numbers one by one:
266
267<MiniRepl client:visible tune={`sound("jazz:0 jazz:1 [jazz:4 jazz:2] jazz:3*2")`} punchcard />
268
269We can also use the `n` function to make it shorter and more readable:
270
271<MiniRepl client:visible tune={`n("0 1 [4 2] 3*2").sound("jazz")`} punchcard />
272
273## Recap
274
275Now we've learned the basics of the so called Mini-Notation, the rhythm language of Tidal.
276This is what we've learned so far:
277
278| Concept           | Syntax   | Example                                                                 |
279| ----------------- | -------- | ----------------------------------------------------------------------- |
280| Sequence          | space    | <MiniRepl client:visible tune={`sound("bd bd sd hh")`} />               |
281| Sample Number     | :x       | <MiniRepl client:visible tune={`sound("hh:0 hh:1 hh:2 hh:3")`} />       |
282| Rests             | - or ~   | <MiniRepl client:visible tune={`sound("metal - jazz jazz:1")`} />       |
283| Alternate         | \<\>     | <MiniRepl client:visible tune={`sound("<bd hh rim oh bd rim>")`} />     |
284| Sub-Sequences     | \[\]     | <MiniRepl client:visible tune={`sound("bd wind [metal jazz] hh")`} />   |
285| Sub-Sub-Sequences | \[\[\]\] | <MiniRepl client:visible tune={`sound("bd [metal [jazz [sd cp]]]")`} /> |
286| Speed up          | \*       | <MiniRepl client:visible tune={`sound("bd sd*2 cp*3")`} />              |
287| Parallel          | ,        | <MiniRepl client:visible tune={`sound("bd*2, hh*2 [hh oh]")`} />        |
288
289The Mini-Notation is usually used inside some function. These are the functions we've seen so far:
290
291| Name   | Description                         | Example                                                                           |
292| ------ | ----------------------------------- | --------------------------------------------------------------------------------- |
293| sound  | plays the sound of the given name   | <MiniRepl client:visible tune={`sound("bd sd [- bd] sd")`} />                     |
294| bank   | selects the sound bank              | <MiniRepl client:visible tune={`sound("bd sd [- bd] sd").bank("RolandTR909")`} /> |
295| setcpm | sets the tempo in cycles per minute | <MiniRepl client:visible tune={`setcpm(45); sound("bd sd [- bd] sd")`} />         |
296| n      | select sample number                | <MiniRepl client:visible tune={`n("0 1 4 2 0 6 3 2").sound("jazz")`} />           |
297
298## Examples
299
300**Basic rock beat**
301
302<MiniRepl
303  client:visible
304  tune={`setcpm(100/4)
305sound("[bd sd]*2, hh*8").bank("RolandTR505")`}
306  punchcard
307/>
308
309**Classic house**
310
311<MiniRepl client:visible tune={`sound("bd*4, [- cp]*2, [- hh]*4").bank("RolandTR909")`} punchcard />
312
313<Box>
314
315Notice that the two patterns are extremely similar.
316Certain drum patterns are reused across genres.
317
318</Box>
319
320We Will Rock you
321
322<MiniRepl
323  client:visible
324  tune={`setcpm(81/2)
325sound("bd*2 cp").bank("RolandTR707")`}
326  punchcard
327/>
328
329**Yellow Magic Orchestra - Firecracker**
330
331<MiniRepl
332  client:visible
333  tune={`setcpm(120/2)
334sound("bd sd, - - - hh - hh - -, - perc - perc:1*2")
335.bank("RolandCompurhythm1000")`}
336  punchcard
337/>
338
339**Imitation of a 16 step sequencer**
340
341<MiniRepl
342  client:visible
343  tune={`
344setcpm(90/4)
345sound(\`
346[-  -  oh - ] [-  -  -  - ] [-  -  -  - ] [-  -  -  - ],
347[hh hh -  - ] [hh -  hh - ] [hh -  hh - ] [hh -  hh - ],
348[-  -  -  - ] [cp -  -  - ] [-  -  -  - ] [cp -  -  - ],
349[bd -  -  - ] [-  -  -  bd] [-  -  bd - ] [-  -  -  bd]
350\`)`}
351  punchcard
352/>
353
354**Another one**
355
356<MiniRepl
357  client:visible
358  tune={`setcpm(88/4)
359sound(\`
360[-  -  -  - ] [-  -  -  - ] [-  -  -  - ] [-  -  oh:1 - ],
361[hh hh hh hh] [hh hh hh hh] [hh hh hh hh] [hh hh -  - ],
362[-  -  -  - ] [cp -  -  - ] [-  -  -  - ] [~  cp -  - ],
363[bd bd -  - ] [-  -  bd - ] [bd bd - bd ] [-  -  -  - ]
364\`).bank("RolandTR808")`}
365  punchcard
366/>
367
368**Not your average drums**
369
370<MiniRepl
371  client:visible
372  tune={`setcpm(100/2)
373s(\`jazz*2, 
374insect [crow metal] - -, 
375- space:4 - space:1,
376- wind\`)`}
377  punchcard
378/>
379
380Now that we know the basics of how to make beats, let's look at how we can play [notes](/workshop/first-notes).