{"id":2444,"date":"2026-10-08T15:52:55","date_gmt":"2026-10-08T14:52:55","guid":{"rendered":"https:\/\/blog.freesound.org\/?p=2444"},"modified":"2026-10-08T15:52:55","modified_gmt":"2026-10-08T14:52:55","slug":"mirlca-web-live-coding-with-freesound-in-the-web-browser","status":"publish","type":"post","link":"https:\/\/blog.freesound.org\/?p=2444","title":{"rendered":"MIRLCa-web: Live-coding with Freesound in the web browser"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/main-image.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"627\" src=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/main-image-1024x627.png\" alt=\"\" class=\"wp-image-2447\" srcset=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/main-image-1024x627.png 1024w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/main-image-300x184.png 300w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/main-image-768x470.png 768w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/main-image-1536x941.png 1536w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/main-image.png 1613w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">[Guest blog post by <a href=\"https:\/\/freesound.org\/people\/sensingtheforest\/\"><a href=\"https:\/\/nb-nik.org\/\">Nikhil Bullock<\/a><\/a>]<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">As part of my thesis for the Sound and Music Computing Masters programme at Queen Mary University of London this summer, I implemented <strong><a href=\"https:\/\/mirlca-web.nb-nik.org\/\">MIRLCa-web<\/a><\/strong>, a port of the SuperCollider extension\u00a0<a href=\"https:\/\/github.com\/axambo\/MIRLCa\">MIRLCa<\/a>\u00a0to the browser. MIRLCa, developed by <a href=\"https:\/\/annaxambo.me\">Anna Xamb\u00f3 Sed\u00f3<\/a> (who was also my supervisor for this project together with <a href=\"https:\/\/allholy.github.io\">Panagiota Anastasopoulou<\/a>, a PhD student from Music Technology Group, Universitat Pompeu Fabra, who&#8217;s part of the Freesound team and author of the <a href=\"https:\/\/blog.freesound.org\/?p=2206\">Broad Sound Taxonomy<\/a>), is a <strong>live-coding system<\/strong> that makes extensive use of <strong>Freesound and its\u00a0API<\/strong>. <em>Live-coding<\/em> is the practice of performing music by writing code, and MIRLCa provides tools to retrieve sounds from Freesound using various methods, such as picking a sound at random or filtering by the many acoustic properties provided by the Freesound API.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Given that Freesound is so large (more than 700,000 sounds at the time of writing), choosing sounds you like while trying to perform can be quite a challenge. MIRLCa tries to solve this by using a binary classifier neural network that chooses and <strong>plays only sounds that it predicts will be good<\/strong>. So for example, when you pick a random sound, it&#8217;s not truly a random sound, but a sound that the neural network predicts you&#8217;ll like chosen from a random selection. MIRLCa also lets you train your own neural network, meaning it&#8217;ll be tailored to your own preferences and musical taste.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">MIRLCa-web takes these ideas and ports over to the browser, so you don&#8217;t have to install and set up SuperCollider. You can <a href=\"https:\/\/mirlca-web.nb-nik.org\/\">try it out here<\/a>. At the time of writing, apart from a successful user study with five participants, the tool has been publicly tested for the first time and well-received in a workshop at the <a href=\"https:\/\/zentrum-pop.de\/ai-soundscapes\/\">AI Soundscapes congress<\/a> in Potsdam, Germany.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/training-mode-ui.png\"><img loading=\"lazy\" decoding=\"async\" width=\"850\" height=\"491\" src=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/training-mode-ui.png\" alt=\"\" class=\"wp-image-2445\" srcset=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/training-mode-ui.png 850w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/training-mode-ui-300x173.png 300w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/training-mode-ui-768x444.png 768w\" sizes=\"auto, (max-width: 850px) 100vw, 850px\" \/><\/a><figcaption class=\"wp-element-caption\">Figure 1: The training mode section, where the neural network is trained<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The workflow of MIRLCa-web is split into two phases:<em> training mode<\/em> and <em>performance mode<\/em>. During\u00a0<strong>training mode<\/strong>\u00a0(Figure 1) you listen to and rate sounds that have been pulled from Freesound. Each good or bad rating you provide is used to train the neural network. The neural network analyses the sounds based on their\u00a0<a href=\"https:\/\/en.wikipedia.org\/wiki\/Mel-frequency_cepstrum\">MFCCs<\/a> (Mel-frequency cepstral coefficients), which are provided by the Freesound API. MFCCs capture the timbral properties of a sound, so they make a suitable choice as training data. Once you&#8217;ve trained the neural network, you&#8217;re then ready to use performance mode.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/performance-mode-ui.png\"><img loading=\"lazy\" decoding=\"async\" width=\"821\" height=\"434\" src=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/performance-mode-ui.png\" alt=\"\" class=\"wp-image-2446\" srcset=\"https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/performance-mode-ui.png 821w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/performance-mode-ui-300x159.png 300w, https:\/\/blog.freesound.org\/wp-content\/uploads\/2026\/10\/performance-mode-ui-768x406.png 768w\" sizes=\"auto, (max-width: 821px) 100vw, 821px\" \/><\/a><figcaption class=\"wp-element-caption\">Figure 2: The Performance mode live-coding interface, showing the text editor and console panels<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Performance mode<\/strong>&nbsp;(Figure 2) is where you do the live-coding, It&#8217;s in here where you can retrieve, play, and manipulate sounds by writing JavaScript. The way you interact with sounds is through&nbsp;<code>Group<\/code>&nbsp;objects, so to start making music, you first create a group:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>x = Group();<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Then you can retrieve sounds and add them to the&nbsp;<code>Group<\/code>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ Pick 5 random \"good\" sounds.\nfor (let i = 0; i &lt; 5; i++) {\n  x.rand();\n}\n\n\/\/ Pick a \"good\" sound filtered by acoustic descriptors.\nx.filter({ bpm: 120, roughness: \"&#91;70 TO 100]\" });<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">As soon as the sounds are loaded, they start playing. You can manipulate the sounds within the group, for example by changing their playback rate and volume:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>x.rate(3.5);\nx.vol(0.5);<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">And add sound effects to the group, such as reverb and echo:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ Add a reverb to the group.\nx.fx.add(\"reverb\");\n\n\/\/ Add an echo with a delay time of 0.5 seconds and feedback of 90%.\nx.fx.add(\"delay\").time(0.5).fb(0.9);<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">There are other effects as well, which you read more about in the <a href=\"https:\/\/mirlca-web.nb-nik.org\/#effects\">guide<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can also sequence the sounds into rhythms using the&nbsp;<code>seq<\/code>function. A sequence contains a series of&nbsp;<code>x<\/code>s and&nbsp;<code>-<\/code>s that determine when to play the sound or rest. Square brackets nest sequences, i.e. they create a sequence within a particular beat:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ Set the tempo.\nsetBPM(125)\n\n\/\/ Create a sequence for the 4th sound in the group.\nx.seq(\"x--x--&#91;x--]\", 3)<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">MIRLCa-web is a work in progress and we are still experimenting with different ideas and features. It&#8217;s also an open-source project (find the code&nbsp;<a href=\"https:\/\/codeberg.org\/nb-nik\/mirlca-web\">here<\/a>) and I welcome any suggestions, bug reports, or pull requests. Finally, I would like to thank the participants who contributed to the user study, as well as my supervisors Anna Xamb\u00f3 Sed\u00f3 and Panagiota Anastasopoulou.<\/p>\n\n\n\n<p class=\"has-text-align-center wp-block-paragraph\">***<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><em><a href=\"https:\/\/nb-nik.org\/\">Nikhil Bullock<\/a>\u00a0is a London-based musician and researcher whose music is influenced by UK club culture and algorithmic composition. His practice explores live-coding and generative processes as tools for sonic exploration. He is currently pursuing an MSc in Sound and Music Computing at Queen Mary University of London.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>[Guest blog post by Nikhil Bullock] As part of my thesis for the Sound and Music Computing Masters programme at Queen Mary University of London this summer, I implemented MIRLCa-web, a port of the SuperCollider extension\u00a0MIRLCa\u00a0to the browser. MIRLCa, developed &hellip; <a href=\"https:\/\/blog.freesound.org\/?p=2444\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":32,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2444","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/blog.freesound.org\/index.php?rest_route=\/wp\/v2\/posts\/2444","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.freesound.org\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.freesound.org\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.freesound.org\/index.php?rest_route=\/wp\/v2\/users\/32"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.freesound.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2444"}],"version-history":[{"count":4,"href":"https:\/\/blog.freesound.org\/index.php?rest_route=\/wp\/v2\/posts\/2444\/revisions"}],"predecessor-version":[{"id":2451,"href":"https:\/\/blog.freesound.org\/index.php?rest_route=\/wp\/v2\/posts\/2444\/revisions\/2451"}],"wp:attachment":[{"href":"https:\/\/blog.freesound.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2444"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.freesound.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2444"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.freesound.org\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2444"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}