Remove hideHeader for better mobile UI and consistency

This commit is contained in:
Richard Julian 2024-01-06 11:55:00 -08:00
parent b52cb198b5
commit 4651066472
10 changed files with 203 additions and 292 deletions

View file

@ -15,7 +15,6 @@ import Box from '@components/Box.astro';
**low-pass filter**
<MiniRepl
hideHeader
client:visible
tune={`note("<[c2 c3]*4 [bb1 bb2]*4 [f2 f3]*4 [eb2 eb3]*4>/2")
.sound("sawtooth").lpf(800)`}
@ -33,7 +32,6 @@ lpf = **l**ow **p**ass **f**ilter
**filter automatisieren**
<MiniRepl
hideHeader
client:visible
tune={`note("<[c2 c3]*4 [bb1 bb2]*4 [f2 f3]*4 [eb2 eb3]*4>/2")
.sound("sawtooth").lpf("200 1000")`}
@ -51,7 +49,6 @@ Später sehen wir, wie man mit Wellenformen Dinge automatisieren kann.
**vowel = Vokal**
<MiniRepl
hideHeader
client:visible
tune={`note("<[c3,g3,e4] [bb2,f3,d4] [a2,f3,c4] [bb2,g3,eb4]>/2")
.sound("sawtooth").vowel("<a e i o>/2")`}
@ -60,7 +57,6 @@ Später sehen wir, wie man mit Wellenformen Dinge automatisieren kann.
**gain = Verstärkung**
<MiniRepl
hideHeader
client:visible
tune={`stack(
sound("hh*8").gain("[.25 1]*2"),
@ -83,7 +79,6 @@ Bei Rhythmen ist die Dynamik (= Veränderungen der Lautstärke) sehr wichtig.
Lass uns die obigen Beispiele kombinieren:
<MiniRepl
hideHeader
client:visible
tune={`stack(
stack(
@ -108,7 +103,6 @@ Die 3 Teile (Drums, Bass, Akkorde) sind genau wie vorher, nur in einem `stack`,
**Den Sound formen mit ADSR-Hüllkurve**
<MiniRepl
hideHeader
client:visible
tune={`note("<c3 bb2 f3 eb3>")
.sound("sawtooth").lpf(600)
@ -145,7 +139,6 @@ Kannst du erraten, was die einzelnen Werte machen?
**adsr-Kurznotation**
<MiniRepl
hideHeader
client:visible
tune={`note("<c3 bb2 f3 eb3>")
.sound("sawtooth").lpf(600)
@ -156,7 +149,6 @@ Kannst du erraten, was die einzelnen Werte machen?
**delay = Verzögerung**
<MiniRepl
hideHeader
client:visible
tune={`stack(
note("~ [<[d3,a3,f4]!2 [d3,bb3,g4]!2> ~]")
@ -188,7 +180,6 @@ Was passiert, wenn du `.delay(".8:.06:.8")` schreibst? Kannst du erraten, was di
**room aka reverb = Hall**
<MiniRepl
hideHeader
client:visible
tune={`n("<4 [3@3 4] [<2 0> ~@16] ~>/2")
.scale("D4:minor").sound("gm_accordion:2")
@ -206,7 +197,6 @@ Füg auch ein Delay hinzu!
**kleiner Dub-Tune**
<MiniRepl
hideHeader
client:visible
tune={`stack(
note("~ [<[d3,a3,f4]!2 [d3,bb3,g4]!2> ~]")
@ -221,7 +211,6 @@ Füg auch ein Delay hinzu!
Für echten Dub fehlt noch der Bass:
<MiniRepl
hideHeader
client:visible
tune={`stack(
note("~ [<[d3,a3,f4]!2 [d3,bb3,g4]!2> ~]")
@ -245,7 +234,6 @@ Füg `.hush()` ans Ende eines Patterns im stack...
**pan = Panorama**
<MiniRepl
hideHeader
client:visible
tune={`sound("numbers:1 numbers:2 numbers:3 numbers:4")
.pan("0 0.3 .6 1")
@ -254,13 +242,13 @@ Füg `.hush()` ans Ende eines Patterns im stack...
**speed = Geschwindigkeit**
<MiniRepl hideHeader client:visible tune={`sound("bd rim").speed("<1 2 -1 -2>").room(.2)`} />
<MiniRepl client:visible tune={`sound("bd rim").speed("<1 2 -1 -2>").room(.2)`} />
**fast and slow = schnell und langsam**
Mit `fast` und `slow` kann man das Tempo eines Patterns außerhalb der Mini-Notation ändern:
<MiniRepl hideHeader client:visible tune={`sound("bd*2,~ rim").slow(2)`} />
<MiniRepl client:visible tune={`sound("bd*2,~ rim").slow(2)`} />
<Box>
@ -272,13 +260,13 @@ Was passiert, wenn du den Wert automatisierst? z.b. `.fast("<1 [2 4]>")` ?
Übrigens, innerhalb der Mini-Notation: `fast` ist `*` und `slow` ist `/`.
<MiniRepl hideHeader client:visible tune={`sound("[bd*2,~ rim]*<1 [2 4]>")`} />
<MiniRepl client:visible tune={`sound("[bd*2,~ rim]*<1 [2 4]>")`} />
## Automation mit Signalen
Anstatt Werte schrittweise zu automatisieren, können wir auch sogenannte Signale benutzen:
<MiniRepl hideHeader client:visible tune={`sound("hh*16").gain(sine)`} punchcard punchcardLabels={false} />
<MiniRepl client:visible tune={`sound("hh*16").gain(sine)`} punchcard punchcardLabels={false} />
<Box>
@ -294,7 +282,7 @@ Der `gain`-Wert (Verstärkung) wird in der Visualisierung als Transparenz darges
Signale bewegen sich standardmäßig zwischen 0 und 1. Wir können das mit `range` ändern:
<MiniRepl hideHeader client:visible tune={`sound("hh*8").lpf(saw.range(500, 2000))`} />
<MiniRepl client:visible tune={`sound("hh*8").lpf(saw.range(500, 2000))`} />
`range` ist nützlich wenn wir Funktionen mit einem anderen Wertebereich als 0 und 1 automatisieren wollen (z.b. `lpf`)
@ -307,7 +295,6 @@ Was passiert wenn du die beiden Werte vertauschst?
Wir können die Geschwindigkeit der Automation mit slow / fast ändern:
<MiniRepl
hideHeader
client:visible
tune={`note("<[c2 c3]*4 [bb1 bb2]*4 [f2 f3]*4 [eb2 eb3]*4>/2")
.sound("sawtooth")
@ -324,13 +311,13 @@ Die ganze Automation braucht nun 8 cycle bis sie sich wiederholt.
| Name | Beispiel |
| ----- | -------------------------------------------------------------------------------------------------- |
| lpf | <MiniRepl hideHeader client:visible tune={`note("c2 c3").s("sawtooth").lpf("<400 2000>")`} /> |
| vowel | <MiniRepl hideHeader client:visible tune={`note("c3 eb3 g3").s("sawtooth").vowel("<a e i o>")`} /> |
| gain | <MiniRepl hideHeader client:visible tune={`s("hh*8").gain("[.25 1]*2")`} /> |
| delay | <MiniRepl hideHeader client:visible tune={`s("bd rim").delay(.5)`} /> |
| room | <MiniRepl hideHeader client:visible tune={`s("bd rim").room(.5)`} /> |
| pan | <MiniRepl hideHeader client:visible tune={`s("bd rim").pan("0 1")`} /> |
| speed | <MiniRepl hideHeader client:visible tune={`s("bd rim").speed("<1 2 -1 -2>")`} /> |
| range | <MiniRepl hideHeader client:visible tune={`s("hh*16").lpf(saw.range(200,4000))`} /> |
| lpf | <MiniRepl client:visible tune={`note("c2 c3").s("sawtooth").lpf("<400 2000>")`} /> |
| vowel | <MiniRepl client:visible tune={`note("c3 eb3 g3").s("sawtooth").vowel("<a e i o>")`} /> |
| gain | <MiniRepl client:visible tune={`s("hh*8").gain("[.25 1]*2")`} /> |
| delay | <MiniRepl client:visible tune={`s("bd rim").delay(.5)`} /> |
| room | <MiniRepl client:visible tune={`s("bd rim").room(.5)`} /> |
| pan | <MiniRepl client:visible tune={`s("bd rim").pan("0 1")`} /> |
| speed | <MiniRepl client:visible tune={`s("bd rim").speed("<1 2 -1 -2>")`} /> |
| range | <MiniRepl client:visible tune={`s("hh*16").lpf(saw.range(200,4000))`} /> |
Lass uns nun die für Tidal typischen [Pattern-Effekte anschauen](/de/workshop/pattern-effects).