jevstrudel.git / website / src / pages / de / workshop / first-sounds.mdx
first-sounds.mdx410 lines · 11.2 KB · raw
1---
2title: Erste 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# Erste Sounds
11
12Dies ist das erste Kapitel im Strudel Workshop, schön dich an Bord zu haben!
13
14## Textfelder
15
16Der Workshop ist voller interaktiver Textfelder. Lass uns lernen wie sie funktionieren. Hier ist eins:
17
18<MiniRepl client:visible tune={`sound("casio")`} />
19
20<Box>
21
221. ⬆️ Klicke in das obige Textfeld ⬆️
232. Drücke `Strg`+`Enter` zum Abspielen
243. Ändere `casio` in `metal`
254. Drücke `Strg`+`Enter` zum Aktualisieren
265. Drücke `Strg`+`Punkt` zum Stoppen
27
28Mac: `Strg` = `control` oder auch `option`
29
30</Box>
31
32Glückwunsch, du kannst jetzt live coden!
33
34## Sounds
35
36Gerade haben wir schon den ersten sound mit `sound` abgespielt:
37
38<MiniRepl client:visible tune={`sound("casio")`} />
39
40<Box>
41
42`casio` ist einer von vielen Standard Sounds.
43
44Probier ein paar andere Sounds aus:
45
46```
47insect wind jazz metal east crow casio space numbers
48```
49
50Es kann sein, dass du kurz nichts hörst während ein neuer Sound lädt.
51
52</Box>
53
54**Sample Nummer ändern mit :**
55
56Ein Sound kann mehrere Samples (Audio Dateien) enthalten.
57
58Du kannst ein anderes Sample wählen, indem du `:` und eine Zahl an den Sound-Namen anhängst:
59
60<MiniRepl client:visible tune={`sound("casio:1")`} />
61
62<Box>
63
64Probiere verschiedene Sound / Zahlen Kombinationen.
65
66Ohne Zahl ist gleichbedeutend mit `:0`
67
68</Box>
69
70Jetzt weißt du wie man Sounds abspielt und ihre Sample Nummer einstellt.
71Vorerst bleiben wir bei den voreingestellten Sounds, später erfahren wir noch wie man eigene benutzt.
72
73## Drum Sounds
74
75Strudel kommt von Haus aus mit einer breiten Auswahl an Drum Sounds:
76
77<MiniRepl client:visible tune={`sound("bd hh sd oh")`} />
78
79<Box>
80
81Diese Kombinationen von Buchstaben stehen für verschiedene Teile eines Schlagzeugs:
82
83<img src="/img/drumset.png" />
84
85<a class="text-right text-xs" href="https://de.wikipedia.org/wiki/Schlagzeug#/media/Datei:Drum_set.svg" target="_blank">
86  original von Pbroks13
87</a>
88
89- `bd` = **b**ass **d**rum - Basstrommel
90- `sd` = **s**nare **d**rum - Schnarrtrommel
91- `rim` = **rim**shot - Rahmenschlag
92- `hh` = **h**i**h**at - Hallo Hut
93- `oh` = **o**pen **h**ihat - Offener Hallo Hut
94- `lt` = **l**ow tom
95- `mt` = **m**iddle tom
96- `ht` = **h**igh tom
97- `rd` = **r**i**d**e cymbal
98- `cr` = **cr**ash cymbal
99
100Probier verschiedene Sounds aus!
101
102</Box>
103
104Wir können den Charakter des Drum Sounds verändern, indem wir mit `bank` die Drum Machine auswählen:
105
106<MiniRepl client:visible tune={`sound("bd hh sd oh").bank("RolandTR909")`} />
107
108In diesem Beispiel ist `RolandTR909` der Name der Drum Machine, die eine prägende Rolle für House und Techno Musik spielte.
109
110<Box>
111
112Ändere `RolandTR909` in
113
114- `AkaiLinn`
115- `RhythmAce`
116- `RolandTR808`
117- `RolandTR707`
118- `ViscoSpaceDrum`
119
120Es gibt noch viel mehr, aber das sollte fürs Erste reichen..
121
122🦥 Tipp für faule: Mach Doppel-Klick auf einen Namen um ihn zu markieren.
123Dann kannst du ihn mit `Strg`+`C` kopieren und mit `Strg`+`V` einfügen.
124
125</Box>
126
127## Sequenzen / Sequences
128
129Im letzten Beispiel haben wir schon gesehen dass man mehrere Sounds hintereinander abspielen kann wenn man sie durch Leerzeichen trennt:
130
131<MiniRepl client:visible tune={`sound("bd hh sd hh")`} punchcard />
132
133Beachte wie der aktuell gespielte Sound im Code markiert und auch darunter visualisiert wird.
134
135<Box>
136
137Versuch noch mehr Sounds hinzuzfügen!
138
139</Box>
140
141**Je länger die Sequence, desto schneller**
142
143<MiniRepl client:visible tune={`sound("bd bd hh bd rim bd hh bd")`} punchcard />
144
145Der Inhalt einer Sequence wird in einen sogenannten Cycle (=Zyklus) zusammengequetscht. Ein Cycle ist standardmäßig 2 Sekunden lang.
146
147**Eins pro Cycle mit `< .. >`**
148
149Hier ist die gleiche Sequence, aber dieses mal umgeben von `< .. >` (angle brackets):
150
151<MiniRepl client:visible tune={`sound("<bd bd hh bd rim bd hh bd>")`} punchcard />
152
153Jetzt spielt nur ein Sound pro Cycle. Mit diesen Klammern bleibt das Tempo immer gleich, ganz egal wieviele Elemente enhalten sind!
154
155Das ist jetzt aber etwas langsam, machen wir es schneller mit `*`:
156
157<MiniRepl client:visible tune={`sound("<bd bd hh bd rim bd hh bd>*8")`} punchcard />
158
159Die `*8` macht die ganze Sequenz 8 mal so schnell.
160
161<Box>
162
163Warte mal, ist das jetzt nicht das gleiche Ergebnis wie ohne `< ... >*8`? Wofür ist das dann gut?
164
165Korrekt, der echte Vorteil dieser Schreibweise zeigt sich wenn du Elemente entfernst oder hinzufügst. Versuch es mal!
166
167Ändere auch mal die Zahl am Ende um das Tempo zu verändern.
168
169</Box>
170
171**Tempo ändern mit `setcpm`**
172
173<MiniRepl
174  client:visible
175  tune={`setcpm(90/4)
176sound("<bd hh rim hh>*8")`}
177  punchcard
178/>
179
180<Box>
181
182cpm = **c**ycles per **m**inute = Cycles pro Minute
183
184Das Tempo is standardmäßig is 30 Cycles pro Minute = 120/4 = 1 Cycle alle 2 Sekunden
185
186In taditioneller Musik-Terminologie könnte man sagen, das Pattern oben besteht aus 8tel Noten auf 90bpm im 4/4 Takt.
187
188Kein Sorge wenn dir diese Begriffe nichts sagen, das ist nicht notwendig um mit Strudel Musik zu machen.
189
190</Box>
191
192Wir werden später noch mehr Möglichkeiten kennen lernen das Tempo zu verändern.
193
194**Pausen mit '-' oder '~'**
195
196<MiniRepl client:visible tune={`sound("bd hh - rim")`} punchcard />
197
198<Box>
199
200Du siehst wahrscheinlich auch Patterns von anderen Leuten mit '~' als Pausensymbol.
201Besonders für deutsche Tastaturen ist `-` eine Alternative zum schwer tippbaren `~`.
202
203</Box>
204
205**Unter-Sequenzen mit [Klammern]**
206
207<MiniRepl client:visible tune={`sound("bd [hh hh] rim [hh hh]")`} punchcard />
208
209<Box>
210
211Der Inhalt der Klammer wird ebenfalls zusammengequetscht!
212
213Füge noch mehr Sounds in die Klammern ein!
214
215</Box>
216
217Genau wie bei der ganzen Sequence wird eine Unter-Sequence schneller je mehr drin ist.
218
219**Multiplikation: Dinge schneller machen**
220
221<MiniRepl client:visible tune={`sound("bd hh*2 sd hh*3")`} punchcard />
222
223**Multiplikation: Vieeeeeeel schneller**
224
225<MiniRepl client:visible tune={`sound("bd hh*16 sd hh*8")`} punchcard />
226
227<Box>
228
229Tonhöhe = sehr schneller Rhythmus
230
231</Box>
232
233**Multiplikation: Ganze Unter-Sequences schneller machen**
234
235<MiniRepl client:visible tune={`sound("bd [sd hh]*2")`} punchcard />
236
237Bolero:
238
239<MiniRepl
240  client:visible
241  tune={`
242setcpm(10)
243sound("sd sd*3 sd sd*3 sd sd sd sd*3 sd sd*3 sd*3 sd*3")`}
244  punchcard
245/>
246
247**Unter-Unter-Sequenzen mit [[Klammern]]**
248
249<MiniRepl client:visible tune={`sound("bd [[rim rim] hh]")`} punchcard />
250
251<Box>
252
253Du kannst so tief verschachteln wie du willst!
254
255</Box>
256
257**Parallele Sequenzen mit Komma**
258
259<MiniRepl client:visible tune={`sound("hh hh hh, bd casio")`} punchcard />
260
261Du kannst so viele Kommas benutzen wie du möchtest:
262
263<MiniRepl client:visible tune={`sound("hh hh hh, bd bd, - casio")`} punchcard />
264
265Kommas können auch in Unter-Sequenzen verwendet werden:
266
267<MiniRepl client:visible tune={`sound("hh hh hh, bd [bd,casio]")`} punchcard />
268
269<Box>
270
271Ist dir aufgefallen dass sich die letzten beiden Beispiele gleich anhören?
272
273Es kommt öfter vor, dass man die gleiche Idee auf verschiedene Arten ausdrücken kann.
274
275</Box>
276
277**Mehrere Zeilen schreiben mit \` (backtick)**
278
279<MiniRepl
280  client:visible
281  tune={`sound(\`bd*2, - cp, 
282- - - oh, hh*4,
283[- casio]*2\`)`}
284  punchcard
285/>
286
287<Box>
288
289Ob man " oder \` benutzt ist nur eine Frage der Übersichtlichkeit.
290
291</Box>
292
293**Sample Nummer separat auswählen**
294
295Benutzt man nur einen Sound mit unterschiedlichen Sample Nummer sieht das so aus:
296
297<MiniRepl client:visible tune={`sound("jazz:0 jazz:1 [jazz:4 jazz:2] jazz:3*2")`} punchcard />
298
299Das gleiche kann man auch so schreiben:
300
301<MiniRepl client:visible tune={`n("0 1 [4 2] 3*2").sound("jazz")`} punchcard />
302
303## Rückblick
304
305Wir haben jetzt die Grundlagen der sogenannten Mini-Notation gelernt, der Rhythmus-Sprache von Tidal.
306
307Das haben wir bisher gelernt:
308
309| Concept               | Syntax      | Example                                                               |
310| --------------------- | ----------- | --------------------------------------------------------------------- |
311| Sequenz               | Leerzeichen | <MiniRepl client:visible tune={`sound("bd bd sd hh")`} />             |
312| Sound Nummer          | :x          | <MiniRepl client:visible tune={`sound("hh:0 hh:1 hh:2 hh:3")`} />     |
313| Pausen                | -           | <MiniRepl client:visible tune={`sound("metal - jazz jazz:1")`} />     |
314| Unter-Sequenzen       | \[\]        | <MiniRepl client:visible tune={`sound("bd wind [metal jazz] hh")`} /> |
315| Unter-Unter-Sequenzen | \[\[\]\]    | <MiniRepl client:visible tune={`sound("bd [metal [jazz sd]]")`} />    |
316| Schneller             | \*          | <MiniRepl client:visible tune={`sound("bd sd*2 cp*3")`} />            |
317| Parallel              | ,           | <MiniRepl client:visible tune={`sound("bd*2, hh*2 [hh oh]")`} />      |
318
319Die mit Apostrophen umgebene Mini-Notation benutzt man normalerweise in einer sogenannten Funktion.
320Die folgenden Funktionen haben wir bereits gesehen:
321
322| Name   | Description                            | Example                                                                 |
323| ------ | -------------------------------------- | ----------------------------------------------------------------------- |
324| sound  | Spielt den Sound mit dem Namen         | <MiniRepl client:visible tune={`sound("bd sd")`} />                     |
325| bank   | Wählt die Soundbank / Drum Machine     | <MiniRepl client:visible tune={`sound("bd sd").bank("RolandTR909")`} /> |
326| setcpm | Tempo in **C**ycles **p**ro **M**inute | <MiniRepl client:visible tune={`setcpm(90); sound("bd sd")`} />         |
327| n      | Sample Nummer                          | <MiniRepl client:visible tune={`n("0 1 4 2").sound("jazz")`} />         |
328
329## Beispiele
330
331**Einfacher Rock Beat**
332
333<MiniRepl
334  client:visible
335  tune={`setcpm(100/2)
336sound("bd sd, hh*4").bank("RolandTR505")`}
337  punchcard
338/>
339
340**Klassischer House**
341
342<MiniRepl client:visible tune={`sound("bd*2, - cp, [- hh]*2").bank("RolandTR909")`} punchcard />
343
344<Box>
345
346Ist die aufgefallen dass die letzten 2 Patterns extrem ähnlich sind?
347Bestimmte Drum Patterns werden oft genreübergreifend wiederverwendet.
348
349</Box>
350
351We Will Rock you
352
353<MiniRepl
354  client:visible
355  tune={`setcpm(81/2)
356sound("bd*2 cp").bank("RolandTR707")`}
357  punchcard
358/>
359
360**Yellow Magic Orchestra - Firecracker**
361
362<MiniRepl
363  client:visible
364  tune={`sound("bd sd, - - - hh - hh - -, - perc - perc:1*2")
365.bank("RolandCompurhythm1000")`}
366  punchcard
367/>
368
369**Nachahmung eines 16 step sequencers**
370
371<MiniRepl
372  client:visible
373  tune={`setcpm(90/4)
374sound(\`
375[-  -  oh - ] [-  -  -  - ] [-  -  -  - ] [-  -  -  - ],
376[hh hh -  - ] [hh -  hh - ] [hh -  hh - ] [hh -  hh - ],
377[-  -  -  - ] [cp -  -  - ] [-  -  -  - ] [cp -  -  - ],
378[bd -  -  - ] [-  -  -  bd] [-  -  bd - ] [-  -  -  bd]
379\`)`}
380  punchcard
381/>
382
383**Noch eins**
384
385<MiniRepl
386  client:visible
387  tune={`setcpm(88/4)
388sound(\`
389[-  -  -  - ] [-  -  -  - ] [-  -  -  - ] [-  -  oh:1 - ],
390[hh hh hh hh] [hh hh hh hh] [hh hh hh hh] [hh hh -  - ],
391[-  -  -  - ] [cp -  -  - ] [-  -  -  - ] [-  cp -  - ],
392[bd bd -  - ] [-  -  bd - ] [bd bd - bd ] [-  -  -  - ]
393\`).bank("RolandTR808")`}
394  punchcard
395/>
396
397**Nicht so typische Drums**
398
399<MiniRepl
400  client:visible
401  tune={`setcpm(100/2)
402s(\`jazz*2, 
403insect [crow metal] - -, 
404- space:4 - space:1,
405- wind\`)`}
406  punchcard
407/>
408
409Jetzt haben wir eine grundlegende Ahnung davon wie man mit Strudel Beats baut!
410Im nächsten Kapitel werden wir ein paar [Töne spielen](/de/workshop/first-notes).