WebGPU: Audio Processing using ShaderNode

[sunag]

Description

Pitch and delay effects.
Adjustments in GUI panel.

Soon is possible add this feature in NodeEditor.

Live

https://raw.githack.com/sunag/three.js/dev-audio-processing/examples/webgpu_audio_processing.html

This contribution is funded by Google

[sunag]

/cc @mrdoob

[Mugen87]

Would it be possible to add a small visual feedback to the example? Maybe something like webaudio_visualizer that visualizes the audio in some way?

[mrdoob]

Agreed that it would be nice to have a visualizer. Or a play button at least... 😅

I think webgpu audio processing could enable good 3d audio spatialization and wall occlusion for VR 🔥

[sunag]

@Mugen87 @mrdoob What do you think now?

const spectrum = mul( texture( analyserTexture, viewportTopLeft.x ).x, viewportTopLeft.y );
const backgroundNode = mul( color( 0x0000FF ), spectrum );

[Mugen87]

Much better 😊 !

[sunag]

@mrdoob Exactly, I will try to finish too my lip sync to three.js next year for any file format :)
I created it nine years ago, but even today it would be useful, mainly for VR avatars.

https://www.youtube.com/watch?v=rfuGqHR2MK8