Non Sound Reactive Patterns to Sound Reactive

Patterns and Code
1

Is it possible to make the non sound reactive patterns, react to sound by adding some code? Or is it a whole new code? I’ve tried figuring out that music sequencer but am pretty lost for now. Also, can you make the 3D and 2D patterns 1D by changing the code?

2

Short answer: yes.

The music sequencer is a nifty piece of code, but it’s not a good starting place for learning how to do SR code. (Jeff is awesome, and I need to pull that pattern apart and learn more)

How would/could you modify a nonSR pattern to have SR?

First off let’s explore how you make patterns more flexible: you add sliders. You take variables (or potential variables, ie values that if changed, change the pattern) in the code, and tie them to a slider. I do this a lot, you can find a bunch of slider happy code, between my contributions here and others as well.

So let’s assume you find a place where a slider lets you adjust the pattern. Maybe it’s color, maybe it’s size. Doesn’t matter. You now have a range of values (the slider range) to play with…

So now tying a SR element to that range is the next step.

You could go simple… Maybe it’s just the strongest energy… It’ll move around and you’ll make that value (instead of being slider controlled) change based on the sound variable that makes sense. Maybe the higher in the range of values, the stronger (maxFrequencyMagnitude) or higher (maxFrequency) the sound. Or maybe the average sound (energyAverage) controls the range
And of course, more complex: the array of
frequencyData is yours to play with …

Maybe the lower frequencies strength controls one value and the higher frequencies another; or maybe particular frequencies each control a section or a color scheme, etc etc.

The PI controller code in some patterns (which tries to deal with gain in an automatic way) can be helpful but I’ve found it often needs higher ranges (like some patterns it’ll be 400 Max and I need more like 2000)

Does this help?

Part 2 of your question:
Can you make 2D or 3D patterns 1D? Yes, but …
They won’t look great very often.

1D patterns tend to be written as index based, not X axis based (some are, and use index/Pixelcount as a pseudo-X value.)

2D and 3D, usually use x,y (and z) all of which are between 0 and 1 (written as 0…1 in shorthand)

So if you have a 2D pattern using X and Y, you can always make a cheater 3D pattern, by saying Z is always 0, or .5 or whatever.
And vice versa, you can often convert a 3D pattern into 2D, by saying Z is always 0 or whatever.

But with 1D, you lose the Y also… So now it’s X, and Y (and Z) are only ever one value. Too many patterns look weird in 1D because the loss of Y is killer, it’s the Y changes that makes the pattern interesting. (Same reason that some 3Ds look weird at 2D, cause the Z matters.)

3 Likes
3

Thank you for some insight. I really appreciate you taking the time to reply. This definitely helps

4

This is a really nice explainer @Scruffynerf!

@Scheeeeer I extracted a really minimal example for you to play with. Copy-paste the relevant parts below into any other pattern, then try multiplying anything by beat and see what happens!

export var frequencyData  // Requires sensor board
export var beat, bass, bassEMA // EMA = exponential moving average
export function beforeRender(delta) {
  bass = 256 * (frequencyData[1] + frequencyData[2] + 
                frequencyData[3] + frequencyData[4])
  bassEMA = 127 * bassEMA / 128 + bass / 128
  // (bass > 1) is the threshold, and tunable. It works for
  // the onboard mic - try `(bass > 5)`, etc for louder 
  // music or to only catch beats and not bass lines.
  beat = bass / bassEMA / 8 * (bass > 1)
}

export function render(index) {
  hsv(0, 1, beat)
}
7 Likes
5

Oh wow!!! Thank you so much!!! This is amazing! Love the pixelblaze and the community! Hopefully I can report back with some positive results soon!

2 Likes