Large Heydon ColliderThe HTML cat is out of the Web Audio bag. I've finally released HYPERBLAM.
It’s my system for sampling, processing, and sequencing sound and music directly in HTML.
Green Fleuron@heydon that looks super exciting!
Are there any super minimal examples for people who are not used to writing html pages but want to toy around with this way to interact with the webaudio api?
e.g. html documents which are mostly stuff inside the <audio-blam> </audio-blam> and which start to play right away?
I understand that the interactivity and visualization are helping to show what is happening (also I like the stype of the web page), but at the moment I am wondering if there is UI stuff I need to learn first before I can write down audio sketches in hyperblam.
@fleuron Hi! Thanks for the interest. You can try following this setup page to begin with: https://hyperblam.how/guides/get-started/.
To see how the elements actually work together, I would step through the examples (https://hyperblam.how/examples/)
Let me know how you get on. If it's not easy to use, that's my fault, not yours.
@heydon I really appreciate that you're taking your time.
For me, the current technological barrier is not (yet) understanding how the elements interact, it's more getting a local file to make any sound. The guides and examples look great to expand on once I have a "hello world" kind of html file to start with.
I followed the https://hyperblam.how/guides/get-started/ guide, downloaded the zip, unpacked it. I have a folder where I put my html files and this folder has dist/hyperblam/hyperblam.js.
In my local copy of "I wear many hats", I replaced
<script type="module" src="https://hyperblam.how/static/hyperblam/dist/hyperblam/hyperblam.js"></script>
by
<script type="module" src="dist/hyperblam/hyperblam.js"></script>
This leads to a blinking "...loading" instead of the play button.
Upon inspecting the page, this might be caused by some security feature of my firefox: https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CORS/Errors/CORSRequestNotHttp?utm_source=devtools&utm_medium=firefox-cors-errors&utm_campaign=default
@fleuron Ahh. Yeah, I think you've done everything right, but you will need to run a local server to make it work (not just run it off the file system). If you are not familiar with that, I'll give some recommendations.
@fleuron Just seen this simple (and free) bit of software: https://simplewebserver.org/
@heydon thanks for the quick diagnosis. I will look into either running a local server or using some place to host my html file, like codeberg pages.
I'll report back if I encounter anything too scary to tackle alone.
@fleuron Actually, I think I might set up a CodePen that you and others can fork. Will work on that ASAP.
<3
Coming from strudel, a REPL is just the kind of thing which is very inviting to start to play with the code to make sounds.
@heydon thanks for the recommendations!
ended up using caddy and managed to make a simple beat with a low pass on the kick, an echo (!) on the snare, and some other effects on a clap and the high hats.
I want to look into the grammar of chains and lfos next, but not today.
@fleuron that's great! Always here to help.