Artifact
71f2c63dd2dedadc12b2709574ea174908fe8d87bd414421900189ac21933bad:
- File
build/html/what.html
— part of check-in
[4cb0fff742]
at
2022-03-27 22:44:18
on branch trunk
— Updating JUCE link and build scripts
(user:
dev
size: 19286)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>What is bitrhythm about ? — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
<link rel="preload" as="font" type="font/woff2" crossorigin
href="_static/vendor/fontawesome/5.13.0/webfonts/fa-solid-900.woff2">
<link rel="preload" as="font" type="font/woff2" crossorigin
href="_static/vendor/fontawesome/5.13.0/webfonts/fa-brands-400.woff2">
<link rel="stylesheet" href="_static/pygments.css" type="text/css" />
<link rel="stylesheet" href="_static/sphinx-book-theme.e8e5499552300ddf5d7adccae7cc3b70.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="_static/custom.css" />
<link rel="preload" as="script" href="_static/js/index.1c5a1a01449ed65a7b51.js">
<script id="documentation_options" data-url_root="./" src="_static/documentation_options.js"></script>
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Source Code and License" href="source-code.html" />
<link rel="prev" title="Welcome to Bitrhythm’s documentation!" href="index.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
<div class="container-xl">
<div class="row">
<div class="col-12 col-md-3 bd-sidebar site-navigation show" id="site-navigation">
<div class="navbar-brand-box">
<a class="navbar-brand text-wrap" href="index.html">
<h1 class="site-logo" id="site-title">Bitrhythm's literate documentation</h1>
</a>
</div><nav class="bd-links" id="bd-docs-nav" aria-label="Main navigation">
<div class="bd-toc-item active">
<p class="caption">
<span class="caption-text">
Table of Contents
</span>
</p>
<ul class="current nav bd-sidenav">
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
What is bitrhythm about ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving / Recording / Streaming
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="bookmarks.html">
Bookmarks
</a>
</li>
</ul>
</div>
</nav> <!-- To handle the deprecated key -->
<div class="navbar_extra_footer">
<a target="_blank" href="/">Bitrhythm App Home</a><br>
<a target="_blank" href="https://xyzzyapps.link">Xyzzy Apps Home</a><br>
<p class='custom-nav-footer'>(c) Xyzzy Apps, 2021</p>
</div>
</div>
<main class="col py-md-3 pl-md-4 bd-content overflow-auto" role="main">
<div class="topbar container-xl fixed-top">
<div class="topbar-contents row">
<div class="col-12 col-md-3 bd-topbar-whitespace site-navigation show"></div>
<div class="col pl-md-4 topbar-main">
<button id="navbar-toggler" class="navbar-toggler ml-0" type="button" data-toggle="collapse"
data-toggle="tooltip" data-placement="bottom" data-target=".site-navigation" aria-controls="navbar-menu"
aria-expanded="true" aria-label="Toggle navigation" aria-controls="site-navigation"
title="Toggle navigation" data-toggle="tooltip" data-placement="left">
<i class="fas fa-bars"></i>
<i class="fas fa-arrow-left"></i>
<i class="fas fa-arrow-up"></i>
</button>
<!-- Source interaction buttons -->
<!-- Full screen (wrap in <a> to have style consistency -->
<a class="full-screen-button"><button type="button" class="btn btn-secondary topbarbtn" data-toggle="tooltip"
data-placement="bottom" onclick="toggleFullScreen()" aria-label="Fullscreen mode"
title="Fullscreen mode"><i
class="fas fa-expand"></i></button></a>
<!-- Launch buttons -->
</div>
<!-- Table of contents -->
<div class="d-none d-md-block col-md-2 bd-toc show">
<div class="tocsection onthispage pt-5 pb-3">
<i class="fas fa-list"></i> Contents
</div>
<nav id="bd-toc-nav">
<ul class="visible nav section-nav flex-column">
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#intro">
Intro
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#adc-2021">
ADC 2021
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#inspiration-for-the-project">
Inspiration for the project
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#license">
License
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#support-this-project">
Support this project
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="what-is-bitrhythm-about">
<h1>What is bitrhythm about ?<a class="headerlink" href="#what-is-bitrhythm-about" title="Permalink to this headline">¶</a></h1>
<div class="section" id="intro">
<h2>Intro<a class="headerlink" href="#intro" title="Permalink to this headline">¶</a></h2>
<p>In Bitrhythm you get a coding playground to make music with webaudio, canvas and webgl apis. You can share the final track as a URL which enables interactive music with your listener. The url size limit acts as a contraint on creativity.</p>
<p>Apart from the core html apis, you can also use the following libraries</p>
<ol class="simple">
<li><p>Tuna</p></li>
<li><p>Timbral</p></li>
<li><p>Tone.js</p></li>
<li><p>Underscore / Rambda</p></li>
<li><p>cellx (observers)</p></li>
<li><p>Magenta.js (Machine Learning)</p></li>
<li><p>P5.js / D3</p></li>
<li><p>Winamp Visualisations (butterchurn)</p></li>
</ol>
<div class="highlight-html notranslate"><div class="highlight"><pre><span></span><span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/tensorflow/1.2.8/tf.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/@magenta/music@^1.0.0/es6/core.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/@magenta/music@^1.0.0/es6/music_vae.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">sec</span><span class="o">=</span><span class="s">"https://mohayonao.github.io/timbre.js/timbre.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/tunajs/1.0.1/tuna-min.js"</span> <span class="na">type</span><span class="o">=</span><span class="s">"text/javascript"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/tone/14.7.77/Tone.js"</span> <span class="na">integrity</span><span class="o">=</span><span class="s">"sha512-gwSDP1iEKl4KG0wi3N89RAJU91s78jb/TGC6lsbF5IyR2c19Rn7Jl1icK4K4kUiJNwQUEPI7o98T+GJVWNuvIQ=="</span> <span class="na">crossorigin</span><span class="o">=</span><span class="s">"anonymous"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"/teoria-master/teoria.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"/303.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/p5@1.3.1/lib/p5.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/d3@5.7.0/dist/d3.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://threejs.org/build/three.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/butterchurn@2.6.7/lib/butterchurn.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/butterchurn-presets@2.4.7/lib/butterchurnPresets.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/webmidi@2.0.0"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://code.jquery.com/jquery-3.4.1.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"/nexus-js/dist/NexusUI.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/cellx/1.10.19/cellx.umd.min.js"</span> <span class="na">integrity</span><span class="o">=</span><span class="s">"sha512-ojEcAP3e6N+n5MDKPW6CexXzuLDahDPkNZmzyRV4t2zqh9nwljJNuV8JGa+xjpnAaGB/FhsAU7P6IHEP0dtJQA=="</span> <span class="na">crossorigin</span><span class="o">=</span><span class="s">"anonymous"</span> <span class="na">referrerpolicy</span><span class="o">=</span><span class="s">"no-referrer"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
<span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/mousetrap/1.4.6/mousetrap.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span>
</pre></div>
</div>
<p>A few things implemented from scratch in Bitrhythm are,</p>
<ol class="simple">
<li><p>DSL for describing music sequences - similar to the tracker notation</p></li>
<li><p>A core Music Loop that runs your javascript code, with an edit mode</p></li>
<li><p>A knob and guard abstraction for programming automation</p></li>
</ol>
<p>You can use Bitrhythm for making music similar to the music possible with trackers like Buzz / Renoise / OpenMPT. I call this approach Hard Coding music. This is also known as executable music in the Demoscene.</p>
<p>You can also use Bitrhythm for Live Coding and Algorithmic composition.</p>
</div>
<div class="section" id="adc-2021">
<h2>ADC 2021<a class="headerlink" href="#adc-2021" title="Permalink to this headline">¶</a></h2>
<p>I presented Bitrhythm in ADC ‘21 and the ICLC ‘21 for other audio developers.</p>
<p><a class="reference external" href="https://xyzzyapps.link/ADC21.pdf">Slides ADC ‘21</a><br>
Video - TBD</p>
<p><a class="reference external" href="https://xyzzyapps.link/ICLC21.pdf">Slides ICLC ‘21</a><br>
<a class="reference external" href="https://www.youtube.com/watch?v=LDQ1PMqZowQ">Video</a> ~ 20 minute mark</p>
</div>
<div class="section" id="inspiration-for-the-project">
<h2>Inspiration for the project<a class="headerlink" href="#inspiration-for-the-project" title="Permalink to this headline">¶</a></h2>
<p>I make <a class="reference external" href="https://xyzzyapps.link">web apps</a> for a living. I started messing with algorithmic composition using pure data around 2011. In many ways Pure Data was my first DAW. Although nothing much came out of it musically, it transformed the way I view programming. The unix pipes concept is identical to the data flow model in pure data; albeit with more connections.</p>
<p>For my music I moved onto Electribe, Renoise, Reaper and live looping with my guitar. I started exploring sonic pi in 2019 but TBH none of the live coding tools were doing what I wanted - basically tweaking /knob-twisting in techno so I started my work on this project. <a class="reference external" href="https://www.youtube.com/watch?v=adz1Gv5Lm34">This library</a> in sonic pi comes close to what I am trying todo with this project. In bitrhythm time is divided into ticks like renoise tracker.</p>
<p>After my initial work on the project in 2019, the project got sidetracked. After seeing <a class="reference external" href="https://www.vitling.xyz/toys/acid-banger/">endless acid banger</a> I had an epiphany to work on this project again with programmatic knobs. I was able to compose an endless and interactive dubtechno demo track. In March 2021, I also picked up on literate programming so this document will have both code and documentation intertwined.</p>
<p>The documentation for the literate programming project - wheel is <a class="reference external" href="https://xyzzyapps.link/wheel/">available here</a>.</p>
</div>
<div class="section" id="license">
<h2>License<a class="headerlink" href="#license" title="Permalink to this headline">¶</a></h2>
<p><a class="reference external" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC-BY-NC-SA</a></p>
</div>
<div class="section" id="support-this-project">
<h2>Support this project<a class="headerlink" href="#support-this-project" title="Permalink to this headline">¶</a></h2>
<p>My goal is to make bitrhythm easy for both professionals and music learners. Support my work to get regular updates. Supporters will also get free accounts when I add pro features! Also get notified on latest developments and tutorials in the web audio world.</p>
<p><script src="https://gumroad.com/js/gumroad.js"></script><a class="gumroad-button" href="https://gumroad.com/l/iEVpN" target="_blank" rel="noopener"><span class="gumroad-button-logo"></span>Support Bitrhythm</a></p>
<p>You can find me on <a class="reference external" href="https://theaudioprogrammer.com/">theaudioprogrammer</a>, demoscene and algorave discord as @xyzzy.</p>
</div>
</div>
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="index.html" title="previous page">Welcome to Bitrhythm’s documentation!</a>
<a class='right-next' id="next-link" href="source-code.html" title="next page">Source Code and License</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
<p>
By Xyzzy Apps<br/>
© Copyright (c) Xyzzy Apps, 2021.<br/>
</p>
</div>
</footer>
</main>
</div>
</div>
<script src="_static/js/index.1c5a1a01449ed65a7b51.js"></script>
</body>
</html>