deploy: 5773d21b4a
This commit is contained in:
@ -6,18 +6,18 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
|
||||
<link href="../_app/immutable/assets/0.B2YDv0ji.css" rel="stylesheet">
|
||||
<link rel="modulepreload" href="../_app/immutable/entry/start.kvs3K6XX.js">
|
||||
<link href="../_app/immutable/assets/0.01-0QDLM.css" rel="stylesheet">
|
||||
<link rel="modulepreload" href="../_app/immutable/entry/start.uJOUbglV.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/chunks/scheduler.aZRR5A_O.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/entry/app.4UJeuSG9.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/entry/app.Z3LSLHhG.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/chunks/preload-helper.0HuHagjb.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/chunks/index.AIcdAWo0.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/nodes/0.uMzUYRGs.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/nodes/0.dbauwrdJ.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/nodes/9.FHypHKIr.js">
|
||||
<link rel="modulepreload" href="../_app/immutable/chunks/dynamic-import-helper.0gtGTknh.js">
|
||||
</head>
|
||||
<body data-sveltekit-preload-data="hover">
|
||||
<div style="display: contents"> <div><div class="bg-neutral-800 dark:bg-base-300"><nav class="pl-8 py-2 md:flex md:justify-between md:items-center pr-8"><div class="flex items-center justify-between"><a href="/" class="text-3xl font-extrabold text-transparent bg-clip-text bg-gradient-to-r from-orange-300 to-orange-200 uppercase" data-svelte-h="svelte-sv4vin">livecoding.fr</a> <div class="flex md:hidden" data-svelte-h="svelte-pz0dbb"><button type="button" class="text-gray-100 hover:text-gray-400 focus:outline-none focus:text-gray-400"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"></path></svg></button></div></div> <div class="flex-col mt-8 space-y-4 md:flex md:space-y-0 md:flex-row md:items-center md:space-x-10 md:mt-0 hidden"><a href="/evenements" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-1me9jmo">Évènements</a> <a href="/membres" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-1ho9i2z">Membres</a> <a href="/outils" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-1sj2l4z">Outils</a> <a href="/guides" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-yd78nx">Guides</a> <a href="/articles" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-zz9yjp">Articles</a> <a href="/reseaux" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-z9wl3r">Réseaux</a> <a href="/ressources" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-1u3kp53">Ressources</a> <a href="/presse" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-1yq8r9j">Presse</a> <a href="/contacts" class="text-gray-100 hover:text-orange-300 flex md:hidden" data-svelte-h="svelte-14fua0o">Contact</a></div></nav></div></div> <main class="bg-gray-100 dark:bg-base-100"><div class="drawer lg:drawer-open"><input id="my-drawer-2" type="checkbox" class="drawer-toggle"> <div class="drawer-content space-y-4 flex flex-col lg:px-16 px-4 py-8"><article><h1>Introduction au live coding sur SuperCollider (II)</h1> <div class="pt-4 flex justify-between mb-12"><p class="inline font-bold">Publié le : 2023-24-12</p> <p class="inline font-bold">Auteur : Raphaël Maurice Forment</p></div> <div class="lg:px-24 md:px-12 content-center"><article><h2 data-svelte-h="svelte-1ukekoe">Introduction</h2> <h3 data-svelte-h="svelte-tla2tn">Le labyrinthe <strong>SuperCollider</strong></h3> <div style="margin-bottom:100px" data-svelte-h="svelte-u3kyqm"><br> <div><a href="https://www.instagram.com/p/CtHWU0fuOKd/"><img style="min-width: 200px;width:30%;height:auto;float:inline-end;padding-right:20px;margin-left:20px" src="/images/supercollider_meme.png"></a></div> <p>Si vous avez lu et suivi le premier article, tout est en place et vous devriez
|
||||
<div style="display: contents"> <div><div class="bg-neutral-800 dark:bg-base-300"><nav class="pl-8 py-2 md:flex md:justify-between md:items-center pr-8"><div class="flex items-center justify-between"><a href="/" class="text-3xl font-extrabold text-transparent bg-clip-text bg-gradient-to-r from-orange-300 to-orange-200 uppercase" data-svelte-h="svelte-r63k53">livecoding.fr</a> <div class="flex md:hidden" data-svelte-h="svelte-glwq61"><button type="button" class="text-gray-100 hover:text-gray-400 focus:outline-none focus:text-gray-400"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"></path></svg></button></div></div> <div class="flex-col mt-8 space-y-4 md:flex md:space-y-0 md:flex-row md:items-center md:space-x-10 md:mt-0 hidden"><a href="/evenements" class="mobile-menu-link" data-svelte-h="svelte-11zf95a">Évènements</a> <a href="/membres" class="mobile-menu-link" data-svelte-h="svelte-1a3do61">Membres</a> <a href="/outils" class="mobile-menu-link" data-svelte-h="svelte-ee0p45">Outils</a> <a href="/guides" class="mobile-menu-link" data-svelte-h="svelte-5misk3">Guides</a> <a href="/articles" class="mobile-menu-link" data-svelte-h="svelte-kglg6r">Articles</a> <a href="/reseaux" class="mobile-menu-link" data-svelte-h="svelte-6wk0bt">Réseaux</a> <a href="/ressources" class="mobile-menu-link" data-svelte-h="svelte-ziwryh">Ressources</a> <a href="/presse" class="mobile-menu-link" data-svelte-h="svelte-6fl78t">Presse</a> <a href="/contacts" class="mobile-menu-link" data-svelte-h="svelte-1skvj1i">Contact</a></div></nav></div></div> <main class="bg-gray-100 dark:bg-base-100"><div class="drawer lg:drawer-open"><input id="my-drawer-2" type="checkbox" class="drawer-toggle"> <div class="drawer-content space-y-4 flex flex-col lg:px-16 px-4 py-8"><article><h1>Introduction au live coding sur SuperCollider (II)</h1> <div class="pt-4 flex justify-between mb-12"><p class="inline font-bold">Publié le : 2023-24-12</p> <p class="inline font-bold">Auteur : Raphaël Maurice Forment</p></div> <div class="lg:px-24 md:px-12 content-center"><article><h2 data-svelte-h="svelte-1ukekoe">Introduction</h2> <h3 data-svelte-h="svelte-tla2tn">Le labyrinthe <strong>SuperCollider</strong></h3> <div style="margin-bottom:100px" data-svelte-h="svelte-u3kyqm"><br> <div><a href="https://www.instagram.com/p/CtHWU0fuOKd/"><img style="min-width: 200px;width:30%;height:auto;float:inline-end;padding-right:20px;margin-left:20px" src="/images/supercollider_meme.png"></a></div> <p>Si vous avez lu et suivi le premier article, tout est en place et vous devriez
|
||||
maintenant être prêt à jouer. L’une des qualités mais aussi l’un des défauts de <strong>SuperCollider</strong> est de ne
|
||||
pas vous astreindre à suivre une route particulière concernant la manière dont il vous faut approcher la création sonore lorsque vous débutez. Le logiciel est extrêmement générique et chaque
|
||||
utilisateur développe progressivement ses propres abstractions et une logique qui lui est propre. Il existe plusieurs dizaines de mécanismes
|
||||
@ -74,11 +74,11 @@ aussi être une stratégie intéressante dans certains cas.</p> <h2 data-svelte-
|
||||
<span class="token operator">~</span>source<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span>req<span class="token punctuation">,</span> <span class="token number">300</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// On peut utiliser set pour une valeur statique</span>
|
||||
<span class="token operator">~</span>freq <span class="token operator">=</span> <span class="token punctuation">{</span> SinOsc<span class="token punctuation">.</span><span class="token function">ar</span><span class="token punctuation">(</span><span class="token number">1</span><span class="token operator">/</span><span class="token number">2</span><span class="token punctuation">)</span> <span class="token operator">*</span> <span class="token number">400</span> <span class="token punctuation">}</span><span class="token punctuation">;</span> <span class="token comment">// Voici un LFO (Low Frequency Oscillator)</span>
|
||||
<span class="token operator">~</span>source<span class="token punctuation">.</span><span class="token function">map</span><span class="token punctuation">(</span>\freq<span class="token punctuation">,</span> <span class="token operator">~</span>freq<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// Utilisation de la fonction map</span></code><!-- HTML_TAG_END --></pre> <p data-svelte-h="svelte-548767"><code>.map</code> possède une fonction alternative, nommée <code>.xmap</code>. Elle fonctionne tout
|
||||
comme <code>.set</code> et <code>.xset</code>.</p> <h2 data-svelte-h="svelte-grw4hp">Conclusion</h2> <p data-svelte-h="svelte-v1qoh8">Dans cette section du guide, nous avons appris :</p> <ul data-svelte-h="svelte-ax6drr"><li>Ce qu’est un <code>NodeProxy</code> et un <code>ProxySpace</code>, l’outil de base offert par <strong>JITLib</strong></li> <li>La différence entre <code>ProxySpace.push</code> et l’utilisation explicite des <code>NDefs</code></li> <li>Comment démarrer, stopper et arrêter un <code>NodeProxy</code></li> <li>Comment contrôler le <em>fade-in</em> et le <em>fade-out</em> et la transition entre algorithmes</li></ul> <p data-svelte-h="svelte-j92gtb">Je ne fais ici qu’effleurer les différentes commandes que possèdent les <code>NodeProxy</code>. Si vous souhaitez en apprendre plus, allez voir la documentation. Nous utiliserons un nombre limité de méthodes au fur et à mesure, lorsque nous en aurons besoin.</p></article></div></article></div> <div class="drawer-side" data-svelte-h="svelte-1yk067b"><label for="my-drawer-2" aria-label="close sidebar" class="drawer-overlay scrollbar-hide whitespace-nowrap overflow-hidden"></label> <ul class="menu p-4 w-40 min-h-full bg-neutral-800 dark:bg-base-300 text-base-content overflow-hidden"><li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/evenements">Évènements</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/membres">Membres</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/outils">Outils</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/guides">Guides</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/articles">Articles</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/reseaux">Réseaux</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/ressources">Ressources</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/presse">Presse</a></li> <li class="text-xl ml-0"><a class="text-white hover:text-orange-300" href="/contacts">Contact</a></li></ul></div></div></main> <footer class="footer ml-0 pl-0 pb-4 pt-4 bg-neutral-800 dark:bg-base-300 justify-between pr-16" data-svelte-h="svelte-1yg0fuy"><div class="flex justify-between"><p class="inline indent-4 text-bold text-white">Raphaël Forment</p> <p><a class="inline pl-4" href="https://github.com/Bubobubobubobubo/livecodingfr">GitHub</a></p></div></footer>
|
||||
comme <code>.set</code> et <code>.xset</code>.</p> <h2 data-svelte-h="svelte-grw4hp">Conclusion</h2> <p data-svelte-h="svelte-v1qoh8">Dans cette section du guide, nous avons appris :</p> <ul data-svelte-h="svelte-ax6drr"><li>Ce qu’est un <code>NodeProxy</code> et un <code>ProxySpace</code>, l’outil de base offert par <strong>JITLib</strong></li> <li>La différence entre <code>ProxySpace.push</code> et l’utilisation explicite des <code>NDefs</code></li> <li>Comment démarrer, stopper et arrêter un <code>NodeProxy</code></li> <li>Comment contrôler le <em>fade-in</em> et le <em>fade-out</em> et la transition entre algorithmes</li></ul> <p data-svelte-h="svelte-j92gtb">Je ne fais ici qu’effleurer les différentes commandes que possèdent les <code>NodeProxy</code>. Si vous souhaitez en apprendre plus, allez voir la documentation. Nous utiliserons un nombre limité de méthodes au fur et à mesure, lorsque nous en aurons besoin.</p></article></div></article></div> <div class="drawer-side" data-svelte-h="svelte-17zhvxi"><label for="my-drawer-2" aria-label="close sidebar" class="drawer-overlay scrollbar-hide whitespace-nowrap overflow-hidden"></label> <ul class="menu sidemenu-style"><li class="sideli"><a class="sidebar-link" href="/evenements">Évènements</a></li> <li class="sideli"><a class="sidebar-link" href="/membres">Membres</a></li> <li class="sideli"><a class="sidebar-link" href="/outils">Outils</a></li> <li class="sideli"><a class="sidebar-link" href="/guides">Guides</a></li> <li class="sideli"><a class="sidebar-link" href="/articles">Articles</a></li> <li class="sideli"><a class="sidebar-link" href="/reseaux">Réseaux</a></li> <li class="sideli"><a class="sidebar-link" href="/ressources">Ressources</a></li> <li class="sideli"><a class="sidebar-link" href="/presse">Presse</a></li> <li class="sideli"><a class="sidebar-link" href="/contacts">Contact</a></li></ul></div></div></main> <footer class="footer-style" data-svelte-h="svelte-1gkeg8z"><div class="flex justify-between"><p class="inline indent-4 text-bold text-white">Raphaël Forment</p> <p><a class="inline pl-4" href="https://github.com/Bubobubobubobubo/livecodingfr">GitHub</a></p></div></footer>
|
||||
|
||||
<script>
|
||||
{
|
||||
__sveltekit_1haer6i = {
|
||||
__sveltekit_1nruam4 = {
|
||||
base: new URL("..", location).pathname.slice(0, -1),
|
||||
env: null
|
||||
};
|
||||
@ -88,8 +88,8 @@ comme <code>.set</code> et <code>.xset</code>.</p> <h2 data-svelte-h="svelte-grw
|
||||
const data = [{"type":"data","data":null,"uses":{}},null];
|
||||
|
||||
Promise.all([
|
||||
import("../_app/immutable/entry/start.kvs3K6XX.js"),
|
||||
import("../_app/immutable/entry/app.4UJeuSG9.js")
|
||||
import("../_app/immutable/entry/start.uJOUbglV.js"),
|
||||
import("../_app/immutable/entry/app.Z3LSLHhG.js")
|
||||
]).then(([kit, app]) => {
|
||||
kit.start(app, element, {
|
||||
node_ids: [0, 9],
|
||||
|
||||
Reference in New Issue
Block a user