Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Missing logic, but all others are complete. Added Timeliner note to 7…

…. Animation
  • Loading branch information...
commit 2ed3c069811e210230de22cad96b0d4a147a0be1 1 parent c8553fb
Elliot Woods authored
40 11 - Shaders.html
View
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-16"?>
+<html>
+<head>
+<title>Annotations</title>
+<script>
+ document.createElement('node');
+ document.createElement('pin');
+ document.createElement('key');
+ document.createElement('concept');
+
+ document.createElement('lmb');
+ document.createElement('rmb');
+ document.createElement('mmb');
+ document.createElement('scroll');
+
+ document.createElement('click');
+ document.createElement('click2');
+ document.createElement('hold');
+ document.createElement('release');
+ </script>
+<link rel="stylesheet" type="text/css" href="html_resources/style.css" />
+</head>
+<body>
+<img src="C:\kimchiandchips\Workshops\VVVV.Tutorials.Fundamentals\11 - Shaders.png" />
+<h2>0 - What is a shader?</h2>
+<p> A <concept>Shader</concept> is an advanced piece of graphics programming which runs on the graphics card. It lets a developer specify in detail how an object should be rendererd to the screen. </p><p> In VVVV, shaders are commonly called <concept>Effects</concept>, and are represented by a file with extension <b>.fx</b>. </p><p> The idea of modern shaders was created (afaik) by <b>Pixar</b> as part of their <b>RenderMan</b> rendering package in the late 1980's. Their shaders ran on the CPU and took a long time to calculate for a scene. With the introduction of new graphics cards (Around the time the GeForce FX was released), it became possible to write programs that ran directly on the <concept>GPU</concept> (Graphics Processing Unit). </p><p> The GPU is capable of calculating lots of small programs in parallel (sometimes hundreds of programs simultanaously). These programs are called shaders and be used to: <ul> <li><concept>Geometry shader</concept> - Generate geometry</li> <li><concept>Tesselation shader</concept> - Increase an object's detail</li> <li><concept>Vertex shader</concept> - Manipulate vertices</li> <li><concept>Pixel shader</concept> or <concept>Fragment shader</concept> - Control pixel by pixel rendering</li> </ul> </p>
+<h2>1 - Basic shader usage</h2>
+<p> In VVVV, you apply a <concept>Effect</concept> to a <concept>Mesh</concept>. The shader may accept 1 or more <concept>Texture</concept>s, and will always accept at least 1 <concept>Transform</concept> (this is the <concept>World transform</concept> which is accepted on the generically named <pin>Transform</pin> pin). </p><p> The most basic shader packaged with VVVV is called <node>Constant (EX9.Effect)</node>. Create one of these now and attach it to a <node>Renderer</node>. </p><p> The <node>Renderer</node> will remain black, as there is no <concept>Mesh</concept> attached to the shader. There are a number of common meshes built into VVVV: <ul> <li>Box</li> <li>Sphere</li> <li>Grid</li> <li>Teapot</li> <li>Cylinder</li> <li>Torus</li> </ul> You can list the availble meshes by searching for <b>EX9.Geometry</b> in the <node>NodeBrowser</node>. </p><p> Let's attach a <node>Cylinder (EX9.Geometry)</node> to the <pin>Mesh</pin> of the <node>Constant</node> shader node. </p><p> Because we are looking side on, we see a square. Let's add a <node>Camera</node>, and <node>Group</node> in an <node>AxisAndGrid (DX9)</node> to get some context. </p><p> Turn on the Antialiasing and Depth Bufffer quality options. </p><p> We should see a very 'flat' looking cylinder within the scene.</p>
+<h2>2 - Other shaders</h2>
+<p> There's lots of great shaders to make smooth results. Some examples of these are: <ul> <li>GourandDirectional</li> <li>GourandPoint</li> <li>PhongDirectional</li> <li>PhongPoint</li> </ul> </p><p> And there are many online in the <concept>Contributions</concept> area of the VVVV website. </p><p> Let's have a look at some now. </p><p> Copy the patch you just made with the earth cylinder and delete the texture transform (<node>LFO</node> and <node>Translate</node>). </p><p> Double click <img src="html_resources/click2.png"/><img src="html_resources/lmb.png"/> on the <node>Constant</node> node to bring up the <node>NodeBrowser</node>. Select <node>PhongPoint</node>. You will notice that this node has many more input pins, to allow you to change many properties regarding how the shader is drawn. </p><p> Use the same method to switch the <node>Cylinder</node> mesh with a <node>Sphere (EX9.Geometry)</node>. </p><p> Create a <node>Translate (Transform Vector)</node> and attach it to the <pin>Transform</pin> of the shader. </node> Attach a <node>RandomSpread</node> to the <pin>XYZ</pin> input of the <node>Translate</node>, and set the <pin>SpreadCount</pin> to <b>30</b> to create 10 3D vectors, i.e. 10 spheres. Set the <pin>Width</pin> of the <node>RandomSpread</node> to <b>5</b>. </p><p> Now let's animate using a <node>DeNiro</node> and <node>LFO</node> like we did before. </p><p> </p>
+<h2>2 - Texture transforms</h2>
+<p> Let's add a texture to the <node>Cylinder</node> using <node>FileTexture</node>. Select the <b>Earth 512x512.jpg</b> image from within the vvvv/girlpower/images folder. </p><p> Now add a <node>Translate (Transform)</node> and connect it to the <pin>Texture Transform</pin> input pin on the <node>Constant</node> shader. This allows you to move the position of the texture on the object. Try rolling the <pin>X</pin> input value on <node>Translate</node>. </p><p> Let's add an <node>LFO</node> and connect the <pin>Output</pin> to the <pin>X</pin> pin of the <node>Translate</node>.</p>
+<h2>3 - Lighting</h2>
+<p> Notice that one of the input pins of the <node>PhongPoint</node> is called <pin>Light Position XYZ</pin>. This pin accepts a 3D position for the light. </p><p> Create a <b>3D Vector</b> <node>IOBox</node> and connect it to this input pin. Now the light should be at the origin (<b>0,0,0</b>). </p><p> This kind of light source is a point light source (i.e. a light at a particular 3D position within the scene). If you want the objects to react to a directional light source, then use <node>PhongDirectional</node> or <node>GourandDirectional</node> instead of the point versions.</p>
+<h2>4 - HLSL</h2>
+<p> Shaders are written in a language called <concept>HLSL</concept>. To see this code, <img src="html_resources/click.png"/><img src="html_resources/rmb.png"/> on the <node>PhongPoint</node>. This brings up the <concept>Code Editor</concept>. </p><p> As you get more advanced with VVVV, you can try editing these shaders yourself. </p><p> If you want to learn more about shaders, I suggest looking at http://http.developer.nvidia.com/CgTutorial/cg_tutorial_chapter01.html (I've got that book and that's how I learnt!).</p>
+<h2>5 - GPU calculations</h2>
+<p> GPU's have become much more powerful than CPU's (50-100x more powerful), and can therefore perform much more calculations than a CPU can within the time of 1 frame (1/60th of a second). </p><p> Many developers are therefore exploiting GPU's to perform calculations. One example of this is the <b>GPU Particles</b> library in the contributions section of the website, which allows you to manipulate and render 1000's of particles at the same time by harnessing the power of the GPU.</p>
+</body>
+</html>
BIN  11 - Shaders.png
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
549 11 - Shaders.v4p
View
@@ -0,0 +1,549 @@
+<!DOCTYPE PATCH SYSTEM "http://vvvv.org/versions/vvvv45beta26.dtd" >
+ <PATCH nodename="C:\kimchiandchips\Workshops\VVVV.Tutorials.Fundamentals\11 - Shaders.v4p" filename="C:\kimchiandchips\Workshops\VVVV.Tutorials.Fundamentals\9. DirectX 2.v4p" locked="0" systemname="9. DirectX 2">
+ <BOUNDS height="13725" left="5310" top="600" type="Window" width="16800">
+ </BOUNDS>
+ <NODE componentmode="InABox" id="0" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="225" top="150" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="1095" left="225" top="150" type="Box" width="7665">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|11. Shaders|">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="42">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="2" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="105" top="12405" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="750" left="105" top="12405" type="Box" width="5325">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|Created by Elliot Woods.&cr;&lf;Distributed under the MIT license (check file LICENSE) for details.&cr;&lf;Generally you can do whatever you want with these files. have fun!|">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="5" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="5805" top="2640" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="540" left="5805" top="2640" type="Box" width="2085">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" visible="1">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="12">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="Author">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="6" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="225" top="1260" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="1155" left="225" top="1260" type="Box" width="7665">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" visible="1">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="12">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="Description">
+ </PIN>
+ </NODE>
+ <INFO author="Elliot Woods" description="Introduction to shaders, how to hook them up and whats inside them." tags="Shaders, Mesh">
+ </INFO>
+ <NODE componentmode="Hidden" filename="Subpatches\GetMetadata (VVVV).v4p" hiddenwhenlocked="1" id="10" nodename="GetMetadata (VVVV)" systemname="GetMetadata (VVVV)">
+ <BOUNDS height="100" left="5820" top="1800" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Patch" visible="1">
+ </PIN>
+ <BOUNDS height="3465" left="14520" top="5520" type="Window" width="4680">
+ </BOUNDS>
+ <PIN pinname="Author" visible="1">
+ </PIN>
+ <PIN pinname="Description" visible="1">
+ </PIN>
+ <PIN pinname="Tags" visible="1">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" hiddenwhenlocked="1" id="8" nodename="PatchAlias (VVVV)" systemname="PatchAlias (VVVV)">
+ <BOUNDS height="100" left="5820" top="1350" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Patch" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="10" dstpinname="Patch" hiddenwhenlocked="1" srcnodeid="8" srcpinname="Patch">
+ </LINK>
+ <LINK dstnodeid="6" dstpinname="Input String" hiddenwhenlocked="1" linkstyle="VHV" srcnodeid="10" srcpinname="Description">
+ <LINKPOINT x="6445" y="2205">
+ </LINKPOINT>
+ <LINKPOINT x="245" y="2355">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="InABox" id="11" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="225" top="2640" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="540" left="225" top="2640" type="Box" width="5520">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" visible="1">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="Tags">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="11" dstpinname="Input String" hiddenwhenlocked="1" linkstyle="VHV" srcnodeid="10" srcpinname="Tags">
+ <LINKPOINT x="7015" y="2293">
+ </LINKPOINT>
+ <LINKPOINT x="275" y="2448">
+ </LINKPOINT>
+ </LINK>
+ <LINK dstnodeid="5" dstpinname="Input String" hiddenwhenlocked="1" srcnodeid="10" srcpinname="Author">
+ </LINK>
+ <NODE componentmode="InABox" id="103" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="8145" top="3465" type="Node" width="330">
+ </BOUNDS>
+ <BOUNDS height="7515" left="8145" top="3465" type="Box" width="345">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="||">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="12" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[0 - What is a shader?]&cr;&lf;&cr;&lf;A &lt;concept&gt;Shader&lt;/concept&gt; is an advanced piece of graphics programming which runs on the graphics card. It lets a developer specify in detail how an object should be rendererd to the screen. &cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;In VVVV, shaders are commonly called &lt;concept&gt;Effects&lt;/concept&gt;, and are represented by a file with extension &lt;b&gt;.fx&lt;/b&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;The idea of modern shaders was created (afaik) by &lt;b&gt;Pixar&lt;/b&gt; as part of their &lt;b&gt;RenderMan&lt;/b&gt; rendering package in the late 1980&apos;s. Their shaders ran on the CPU and took a long time to calculate for a scene. With the introduction of new graphics cards (Around the time the GeForce FX was released), it became possible to write programs that ran directly on the &lt;concept&gt;GPU&lt;/concept&gt; (Graphics Processing Unit).&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;The GPU is capable of calculating lots of small programs in parallel (sometimes hundreds of programs simultanaously). These programs are called shaders and be used to:&cr;&lf;&lt;ul&gt;&cr;&lf;&lt;li&gt;&lt;concept&gt;Geometry shader&lt;/concept&gt; - Generate geometry&lt;/li&gt;&cr;&lf;&lt;li&gt;&lt;concept&gt;Tesselation shader&lt;/concept&gt; - Increase an object&apos;s detail&lt;/li&gt;&cr;&lf;&lt;li&gt;&lt;concept&gt;Vertex shader&lt;/concept&gt; - Manipulate vertices&lt;/li&gt;&cr;&lf;&lt;li&gt;&lt;concept&gt;Pixel shader&lt;/concept&gt; or &lt;concept&gt;Fragment shader&lt;/concept&gt; - Control pixel by pixel rendering&lt;/li&gt;&cr;&lf;&lt;/ul&gt;&cr;&lf;|">
+ </PIN>
+ <BOUNDS height="270" left="2760" top="3765" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="375" left="2760" top="3765" type="Box" width="2460">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="230" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[1 - Basic shader usage]&cr;&lf;&cr;&lf;In VVVV, you apply a &lt;concept&gt;Effect&lt;/concept&gt; to a &lt;concept&gt;Mesh&lt;/concept&gt;. The shader may accept 1 or more &lt;concept&gt;Texture&lt;/concept&gt;s, and will always accept at least 1 &lt;concept&gt;Transform&lt;/concept&gt; (this is the &lt;concept&gt;World transform&lt;/concept&gt; which is accepted on the generically named &lt;pin&gt;Transform&lt;/pin&gt; pin).&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;The most basic shader packaged with VVVV is called &lt;node&gt;Constant (EX9.Effect)&lt;/node&gt;. Create one of these now and attach it to a &lt;node&gt;Renderer&lt;/node&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;The &lt;node&gt;Renderer&lt;/node&gt; will remain black, as there is no &lt;concept&gt;Mesh&lt;/concept&gt; attached to the shader. There are a number of common meshes built into VVVV:&cr;&lf;&lt;ul&gt;&cr;&lf;&lt;li&gt;Box&lt;/li&gt;&cr;&lf;&lt;li&gt;Sphere&lt;/li&gt;&cr;&lf;&lt;li&gt;Grid&lt;/li&gt;&cr;&lf;&lt;li&gt;Teapot&lt;/li&gt;&cr;&lf;&lt;li&gt;Cylinder&lt;/li&gt;&cr;&lf;&lt;li&gt;Torus&lt;/li&gt;&cr;&lf;&lt;/ul&gt;&cr;&lf;&cr;&lf;You can list the availble meshes by searching for &lt;b&gt;EX9.Geometry&lt;/b&gt; in the &lt;node&gt;NodeBrowser&lt;/node&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Let&apos;s attach a &lt;node&gt;Cylinder (EX9.Geometry)&lt;/node&gt; to the &lt;pin&gt;Mesh&lt;/pin&gt; of the &lt;node&gt;Constant&lt;/node&gt; shader node.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Because we are looking side on, we see a square. Let&apos;s add a &lt;node&gt;Camera&lt;/node&gt;, and &lt;node&gt;Group&lt;/node&gt; in an &lt;node&gt;AxisAndGrid (DX9)&lt;/node&gt; to get some context.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Turn on the Antialiasing and Depth Bufffer quality options.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;We should see a very &apos;flat&apos; looking cylinder within the scene.|">
+ </PIN>
+ <BOUNDS height="270" left="2655" top="4350" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="330" left="2655" top="4350" type="Box" width="2715">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" filename="%VVVV%\effects\Constant.fx" id="231" nodename="Constant (EX9.Effect)" systemname="Constant (EX9.Effect)">
+ <BOUNDS height="100" left="2055" top="6075" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ <PIN pinname="Mesh" visible="1">
+ </PIN>
+ <PIN pinname="Texture" visible="1">
+ </PIN>
+ <PIN pinname="Texture Transform" visible="1">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="232" nodename="Renderer (EX9)" systemname="Renderer (EX9)">
+ <BOUNDS height="100" left="585" top="6915" type="Node" width="100">
+ </BOUNDS>
+ <BOUNDS height="5070" left="585" top="6915" type="Box" width="6900">
+ </BOUNDS>
+ <BOUNDS height="5010" left="8145" top="7245" type="Window" width="6240">
+ </BOUNDS>
+ <PIN pinname="Layers" visible="1">
+ </PIN>
+ <PIN pinname="View" visible="1">
+ </PIN>
+ <PIN pinname="Projection" visible="1">
+ </PIN>
+ <PIN pinname="Fullscreen Antialiasing Quality Level" slicecount="1" values="3">
+ </PIN>
+ <PIN pinname="Windowed Antialiasing Quality Level" slicecount="1" values="3">
+ </PIN>
+ <PIN pinname="Windowed Depthbuffer Format" slicecount="1" values="D16">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="234" nodename="Cylinder (EX9.Geometry)" systemname="Cylinder (EX9.Geometry)">
+ <BOUNDS height="100" left="2235" top="5280" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Mesh" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="231" dstpinname="Mesh" srcnodeid="234" srcpinname="Mesh">
+ </LINK>
+ <NODE componentmode="Hidden" filename="%VVVV%\modules\vvvv group\Transform\Camera (Transform Softimage).v4p" id="235" nodename="Camera (Transform Softimage)" systemname="Camera (Transform Softimage)">
+ <BOUNDS height="100" left="5775" top="6420" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="View" visible="1">
+ </PIN>
+ <PIN pinname="Projection" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="232" dstpinname="View" srcnodeid="235" srcpinname="View">
+ </LINK>
+ <LINK dstnodeid="232" dstpinname="Projection" srcnodeid="235" srcpinname="Projection">
+ </LINK>
+ <NODE componentmode="Hidden" id="236" nodename="Group (EX9)" systemname="Group (EX9)">
+ <BOUNDS height="270" left="585" top="6495" type="Node" width="2970">
+ </BOUNDS>
+ <PIN pinname="Layer 1" visible="1">
+ </PIN>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ <PIN pinname="Layer 2" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="232" dstpinname="Layers" srcnodeid="236" srcpinname="Layer">
+ </LINK>
+ <LINK dstnodeid="236" dstpinname="Layer 2" srcnodeid="231" srcpinname="Layer">
+ </LINK>
+ <NODE componentmode="Hidden" filename="%VVVV%\modules\vvvv group\EX9\AxisAndGrid (DX9).v4p" id="237" nodename="AxisAndGrid (DX9)" systemname="AxisAndGrid (DX9)">
+ <BOUNDS height="100" left="570" top="6075" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="236" dstpinname="Layer 1" srcnodeid="237" srcpinname="Layer">
+ </LINK>
+ <NODE componentmode="InABox" id="238" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[2 - Other shaders]&cr;&lf;There&apos;s lots of great shaders to make smooth results. Some examples of these are:&cr;&lf;&lt;ul&gt;&cr;&lf;&lt;li&gt;GourandDirectional&lt;/li&gt;&cr;&lf;&lt;li&gt;GourandPoint&lt;/li&gt;&cr;&lf;&lt;li&gt;PhongDirectional&lt;/li&gt;&cr;&lf;&lt;li&gt;PhongPoint&lt;/li&gt;&cr;&lf;&lt;/ul&gt;&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;And there are many online in the &lt;concept&gt;Contributions&lt;/concept&gt; area of the VVVV website.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Let&apos;s have a look at some now.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Copy the patch you just made with the earth cylinder and delete the texture transform (&lt;node&gt;LFO&lt;/node&gt; and &lt;node&gt;Translate&lt;/node&gt;).&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Double click &lt;click2/&gt;&lt;lmb/&gt; on the &lt;node&gt;Constant&lt;/node&gt; node to bring up the &lt;node&gt;NodeBrowser&lt;/node&gt;. Select &lt;node&gt;PhongPoint&lt;/node&gt;. You will notice that this node has many more input pins, to allow you to change many properties regarding how the shader is drawn.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Use the same method to switch the &lt;node&gt;Cylinder&lt;/node&gt; mesh with a &lt;node&gt;Sphere (EX9.Geometry)&lt;/node&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Create a &lt;node&gt;Translate (Transform Vector)&lt;/node&gt; and attach it to the &lt;pin&gt;Transform&lt;/pin&gt; of the shader.&cr;&lf;&lt;/node&gt;&cr;&lf;&cr;&lf;Attach a &lt;node&gt;RandomSpread&lt;/node&gt; to the &lt;pin&gt;XYZ&lt;/pin&gt; input of the &lt;node&gt;Translate&lt;/node&gt;, and set the &lt;pin&gt;SpreadCount&lt;/pin&gt; to &lt;b&gt;30&lt;/b&gt; to create 10 3D vectors, i.e. 10 spheres. Set the &lt;pin&gt;Width&lt;/pin&gt; of the &lt;node&gt;RandomSpread&lt;/node&gt; to &lt;b&gt;5&lt;/b&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Now let&apos;s animate using a &lt;node&gt;DeNiro&lt;/node&gt; and &lt;node&gt;LFO&lt;/node&gt; like we did before.&cr;&lf;&lt;br /&gt;&cr;&lf;|">
+ </PIN>
+ <BOUNDS height="270" left="10710" top="660" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="330" left="10710" top="660" type="Box" width="2085">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="239" nodename="FileTexture (EX9.Texture)" systemname="FileTexture (EX9.Texture)">
+ <BOUNDS height="100" left="3570" top="5265" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Texture Out" visible="1">
+ </PIN>
+ <PIN encoded="0" pinname="Filename" slicecount="1" values="..\..\..\vvvv\vvvv_45beta26\girlpower\images\earth_512x512.jpg">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="231" dstpinname="Texture" linkstyle="VHV" srcnodeid="239" srcpinname="Texture Out">
+ <LINKPOINT x="3655" y="5728">
+ </LINKPOINT>
+ <LINKPOINT x="2825" y="5853">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="InABox" id="240" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[2 - Texture transforms]&cr;&lf;&cr;&lf;Let&apos;s add a texture to the &lt;node&gt;Cylinder&lt;/node&gt; using &lt;node&gt;FileTexture&lt;/node&gt;. Select the &lt;b&gt;Earth 512x512.jpg&lt;/b&gt; image from within the vvvv/girlpower/images folder.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Now add a &lt;node&gt;Translate (Transform)&lt;/node&gt; and connect it to the &lt;pin&gt;Texture Transform&lt;/pin&gt; input pin on the &lt;node&gt;Constant&lt;/node&gt; shader. This allows you to move the position of the texture on the object. Try rolling the &lt;pin&gt;X&lt;/pin&gt; input value on &lt;node&gt;Translate&lt;/node&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Let&apos;s add an &lt;node&gt;LFO&lt;/node&gt; and connect the &lt;pin&gt;Output&lt;/pin&gt; to the &lt;pin&gt;X&lt;/pin&gt; pin of the &lt;node&gt;Translate&lt;/node&gt;.|">
+ </PIN>
+ <BOUNDS height="270" left="4830" top="5595" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="330" left="4830" top="5595" type="Box" width="2715">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="241" nodename="Translate (Transform)" systemname="Translate (Transform)">
+ <BOUNDS height="100" left="4635" top="5265" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="X" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="231" dstpinname="Texture Transform" linkstyle="VHV" srcnodeid="241" srcpinname="Transform Out">
+ <LINKPOINT x="4665" y="5940">
+ </LINKPOINT>
+ <LINKPOINT x="3045" y="5940">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="Hidden" id="242" nodename="LFO (Animation)" systemname="LFO (Animation)">
+ <BOUNDS height="100" left="4890" top="4830" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Period" slicecount="1" values="5">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="241" dstpinname="X" srcnodeid="242" srcpinname="Output">
+ </LINK>
+ <NODE componentmode="InABox" id="251" nodename="Renderer (EX9)" systemname="Renderer (EX9)">
+ <BOUNDS height="100" left="9015" top="4290" type="Node" width="100">
+ </BOUNDS>
+ <BOUNDS height="5070" left="9015" top="4290" type="Box" width="6900">
+ </BOUNDS>
+ <BOUNDS height="5010" left="8145" top="7245" type="Window" width="6240">
+ </BOUNDS>
+ <PIN pinname="Layers" visible="1">
+ </PIN>
+ <PIN pinname="View" visible="1">
+ </PIN>
+ <PIN pinname="Projection" visible="1">
+ </PIN>
+ <PIN pinname="Fullscreen Antialiasing Quality Level" slicecount="1" values="3">
+ </PIN>
+ <PIN pinname="Windowed Antialiasing Quality Level" slicecount="1" values="3">
+ </PIN>
+ <PIN pinname="Windowed Depthbuffer Format" slicecount="1" values="D16">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" filename="%VVVV%\modules\vvvv group\Transform\Camera (Transform Softimage).v4p" id="249" nodename="Camera (Transform Softimage)" systemname="Camera (Transform Softimage)">
+ <BOUNDS height="100" left="14205" top="3795" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="View" visible="1">
+ </PIN>
+ <PIN pinname="Projection" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="251" dstpinname="View" srcnodeid="249" srcpinname="View">
+ </LINK>
+ <LINK dstnodeid="251" dstpinname="Projection" srcnodeid="249" srcpinname="Projection">
+ </LINK>
+ <NODE componentmode="Hidden" id="248" nodename="Group (EX9)" systemname="Group (EX9)">
+ <BOUNDS height="270" left="9015" top="3870" type="Node" width="2970">
+ </BOUNDS>
+ <PIN pinname="Layer 1" visible="1">
+ </PIN>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ <PIN pinname="Layer 2" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="251" dstpinname="Layers" srcnodeid="248" srcpinname="Layer">
+ </LINK>
+ <NODE componentmode="Hidden" filename="%VVVV%\modules\vvvv group\EX9\AxisAndGrid (DX9).v4p" id="247" nodename="AxisAndGrid (DX9)" systemname="AxisAndGrid (DX9)">
+ <BOUNDS height="100" left="9000" top="3450" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="248" dstpinname="Layer 1" srcnodeid="247" srcpinname="Layer">
+ </LINK>
+ <NODE componentmode="Hidden" id="246" nodename="FileTexture (EX9.Texture)" systemname="FileTexture (EX9.Texture)">
+ <BOUNDS height="100" left="13680" top="2925" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Texture Out" visible="1">
+ </PIN>
+ <PIN encoded="0" pinname="Filename" slicecount="1" values="..\..\..\vvvv\vvvv_45beta26\girlpower\images\earth_512x512.jpg">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" filename="%VVVV%\effects\PhongPoint.fx" id="252" nodename="PhongPoint (EX9.Effect)" systemname="PhongPoint (EX9.Effect)">
+ <BOUNDS height="270" left="10485" top="3450" type="Node" width="4860">
+ </BOUNDS>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ <PIN pinname="Mesh" visible="1">
+ </PIN>
+ <PIN pinname="Texture" visible="1">
+ </PIN>
+ <PIN pinname="Texture Transform" slicecount="1" visible="1" values="||">
+ </PIN>
+ <PIN pinname="Transform" visible="1">
+ </PIN>
+ <PIN pinname="Light Position XYZ" slicecount="1" visible="1" values="0,0,0">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="248" dstpinname="Layer 2" srcnodeid="252" srcpinname="Layer">
+ </LINK>
+ <LINK dstnodeid="252" dstpinname="Texture" linkstyle="VHV" srcnodeid="246" srcpinname="Texture Out">
+ <LINKPOINT x="13205" y="3293">
+ </LINKPOINT>
+ <LINKPOINT x="11815" y="3323">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="Hidden" id="250" nodename="Sphere (EX9.Geometry)" systemname="Sphere (EX9.Geometry)">
+ <BOUNDS height="100" left="10755" top="2955" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Mesh" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="252" dstpinname="Mesh" srcnodeid="250" srcpinname="Mesh">
+ </LINK>
+ <NODE componentmode="Hidden" id="253" nodename="Translate (Transform Vector)" systemname="Translate (Transform Vector)">
+ <BOUNDS height="100" left="11010" top="2520" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="XYZ" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="252" dstpinname="Transform" srcnodeid="253" srcpinname="Transform Out">
+ </LINK>
+ <NODE componentmode="Hidden" id="254" nodename="RandomSpread (Spreads)" systemname="RandomSpread (Spreads)">
+ <BOUNDS height="100" left="11745" top="1680" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Spread Count" slicecount="1" values="30">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Width" slicecount="1" values="5">
+ </PIN>
+ <PIN pinname="Random Seed" visible="1">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="255" nodename="DeNiro (Animation)" systemname="DeNiro (Animation)">
+ <BOUNDS height="100" left="11745" top="2070" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Go To Position" visible="1">
+ </PIN>
+ <PIN pinname="Position Out" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="255" dstpinname="Go To Position" srcnodeid="254" srcpinname="Output">
+ </LINK>
+ <LINK dstnodeid="253" dstpinname="XYZ" srcnodeid="255" srcpinname="Position Out">
+ </LINK>
+ <NODE componentmode="Hidden" id="256" nodename="LFO (Animation)" systemname="LFO (Animation)">
+ <BOUNDS height="100" left="11820" top="1200" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Cycles" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="254" dstpinname="Random Seed" srcnodeid="256" srcpinname="Cycles">
+ </LINK>
+ <NODE componentmode="InABox" id="258" nodename="IOBox (Value Advanced)" systemname="IOBox (Value Advanced)">
+ <BOUNDS height="100" left="12540" top="2550" type="Node" width="100">
+ </BOUNDS>
+ <BOUNDS height="720" left="12540" top="2550" type="Box" width="795">
+ </BOUNDS>
+ <PIN pinname="Rows" slicecount="1" values="3">
+ </PIN>
+ <PIN pinname="Y Input Value" slicecount="3" values="0,0,0">
+ </PIN>
+ <PIN pinname="Vector Size" slicecount="1" values="3">
+ </PIN>
+ <PIN encoded="0" pinname="Default" slicecount="1" values="|0, 0, 0|">
+ </PIN>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="252" dstpinname="Light Position XYZ" linkstyle="VHV" srcnodeid="258" srcpinname="Y Output Value">
+ <LINKPOINT x="12540" y="3345">
+ </LINKPOINT>
+ <LINKPOINT x="11340" y="3345">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="InABox" id="259" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[3 - Lighting]&cr;&lf;Notice that one of the input pins of the &lt;node&gt;PhongPoint&lt;/node&gt; is called &lt;pin&gt;Light Position XYZ&lt;/pin&gt;. This pin accepts a 3D position for the light.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Create a &lt;b&gt;3D Vector&lt;/b&gt; &lt;node&gt;IOBox&lt;/node&gt; and connect it to this input pin. Now the light should be at the origin (&lt;b&gt;0,0,0&lt;/b&gt;).&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;This kind of light source is a point light source (i.e. a light at a particular 3D position within the scene). If you want the objects to react to a directional light source, then use &lt;node&gt;PhongDirectional&lt;/node&gt; or &lt;node&gt;GourandDirectional&lt;/node&gt; instead of the point versions.|">
+ </PIN>
+ <BOUNDS height="270" left="8595" top="2745" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="330" left="8595" top="2745" type="Box" width="2085">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="260" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[4 - HLSL]&cr;&lf;Shaders are written in a language called &lt;concept&gt;HLSL&lt;/concept&gt;. To see this code, &lt;click/&gt;&lt;rmb/&gt; on the &lt;node&gt;PhongPoint&lt;/node&gt;. This brings up the &lt;concept&gt;Code Editor&lt;/concept&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;As you get more advanced with VVVV, you can try editing these shaders yourself.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;If you want to learn more about shaders, I suggest looking at http://http.developer.nvidia.com/CgTutorial/cg_tutorial_chapter01.html (I&apos;ve got that book and that&apos;s how I learnt!).|">
+ </PIN>
+ <BOUNDS height="270" left="11865" top="9810" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="375" left="11865" top="9810" type="Box" width="1215">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="261" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[5 - GPU calculations]&cr;&lf;GPU&apos;s have become much more powerful than CPU&apos;s (50-100x more powerful), and can therefore perform much more calculations than a CPU can within the time of 1 frame (1/60th of a second). &cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Many developers are therefore exploiting GPU&apos;s to perform calculations. One example of this is the &lt;b&gt;GPU Particles&lt;/b&gt; library in the contributions section of the website, which allows you to manipulate and render 1000&apos;s of particles at the same time by harnessing the power of the GPU.|">
+ </PIN>
+ <BOUNDS height="270" left="11325" top="10515" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="330" left="11325" top="10515" type="Box" width="2430">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ </PATCH>
38 12 - Audio response.html
View
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-16"?>
+<html>
+<head>
+<title>Annotations</title>
+<script>
+ document.createElement('node');
+ document.createElement('pin');
+ document.createElement('key');
+ document.createElement('concept');
+
+ document.createElement('lmb');
+ document.createElement('rmb');
+ document.createElement('mmb');
+ document.createElement('scroll');
+
+ document.createElement('click');
+ document.createElement('click2');
+ document.createElement('hold');
+ document.createElement('release');
+ </script>
+<link rel="stylesheet" type="text/css" href="html_resources/style.css" />
+</head>
+<body>
+<img src="C:\kimchiandchips\Workshops\VVVV.Tutorials.Fundamentals\12 - Audio response.png" />
+<h2>0 - RMS</h2>
+<p> Ok, presuming there's a microphone on the computer you're using, then we can measure the sound in the environment. This could be music, speech or whatever. </p><p> Let's create an <node>AudioIn</node> node, and connect it to an <node>RMS</node> node. Change the <pin>Enabled</pin> pin on <node>AudioIn</node> to <b>1</b>. Create a <b>2D Vector</b> <node>IOBox</node> and attach it to the output of <node>RMS</node>. The numbers should show the audio level, </p><p> The 2 numbers reperesent the left and right channels. Create a <node>Mean (Spectral)</node> node to average out these 2 values. Attach the output of the <node>IOBox</node> to the <node>Mean</node>'s input. </p><p> Put a normal <node>IOBox</node> on the output. Let's grab the 'Audi' patch (the one that renders rings) from our previous Spreads tutorial. </p>
+<h2>1 - Amplification</h2>
+<p> This value is quite low, so let's feed it into a <node>* (Value)</node> node and put another <node>IOBox</node> on the other input of the <node>*</node>. Set the value of the second <node>IOBox</node> to something like <b>20</b>. </p><p> Put an <node>IOBox</node> on the output of the <node>*</node>. Adjust the amplification factor (the number in the second <node>IOBox</node> until the values start varying between <b>0 and 1</b> when sound is being detected. </br></p>
+<h2>2 - Queue</h2>
+<p> If we want to keep a history of these values, we can use the <node>Queue (Spreads)</node> node. Let's create one now. </p><p> Connect the sound intensity to the <node>Queue</node>'s <pin>Input</pin>. Set the <pin>Frame Count</pin> to <b>100</b>. Create a <b>Toggle</b> <node>IOBox</node> and set it to high (i.e. <b>1</b>) and connect the output to <pin>Insert</pin> on the <node>Queue</node>. Now it will keep a history of the last 20 sound intensity values. These are output in a spread of Spread Count 20 on the bottom of <node>Queue</node>. </p><p> Copy in the 'Audi' patch which rendered the rings from tutorial 6. Spreads. </p><p> Connect the <pin>Output</pin> of the <node>Queue</node> to the <pin>Y</pin> input on the <node>Translate</node> node. and set the <node>LinearSpread</node> on the <node>Translate</node>'s <pin>X</pin> pin to have <pin>Spread Count</pin <b>20</b> and <pin>Width</pin> <b>2</b>. </p><p> You should now have a graph of the past 20 values of sound amplitude.</p>
+<h2>3 - FFT</h2>
+<p> The <node>FFT</node> gives us a detailed view of what intensity of each frequency is being heard by the computer. </p><p> To set it up, it's very similar to <node>RMS</node>. We create an <node>AudioIn</node>, set <pin>Enabled</pin> to <b>1</b>, and connect it to an <node>FFT</node> node. </p><p> To visualise its output, let's create an <node>IOBox</node> and attach it to the <pin>FFT L</pin> output of <node>FFT</node>. This gives 256 frequencies within the left channel. Low indexes in the spread are bass, high indices are treble. Since we have 256 values, it's hard to visualise it as numbers in an <node>IOBox</node>. </p><p></p>
+<h2>3 - Visualising 256 slices in an IOBox</h2>
+<p> Go to the <node>Inspektor</node> and set the following properties for the <node>IOBox</node> <ol> <li>Set the <pin>Columns</pin> to <b>256</b></li> <li>Set <pin>Show Value</pin> to <b>false</b></li> <li>Set <pin>Show Connections</pin> to <b>true</b></li> <li>Set the <pin>Maximum</pin> to <b>1</b></li> <li>Set the <pin>Minimum</pin> to <b>0</b></li> </ol> </p><p> If the values are too small to see, then add an amplification factor between </p>
+<h2>4 -Exercise</h2>
+<p> Try to recreate this patch. </p><p> Some notes: <ul> <li>To fix the Aspect Ratio, we're using a <node>Scale</node> connected to the <pin>View</pin> transform pin on the <node>Renderer</node> rather than on the object. This applies the transform to the whole scene</li> <li><node>Resample</node> is used to resize the spread from count 256 to <b>16</b>. The <pin>Mode</pin> is set to <b>Point</b> so that the values are resampled proeprly. This is like resamping an image in Photoshop</li> <li>A segment is an object that renders a circle or an arc. By Setting the <pin>Inner Radius</pin> to <b>0.95</b> we get a ring.</li> </ul></p>
+</body>
+</html>
BIN  12 - Audio response.png
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
851 12 - Audio response.v4p
View
@@ -0,0 +1,851 @@
+<!DOCTYPE PATCH SYSTEM "http://vvvv.org/versions/vvvv45beta26.dtd" >
+ <PATCH nodename="C:\kimchiandchips\Workshops\VVVV.Tutorials.Fundamentals\12 - Audio response.v4p" filename="C:\kimchiandchips\Workshops\VVVV.Tutorials.Fundamentals\12 - Audio response.v4p" locked="0" systemname="12 - Audio response">
+ <BOUNDS height="13725" left="7755" top="630" type="Window" width="16800">
+ </BOUNDS>
+ <NODE componentmode="InABox" id="0" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="225" top="150" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="1095" left="225" top="150" type="Box" width="8085">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|12. Audio response|">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="42">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="2" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="105" top="12405" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="750" left="105" top="12405" type="Box" width="5325">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|Created by Elliot Woods.&cr;&lf;Distributed under the MIT license (check file LICENSE) for details.&cr;&lf;Generally you can do whatever you want with these files. have fun!|">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="5" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="5805" top="2640" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="540" left="5805" top="2640" type="Box" width="2085">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" visible="1">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="12">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="Author">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="6" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="225" top="1260" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="1155" left="225" top="1260" type="Box" width="7665">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" visible="1">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="12">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="Description">
+ </PIN>
+ </NODE>
+ <INFO author="Elliot Woods" description="Analysing audio within VVVV. Looking at intensity using RMS, and intensity per frequency using FFT." tags="AudioIn, RMS, FFT, Show Connections in IOBox">
+ </INFO>
+ <NODE componentmode="Hidden" filename="Subpatches\GetMetadata (VVVV).v4p" hiddenwhenlocked="1" id="10" nodename="GetMetadata (VVVV)" systemname="GetMetadata (VVVV)">
+ <BOUNDS height="100" left="5820" top="1800" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Patch" visible="1">
+ </PIN>
+ <BOUNDS height="3465" left="14520" top="5520" type="Window" width="4680">
+ </BOUNDS>
+ <PIN pinname="Author" visible="1">
+ </PIN>
+ <PIN pinname="Description" visible="1">
+ </PIN>
+ <PIN pinname="Tags" visible="1">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" hiddenwhenlocked="1" id="8" nodename="PatchAlias (VVVV)" systemname="PatchAlias (VVVV)">
+ <BOUNDS height="100" left="5820" top="1350" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Patch" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="10" dstpinname="Patch" hiddenwhenlocked="1" srcnodeid="8" srcpinname="Patch">
+ </LINK>
+ <LINK dstnodeid="6" dstpinname="Input String" hiddenwhenlocked="1" linkstyle="VHV" srcnodeid="10" srcpinname="Description">
+ <LINKPOINT x="6445" y="2205">
+ </LINKPOINT>
+ <LINKPOINT x="245" y="2355">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="InABox" id="11" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="225" top="2640" type="Node" width="1380">
+ </BOUNDS>
+ <BOUNDS height="540" left="225" top="2640" type="Box" width="5520">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" visible="1">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="Tags">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="11" dstpinname="Input String" hiddenwhenlocked="1" linkstyle="VHV" srcnodeid="10" srcpinname="Tags">
+ <LINKPOINT x="7015" y="2293">
+ </LINKPOINT>
+ <LINKPOINT x="275" y="2448">
+ </LINKPOINT>
+ </LINK>
+ <LINK dstnodeid="5" dstpinname="Input String" hiddenwhenlocked="1" srcnodeid="10" srcpinname="Author">
+ </LINK>
+ <NODE componentmode="InABox" id="103" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="8145" top="3465" type="Node" width="330">
+ </BOUNDS>
+ <BOUNDS height="7515" left="8145" top="3465" type="Box" width="345">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="||">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="12" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[0 - RMS]&cr;&lf;&cr;&lf;Ok, presuming there&apos;s a microphone on the computer you&apos;re using, then we can measure the sound in the environment. This could be music, speech or whatever.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Let&apos;s create an &lt;node&gt;AudioIn&lt;/node&gt; node, and connect it to an &lt;node&gt;RMS&lt;/node&gt; node. Change the &lt;pin&gt;Enabled&lt;/pin&gt; pin on &lt;node&gt;AudioIn&lt;/node&gt; to &lt;b&gt;1&lt;/b&gt;. Create a &lt;b&gt;2D Vector&lt;/b&gt; &lt;node&gt;IOBox&lt;/node&gt; and attach it to the output of &lt;node&gt;RMS&lt;/node&gt;. The numbers should show the audio level,&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;The 2 numbers reperesent the left and right channels. Create a &lt;node&gt;Mean (Spectral)&lt;/node&gt; node to average out these 2 values. Attach the output of the &lt;node&gt;IOBox&lt;/node&gt; to the &lt;node&gt;Mean&lt;/node&gt;&apos;s input.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Put a normal &lt;node&gt;IOBox&lt;/node&gt; on the output.&cr;&lf;&cr;&lf;Let&apos;s grab the &apos;Audi&apos; patch (the one that renders rings) from our previous Spreads tutorial.&cr;&lf;&cr;&lf;|">
+ </PIN>
+ <BOUNDS height="270" left="4575" top="4740" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="375" left="4575" top="4740" type="Box" width="2460">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="262" nodename="AudioIn (DShow9)" systemname="AudioIn (DShow9)">
+ <BOUNDS height="100" left="3195" top="3570" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Enabled" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="Audio" visible="1">
+ </PIN>
+ </NODE>
+ <NODE systemname="RMS (DShow9)" nodename="RMS (DShow9)" componentmode="Hidden" id="263">
+ <BOUNDS type="Node" left="3195" top="3990" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Audio" visible="1">
+ </PIN>
+ <PIN pinname="RMS" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="262" srcpinname="Audio" dstnodeid="263" dstpinname="Audio">
+ </LINK>
+ <NODE componentmode="InABox" id="279" nodename="Renderer (EX9)" systemname="Renderer (EX9)">
+ <BOUNDS height="100" left="165" top="7695" type="Node" width="100">
+ </BOUNDS>
+ <BOUNDS height="3660" left="165" top="7695" type="Box" width="7695">
+ </BOUNDS>
+ <BOUNDS height="5010" left="15765" top="6165" type="Window" width="6240">
+ </BOUNDS>
+ <PIN pinname="Layers" visible="1">
+ </PIN>
+ <PIN pinname="Actual Backbuffer Width" visible="1">
+ </PIN>
+ <PIN pinname="Actual Backbuffer Height" visible="1">
+ </PIN>
+ <PIN pinname="Background Color" visible="1">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="278" nodename="Quad (DX9)" systemname="Quad (DX9)">
+ <BOUNDS height="270" left="165" top="7185" type="Node" width="1245">
+ </BOUNDS>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ <PIN pinname="Transform" visible="1">
+ </PIN>
+ <PIN pinname="Texture" visible="1">
+ </PIN>
+ <PIN pinname="Render State" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="279" dstpinname="Layers" srcnodeid="278" srcpinname="Layer">
+ </LINK>
+ <NODE componentmode="Hidden" id="277" nodename="UniformScale (Transform)" systemname="UniformScale (Transform)">
+ <BOUNDS height="100" left="330" top="6225" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="XYZ" slicecount="1" values="0.1">
+ </PIN>
+ <PIN pinname="Transform In" visible="1">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="276" nodename="FileTexture (EX9.Texture)" systemname="FileTexture (EX9.Texture)">
+ <BOUNDS height="100" left="1605" top="6690" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Texture Out" visible="1">
+ </PIN>
+ <PIN encoded="0" pinname="Filename" slicecount="1" values="|..\..\..\vvvv\vvvv_45beta26\girlpower\images\ring thin.bmp|">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="278" dstpinname="Texture" linkstyle="VHV" srcnodeid="276" srcpinname="Texture Out">
+ <LINKPOINT x="1605" y="7058">
+ </LINKPOINT>
+ <LINKPOINT x="570" y="7058">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="Hidden" id="275" nodename="Scale (Transform)" systemname="Scale (Transform)">
+ <BOUNDS height="100" left="330" top="6690" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="X" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="Y" visible="1">
+ </PIN>
+ <PIN pinname="Transform In" visible="1">
+ </PIN>
+ </NODE>
+ <NODE componentmode="Hidden" id="274" nodename="Divide (Value)" systemname="Divide (Value)">
+ <BOUNDS height="270" left="5880" top="11685" type="Node" width="1035">
+ </BOUNDS>
+ <PIN pinname="Input" visible="1">
+ </PIN>
+ <PIN pinname="Input 2" visible="1">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="274" dstpinname="Input" srcnodeid="279" srcpinname="Actual Backbuffer Width">
+ </LINK>
+ <LINK dstnodeid="274" dstpinname="Input 2" srcnodeid="279" srcpinname="Actual Backbuffer Height">
+ </LINK>
+ <LINK dstnodeid="278" dstpinname="Transform" srcnodeid="275" srcpinname="Transform Out">
+ </LINK>
+ <LINK dstnodeid="275" dstpinname="Transform In" srcnodeid="277" srcpinname="Transform Out">
+ </LINK>
+ <NODE componentmode="Hidden" id="271" nodename="Translate (Transform)" systemname="Translate (Transform)">
+ <BOUNDS height="100" left="330" top="5820" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="X" visible="1">
+ </PIN>
+ <PIN pinname="Y" visible="1">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="277" dstpinname="Transform In" srcnodeid="271" srcpinname="Transform Out">
+ </LINK>
+ <NODE componentmode="Hidden" id="270" nodename="LinearSpread (Spreads)" systemname="LinearSpread (Spreads)">
+ <BOUNDS height="100" left="585" top="5490" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Spread Count" slicecount="1" values="20">
+ </PIN>
+ <PIN pinname="Width" slicecount="1" values="2">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="271" dstpinname="X" srcnodeid="270" srcpinname="Output">
+ </LINK>
+ <NODE componentmode="Hidden" id="268" nodename="RetroColors (Color)" systemname="RetroColors (Color)">
+ <BOUNDS height="100" left="1860" top="7275" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Wavelength (nm)">
+ </PIN>
+ <PIN pinname="Index" slicecount="1" values="4">
+ </PIN>
+ <PIN pinname="Mode" slicecount="1" values="SinclairZXSpectrum">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="279" dstpinname="Background Color" srcnodeid="268" srcpinname="Output">
+ </LINK>
+ <NODE componentmode="Hidden" id="267" nodename="Blend (EX9.RenderState)" systemname="Blend (EX9.RenderState)">
+ <BOUNDS height="100" left="165" top="5100" type="Node" width="100">
+ </BOUNDS>
+ <PIN pinname="Render State Out" visible="1">
+ </PIN>
+ <PIN pinname="Draw Mode" slicecount="1" values="Add">
+ </PIN>
+ </NODE>
+ <LINK dstnodeid="278" dstpinname="Render State" linkstyle="VHV" srcnodeid="267" srcpinname="Render State Out">
+ <LINKPOINT x="65" y="5998">
+ </LINKPOINT>
+ <LINKPOINT x="325" y="6528">
+ </LINKPOINT>
+ </LINK>
+ <NODE systemname="Queue (Spreads)" filename="%VVVV%\plugins\SpreadOperations.dll" nodename="Queue (Spreads)" componentmode="Hidden" id="280">
+ <BOUNDS type="Node" left="3210" top="7395" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Frame Count" slicecount="1" values="20">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Insert" visible="1">
+ </PIN>
+ <PIN pinname="Input" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="280" srcpinname="Output" dstnodeid="271" dstpinname="Y" linkstyle="Bezier" hiddenwhenlocked="0">
+ <LINKPOINT x="3210" y="6858">
+ </LINKPOINT>
+ <LINKPOINT x="885" y="6598">
+ </LINKPOINT>
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="281">
+ <BOUNDS type="Node" left="3405" top="6570" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="3405" top="6570" width="480" height="480">
+ </BOUNDS>
+ <PIN pinname="Value Type" slicecount="1" values="Boolean">
+ </PIN>
+ <PIN pinname="Behavior" slicecount="1" values="Toggle">
+ </PIN>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ <PIN pinname="X Input Value" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="Y Input Value" slicecount="1" values="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="281" srcpinname="Y Output Value" dstnodeid="280" dstpinname="Insert">
+ </LINK>
+ <NODE systemname="Mean (Spectral)" nodename="Mean (Spectral)" componentmode="Hidden" id="282">
+ <BOUNDS type="Node" left="3195" top="4950" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Input" visible="1">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="274" srcpinname="Output" dstnodeid="275" dstpinname="Y" hiddenwhenlocked="1">
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="283">
+ <BOUNDS type="Node" left="3210" top="4365" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="3210" top="4365" width="795" height="480">
+ </BOUNDS>
+ <PIN pinname="Rows" slicecount="1" values="2">
+ </PIN>
+ <PIN pinname="Y Input Value" visible="1">
+ </PIN>
+ <PIN pinname="Vector Size" slicecount="1" values="2">
+ </PIN>
+ <PIN pinname="Default" slicecount="1" values="|0, 0|" encoded="0">
+ </PIN>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="263" srcpinname="RMS" dstnodeid="283" dstpinname="Y Input Value">
+ </LINK>
+ <LINK srcnodeid="283" srcpinname="Y Output Value" dstnodeid="282" dstpinname="Input">
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="284">
+ <BOUNDS type="Node" left="3195" top="5385" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="3195" top="5385" width="795" height="240">
+ </BOUNDS>
+ <PIN pinname="Y Input Value" visible="1">
+ </PIN>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="282" srcpinname="Output" dstnodeid="284" dstpinname="Y Input Value">
+ </LINK>
+ <NODE systemname="Multiply (Value)" nodename="Multiply (Value)" componentmode="Hidden" id="285">
+ <BOUNDS type="Node" left="3195" top="5805" width="1110" height="270">
+ </BOUNDS>
+ <PIN pinname="Input 1" visible="1">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Input 2" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="284" srcpinname="Y Output Value" dstnodeid="285" dstpinname="Input 1">
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="286">
+ <BOUNDS type="Node" left="3195" top="6240" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="3195" top="6240" width="795" height="240">
+ </BOUNDS>
+ <PIN pinname="Y Input Value" visible="1">
+ </PIN>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="285" srcpinname="Output" dstnodeid="286" dstpinname="Y Input Value">
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="287">
+ <BOUNDS type="Node" left="4245" top="5370" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="4245" top="5370" width="795" height="240">
+ </BOUNDS>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ <PIN pinname="Y Input Value" slicecount="1" values="20">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="287" srcpinname="Y Output Value" dstnodeid="285" dstpinname="Input 2">
+ </LINK>
+ <LINK srcnodeid="286" srcpinname="Y Output Value" dstnodeid="280" dstpinname="Input">
+ </LINK>
+ <NODE componentmode="InABox" id="288" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[1 - Amplification]&cr;&lf;&cr;&lf;This value is quite low, so let&apos;s feed it into a &lt;node&gt;* (Value)&lt;/node&gt; node and put another &lt;node&gt;IOBox&lt;/node&gt; on the other input of the &lt;node&gt;*&lt;/node&gt;. Set the value of the second &lt;node&gt;IOBox&lt;/node&gt; to something like &lt;b&gt;20&lt;/b&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Put an &lt;node&gt;IOBox&lt;/node&gt; on the output of the &lt;node&gt;*&lt;/node&gt;. Adjust the amplification factor (the number in the second &lt;node&gt;IOBox&lt;/node&gt; until the values start varying between &lt;b&gt;0 and 1&lt;/b&gt; when sound is being detected.&cr;&lf;&lt;/br&gt;|">
+ </PIN>
+ <BOUNDS height="270" left="4590" top="5730" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="375" left="4590" top="5730" type="Box" width="2460">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="289" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[2 - Queue]&cr;&lf;If we want to keep a history of these values, we can use the &lt;node&gt;Queue (Spreads)&lt;/node&gt; node. Let&apos;s create one now.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Connect the sound intensity to the &lt;node&gt;Queue&lt;/node&gt;&apos;s &lt;pin&gt;Input&lt;/pin&gt;. Set the &lt;pin&gt;Frame Count&lt;/pin&gt; to &lt;b&gt;100&lt;/b&gt;. Create a &lt;b&gt;Toggle&lt;/b&gt; &lt;node&gt;IOBox&lt;/node&gt; and set it to high (i.e. &lt;b&gt;1&lt;/b&gt;) and connect the output to &lt;pin&gt;Insert&lt;/pin&gt; on the &lt;node&gt;Queue&lt;/node&gt;.&cr;&lf;&cr;&lf;Now it will keep a history of the last 20 sound intensity values. These are output in a spread of Spread Count 20 on the bottom of &lt;node&gt;Queue&lt;/node&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Copy in the &apos;Audi&apos; patch which rendered the rings from tutorial 6. Spreads.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Connect the &lt;pin&gt;Output&lt;/pin&gt; of the &lt;node&gt;Queue&lt;/node&gt; to the &lt;pin&gt;Y&lt;/pin&gt; input on the &lt;node&gt;Translate&lt;/node&gt; node. and set the &lt;node&gt;LinearSpread&lt;/node&gt; on the &lt;node&gt;Translate&lt;/node&gt;&apos;s &lt;pin&gt;X&lt;/pin&gt; pin to have &lt;pin&gt;Spread Count&lt;/pin &lt;b&gt;20&lt;/b&gt; and &lt;pin&gt;Width&lt;/pin&gt; &lt;b&gt;2&lt;/b&gt;.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;You should now have a graph of the past 20 values of sound amplitude.|">
+ </PIN>
+ <BOUNDS height="270" left="4200" top="7275" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="375" left="4200" top="7275" type="Box" width="2460">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE systemname="Renderer (EX9)" nodename="Renderer (EX9)" componentmode="InABox" id="290">
+ <BOUNDS type="Node" left="9285" top="7260" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="9285" top="7260" width="6705" height="5565">
+ </BOUNDS>
+ <BOUNDS type="Window" left="17370" top="3855" width="6240" height="5010">
+ </BOUNDS>
+ <PIN pinname="Background Color" visible="1">
+ </PIN>
+ <PIN pinname="Layers" visible="1">
+ </PIN>
+ <PIN pinname="Windowed Antialiasing Quality Level" slicecount="1" values="3">
+ </PIN>
+ <PIN pinname="Actual Backbuffer Width" visible="1">
+ </PIN>
+ <PIN pinname="Actual Backbuffer Height" visible="1">
+ </PIN>
+ <PIN pinname="View" visible="1">
+ </PIN>
+ </NODE>
+ <NODE systemname="RetroColors (Color)" nodename="RetroColors (Color)" componentmode="Hidden" id="291">
+ <BOUNDS type="Node" left="10755" top="6780" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Mode" slicecount="1" values="AppleIIHiRes">
+ </PIN>
+ <PIN pinname="Index" slicecount="1" values="13">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="291" srcpinname="Output" dstnodeid="290" dstpinname="Background Color">
+ </LINK>
+ <NODE systemname="Segment (DX9)" nodename="Segment (DX9)" componentmode="Hidden" id="292">
+ <BOUNDS type="Node" left="9300" top="6405" width="4020" height="270">
+ </BOUNDS>
+ <PIN pinname="Layer" visible="1">
+ </PIN>
+ <PIN pinname="Resolution" slicecount="1" values="64">
+ </PIN>
+ <PIN pinname="Inner Radius" slicecount="1" values="0.95">
+ </PIN>
+ <PIN pinname="Transform" visible="1">
+ </PIN>
+ <PIN pinname="Cycles" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="292" srcpinname="Layer" dstnodeid="290" dstpinname="Layers">
+ </LINK>
+ <NODE systemname="UniformScale (Transform)" nodename="UniformScale (Transform)" componentmode="Hidden" id="293">
+ <BOUNDS type="Node" left="9690" top="5925" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="XYZ" visible="1">
+ </PIN>
+ <PIN pinname="Transform In" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="293" srcpinname="Transform Out" dstnodeid="292" dstpinname="Transform">
+ </LINK>
+ <NODE systemname="LinearSpread (Spreads)" nodename="LinearSpread (Spreads)" componentmode="Hidden" id="295">
+ <BOUNDS type="Node" left="10695" top="5415" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Spread Count" visible="1">
+ </PIN>
+ <PIN pinname="Input" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="Width" slicecount="1" values="2">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="295" srcpinname="Output" dstnodeid="293" dstpinname="XYZ">
+ </LINK>
+ <NODE systemname="RandomSpread (Spreads)" nodename="RandomSpread (Spreads)" componentmode="Hidden" id="296">
+ <BOUNDS type="Node" left="12075" top="5415" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Spread Count" visible="1">
+ </PIN>
+ </NODE>
+ <NODE systemname="Rotate (Transform)" nodename="Rotate (Transform)" componentmode="Hidden" id="297">
+ <BOUNDS type="Node" left="9675" top="5145" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="Z" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="297" srcpinname="Transform Out" dstnodeid="293" dstpinname="Transform In">
+ </LINK>
+ <NODE systemname="LFO (Animation)" nodename="LFO (Animation)" componentmode="Hidden" id="298">
+ <BOUNDS type="Node" left="10245" top="3690" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Period" visible="1" slicecount="1" values="5">
+ </PIN>
+ <PIN pinname="Phase" visible="1" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="Cycles" visible="1">
+ </PIN>
+ </NODE>
+ <NODE systemname="RandomSpread (Spreads)" nodename="RandomSpread (Spreads)" componentmode="Hidden" id="299">
+ <BOUNDS type="Node" left="11070" top="4155" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Input" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="Spread Count" visible="1">
+ </PIN>
+ <PIN pinname="Random Seed" slicecount="1" values="6">
+ </PIN>
+ </NODE>
+ <NODE systemname="Multiply (Value)" nodename="Multiply (Value)" componentmode="Hidden" id="301">
+ <BOUNDS type="Node" left="10260" top="4650" width="870" height="270">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Input 1" visible="1">
+ </PIN>
+ <PIN pinname="Input 2" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="301" srcpinname="Output" dstnodeid="297" dstpinname="Z">
+ </LINK>
+ <LINK srcnodeid="299" srcpinname="Output" dstnodeid="301" dstpinname="Input 2">
+ </LINK>
+ <NODE systemname="Add (Value)" nodename="Add (Value)" componentmode="Hidden" id="302">
+ <BOUNDS type="Node" left="10245" top="4155" width="750" height="270">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Input 1" visible="1">
+ </PIN>
+ <PIN pinname="Input 2" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="302" srcpinname="Output" dstnodeid="301" dstpinname="Input 1">
+ </LINK>
+ <LINK srcnodeid="298" srcpinname="Output" dstnodeid="302" dstpinname="Input 1">
+ </LINK>
+ <LINK srcnodeid="298" srcpinname="Cycles" dstnodeid="302" dstpinname="Input 2">
+ </LINK>
+ <NODE systemname="FFT (DShow9)" nodename="FFT (DShow9)" componentmode="Hidden" id="303">
+ <BOUNDS type="Node" left="9570" top="840" width="1305" height="270">
+ </BOUNDS>
+ <PIN pinname="Audio" visible="1">
+ </PIN>
+ <PIN pinname="FFT L" visible="1">
+ </PIN>
+ <PIN pinname="FFT R" visible="1">
+ </PIN>
+ </NODE>
+ <NODE systemname="AudioIn (DShow9)" nodename="AudioIn (DShow9)" componentmode="Hidden" id="304">
+ <BOUNDS type="Node" left="9555" top="495" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Audio" visible="1">
+ </PIN>
+ <PIN pinname="Enabled" slicecount="1" values="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="304" srcpinname="Audio" dstnodeid="303" dstpinname="Audio">
+ </LINK>
+ <NODE systemname="Divide (Value)" nodename="Divide (Value)" componentmode="Hidden" id="306">
+ <BOUNDS type="Node" left="14265" top="12915" width="900" height="270">
+ </BOUNDS>
+ <PIN pinname="Input" visible="1">
+ </PIN>
+ <PIN pinname="Input 2" visible="1">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="290" srcpinname="Actual Backbuffer Width" dstnodeid="306" dstpinname="Input">
+ </LINK>
+ <LINK srcnodeid="290" srcpinname="Actual Backbuffer Height" dstnodeid="306" dstpinname="Input 2">
+ </LINK>
+ <NODE systemname="Scale (Transform)" nodename="Scale (Transform)" componentmode="Hidden" id="307">
+ <BOUNDS type="Node" left="14460" top="6540" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Transform Out" visible="1">
+ </PIN>
+ <PIN pinname="X" visible="1" slicecount="1" values="1.23268698060942">
+ </PIN>
+ <PIN pinname="Y" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="307" srcpinname="Transform Out" dstnodeid="290" dstpinname="View">
+ </LINK>
+ <LINK srcnodeid="306" srcpinname="Output" dstnodeid="307" dstpinname="Y" linkstyle="Bezier" hiddenwhenlocked="1">
+ <LINKPOINT x="14295" y="9863">
+ </LINKPOINT>
+ <LINKPOINT x="14835" y="9863">
+ </LINKPOINT>
+ </LINK>
+ <NODE systemname="Multiply (Value)" nodename="Multiply (Value)" componentmode="Hidden" id="309">
+ <BOUNDS type="Node" left="12075" top="5880" width="1605" height="270">
+ </BOUNDS>
+ <PIN pinname="Input 1" visible="1">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Input 2" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="296" srcpinname="Output" dstnodeid="309" dstpinname="Input 1">
+ </LINK>
+ <LINK srcnodeid="309" srcpinname="Output" dstnodeid="292" dstpinname="Cycles">
+ </LINK>
+ <NODE systemname="Resample (Spreads)" nodename="Resample (Spreads)" componentmode="Hidden" id="311">
+ <BOUNDS type="Node" left="13635" top="4935" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Spread Count" slicecount="1" values="16">
+ </PIN>
+ <PIN pinname="Mode" slicecount="1" values="Point">
+ </PIN>
+ <PIN pinname="Input" visible="1">
+ </PIN>
+ </NODE>
+ <NODE systemname="Decay (Animation)" nodename="Decay (Animation)" componentmode="Hidden" id="308">
+ <BOUNDS type="Node" left="13635" top="5415" width="100" height="100">
+ </BOUNDS>
+ <PIN pinname="Position Out" visible="1">
+ </PIN>
+ <PIN pinname="Go To Position" visible="1">
+ </PIN>
+ <PIN pinname="Input" visible="1">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Decay" slicecount="1" values="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="308" srcpinname="Output" dstnodeid="309" dstpinname="Input 2">
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="313">
+ <BOUNDS type="Node" left="9570" top="1605" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="9570" top="1605" width="6375" height="885">
+ </BOUNDS>
+ <PIN pinname="Columns" slicecount="1" values="256">
+ </PIN>
+ <PIN pinname="Minimum" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="Maximum" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="Show Connections" slicecount="1" values="1">
+ </PIN>
+ <PIN pinname="Show Value" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="Y Input Value" visible="1">
+ </PIN>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="313" srcpinname="Y Output Value" dstnodeid="311" dstpinname="Input" linkstyle="Bezier">
+ <LINKPOINT x="9635" y="3723">
+ </LINKPOINT>
+ <LINKPOINT x="13630" y="3673">
+ </LINKPOINT>
+ </LINK>
+ <LINK srcnodeid="311" srcpinname="Output" dstnodeid="308" dstpinname="Input">
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="314">
+ <BOUNDS type="Node" left="13185" top="2940" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="13185" top="2940" width="795" height="240">
+ </BOUNDS>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ <PIN pinname="Descriptive Name" slicecount="1" values="|Spread Count|" encoded="0">
+ </PIN>
+ <PIN pinname="Y Input Value" slicecount="1" values="16">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="314" srcpinname="Y Output Value" dstnodeid="296" dstpinname="Spread Count">
+ </LINK>
+ <LINK srcnodeid="314" srcpinname="Y Output Value" dstnodeid="299" dstpinname="Spread Count" linkstyle="VHV">
+ <LINKPOINT x="13185" y="3538">
+ </LINKPOINT>
+ <LINKPOINT x="12255" y="3768">
+ </LINKPOINT>
+ </LINK>
+ <LINK srcnodeid="314" srcpinname="Y Output Value" dstnodeid="295" dstpinname="Spread Count" linkstyle="VHV">
+ <LINKPOINT x="13215" y="5220">
+ </LINKPOINT>
+ <LINKPOINT x="11685" y="5220">
+ </LINKPOINT>
+ </LINK>
+ <NODE componentmode="InABox" id="315" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[3 - FFT]&cr;&lf;The &lt;node&gt;FFT&lt;/node&gt; gives us a detailed view of what intensity of each frequency is being heard by the computer.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;To set it up, it&apos;s very similar to &lt;node&gt;RMS&lt;/node&gt;. We create an &lt;node&gt;AudioIn&lt;/node&gt;, set &lt;pin&gt;Enabled&lt;/pin&gt; to &lt;b&gt;1&lt;/b&gt;, and connect it to an &lt;node&gt;FFT&lt;/node&gt; node.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;To visualise its output, let&apos;s create an &lt;node&gt;IOBox&lt;/node&gt; and attach it to the &lt;pin&gt;FFT L&lt;/pin&gt; output of &lt;node&gt;FFT&lt;/node&gt;. This gives 256 frequencies within the left channel. Low indexes in the spread are bass, high indices are treble. Since we have 256 values, it&apos;s hard to visualise it as numbers in an &lt;node&gt;IOBox&lt;/node&gt;.&cr;&lf;&lt;br /&gt;|">
+ </PIN>
+ <BOUNDS height="270" left="9555" top="60" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="375" left="9555" top="60" type="Box" width="2460">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="316" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[3 - Visualising 256 slices in an IOBox]&cr;&lf;Go to the &lt;node&gt;Inspektor&lt;/node&gt; and set the following properties for the &lt;node&gt;IOBox&lt;/node&gt;&cr;&lf;&lt;ol&gt;&cr;&lf;&lt;li&gt;Set the &lt;pin&gt;Columns&lt;/pin&gt; to &lt;b&gt;256&lt;/b&gt;&lt;/li&gt;&cr;&lf;&lt;li&gt;Set &lt;pin&gt;Show Value&lt;/pin&gt; to &lt;b&gt;false&lt;/b&gt;&lt;/li&gt;&cr;&lf;&lt;li&gt;Set &lt;pin&gt;Show Connections&lt;/pin&gt; to &lt;b&gt;true&lt;/b&gt;&lt;/li&gt;&cr;&lf;&lt;li&gt;Set the &lt;pin&gt;Maximum&lt;/pin&gt; to &lt;b&gt;1&lt;/b&gt;&lt;/li&gt;&cr;&lf;&lt;li&gt;Set the &lt;pin&gt;Minimum&lt;/pin&gt; to &lt;b&gt;0&lt;/b&gt;&lt;/li&gt;&cr;&lf;&lt;/ol&gt;&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;If the values are too small to see, then add an amplification factor between |">
+ </PIN>
+ <BOUNDS height="270" left="11250" top="2580" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="360" left="11250" top="2580" type="Box" width="4335">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ <NODE systemname="Multiply (Value)" nodename="Multiply (Value)" componentmode="Hidden" id="317">
+ <BOUNDS type="Node" left="9570" top="1215" width="2640" height="270">
+ </BOUNDS>
+ <PIN pinname="Input 1" visible="1">
+ </PIN>
+ <PIN pinname="Output" visible="1">
+ </PIN>
+ <PIN pinname="Input 2" visible="1">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="303" srcpinname="FFT L" dstnodeid="317" dstpinname="Input 1">
+ </LINK>
+ <LINK srcnodeid="317" srcpinname="Output" dstnodeid="313" dstpinname="Y Input Value">
+ </LINK>
+ <NODE systemname="IOBox (Value Advanced)" nodename="IOBox (Value Advanced)" componentmode="InABox" id="318">
+ <BOUNDS type="Node" left="12135" top="735" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="12135" top="735" width="795" height="240">
+ </BOUNDS>
+ <PIN pinname="Y Output Value" visible="1">
+ </PIN>
+ <PIN pinname="Y Input Value" slicecount="1" values="20">
+ </PIN>
+ </NODE>
+ <LINK srcnodeid="318" srcpinname="Y Output Value" dstnodeid="317" dstpinname="Input 2">
+ </LINK>
+ <NODE componentmode="InABox" id="319" nodename="IOBox (String)" systemname="IOBox (String)">
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[4 -Exercise]&cr;&lf;Try to recreate this patch.&cr;&lf;&lt;br /&gt;&cr;&lf;&cr;&lf;Some notes:&cr;&lf;&lt;ul&gt;&cr;&lf;&lt;li&gt;To fix the Aspect Ratio, we&apos;re using a &lt;node&gt;Scale&lt;/node&gt; connected to the &lt;pin&gt;View&lt;/pin&gt; transform pin on the &lt;node&gt;Renderer&lt;/node&gt; rather than on the object. This applies the transform to the whole scene&lt;/li&gt;&cr;&lf;&lt;li&gt;&lt;node&gt;Resample&lt;/node&gt; is used to resize the spread from count 256 to &lt;b&gt;16&lt;/b&gt;. The &lt;pin&gt;Mode&lt;/pin&gt; is set to &lt;b&gt;Point&lt;/b&gt; so that the values are resampled proeprly. This is like resamping an image in Photoshop&lt;/li&gt;&cr;&lf;&lt;li&gt;A segment is an object that renders a circle or an arc. By Setting the &lt;pin&gt;Inner Radius&lt;/pin&gt; to &lt;b&gt;0.95&lt;/b&gt; we get a ring.&lt;/li&gt;&cr;&lf;&cr;&lf;&lt;/ul&gt;|">
+ </PIN>
+ <BOUNDS height="270" left="9555" top="3060" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="375" left="9555" top="3060" type="Box" width="1515">
+ </BOUNDS>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
+ </PATCH>
2  7. Animation.html
View
@@ -32,5 +32,7 @@
<p> Firstly let's grab the rendering patch we had from last time. Copy it <key>Ctrl</key>+<key>C</key> there , and paste it <key>Ctrl</key>+<key>V</key>here. Set the <pin>Spread Count</pin> to <b>3</b>. </p><p> To save some space. I've deleted the <b>Aspect Ratio</b> <node>IOBox</node> and connected the <node>/</node> directly to the <node>Scale</node>'s <pin>Y</pin> input. Also I've scaled down the size of the <node>Renderer</node> in my patch. </p><p> First let's manually 'roll' the <pin>Phase</pin> input of the <node>LinearSpread</node>. Just put your mouse over it <img src="html_resources/hold.png"/><img src="html_resources/rmb.png"/> hold the right mouse down and drag up/down. </p><p> Now create a new node <node>LFO (Animation)</node> and add 2 <node>IOBox</node>'s to the <pin>Output</pin> and <pin>Cycles</pin> output pins on it. Set the <pin>Period</pin> input on <node>LFO</node> to <b>3 seconds</b>. Notice how the <pin>Output</pin> and <pin>Cycles</pin> are affected. </p><p> Now connect the <pin>Output</pin> of <node>LFO</node> to the <pin>Phase</pin> input of <node>LinearSpread</node>. You should see the circles marching in a line.</p>
<h2>3 - RandomSpread animations</h2>
<p> Now make a copy of that section of the patch, delete the <node>LFO</node> with its <node>IOBox</node>'s. The <pin>Phase</pin> of the <node>LinearSpread</node> will now keep the last value sent to it. </p><p> Create a <node>RandomSpread (Spreads)</node> node above <node>Translate</node>, and attach the <pin>Output</pin> of <node>RandomSpread</node> to the <pin>Y</pin> input of <node>Translate</node> and set the <pin>Spread Count</pin> to <b>3</b>. </p><p> RandomSpread is now outputting a Spread of 3 values, each of which should be random (if you want to get nerdy, pseudo-random). </p><p> If we roll the value of the <pin>Random Seed</pin> input pin of <node>RandomSpread</node>, we'll get a different set of random numbers. </p><p> Create a new <node>LFO</node> and connect the <node>Cycles</node> output to the <pin>Random Seed</pin> input. Now periodically the circles will jump to new positions. </p><p> Aha! We know how to make things move smoothly instead of jumping dont we? Let's stick a <node>Damper</node> in the path between <node>RandomSpread</node> and <node>Translate</node>. Now they should move smoothly! </p><p> To improve this, let's try a few things: <ul> <li>Change the <pin>Width</pin> of the <node>RandomSpread</node> to <b>2</b>. This means that the range of values output will be between <b>-1</b> and <b>+1</b> which is the range of Y values that fit inside the Renderer. The range is defined by the <pin>Width</pin> and the <pin>Input</pin> (i.e. the center) of <node>RandomSpread</node></li> <li>Try increasing the <pin>Filter Time</pin> of <node>Damper</node> to make the circles accelerate more slowly.</li> <li>Try changing the <pin>Period</pin> of the <node>LFO</node>. Note that if the <pin>Period</pin> is too short (i.e. quick), then the input to the <node>Damper</node> might move too quickly for the output to ever catch up.</li> <li>Try increasing the <pin>Spread Count</pin> on <node>RandomSpread</node></li> <li>Try chaning the <pin>Spread Count</pin> and <pin>Width</pin> of the <node>LinearSpread</node></li> </ul></p>
+<h2>3 - Timeliner</h2>
+<p> The <node>Timeliner</node> node is a fantastic tool for advanced animations. Check out the help patch for it by creating the node and pressing <key>F1</key> whilst it is selected.</p>
</body>
</html>
BIN  7. Animation.png
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
34 7. Animation.v4p
View
@@ -734,4 +734,38 @@
<PIN pinname="String Type" slicecount="1" values="MultiLine">
</PIN>
</NODE>
+ <NODE systemname="Timeliner (Animation)" filename="%VVVV%\plugins\Timeliner.dll" nodename="Timeliner (Animation)" componentmode="Hidden" id="194">
+ <BOUNDS type="Node" left="8910" top="12675" width="100" height="100">
+ </BOUNDS>
+ <BOUNDS type="Box" left="8910" top="12675" width="6000" height="3000">
+ </BOUNDS>
+ <BOUNDS type="Window" left="16230" top="13275" width="9000" height="4500">
+ </BOUNDS>
+ <PIN pinname="Translate" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="Scale" slicecount="1" values="50">
+ </PIN>
+ <PIN pinname="Pin Settings" slicecount="1" values="|&lt;PIN Name=&quot;Ruler0&quot; Type=&quot;Ruler&quot; SliceCount=&quot;0&quot; Height=&quot;40&quot; Parent=&quot;0&quot; /&gt;|" encoded="0">
+ </PIN>
+ </NODE>
+ <NODE componentmode="InABox" id="195" nodename="IOBox (String)" systemname="IOBox (String)">
+ <BOUNDS height="270" left="8925" top="12195" type="Node" width="2070">
+ </BOUNDS>
+ <BOUNDS height="330" left="8925" top="12195" type="Box" width="1815">
+ </BOUNDS>
+ <PIN encoded="0" pinname="Input String" slicecount="1" visible="0" values="|[3 - Timeliner]&cr;&lf;The &lt;node&gt;Timeliner&lt;/node&gt; node is a fantastic tool for advanced animations. Check out the help patch for it by creating the node and pressing &lt;key&gt;F1&lt;/key&gt; whilst it is selected.|">
+ </PIN>
+ <PIN pinname="Output String" visible="0">
+ </PIN>
+ <PIN pinname="Show Grid" slicecount="1" values="0">
+ </PIN>
+ <PIN pinname="String Type" slicecount="1" values="MultiLine">
+ </PIN>
+ <PIN pinname="Font" slicecount="1" values="|Arial Black|">
+ </PIN>
+ <PIN pinname="Size" slicecount="1" values="10">
+ </PIN>
+ <PIN encoded="0" pinname="Descriptive Name" slicecount="1" values="||">
+ </PIN>
+ </NODE>
</PATCH>
4 README
View
@@ -2,4 +2,6 @@ VVVV + MapTools : introduction to the tools of projection mapping
Start Date: October 8, 2011End Date: October 9, 2011
http://omniversity.madlab.org.uk/booking/?regevent_action=register&event_id=24&name_of_event=VVVV+++MapTools+%3A+introduction+to+the+tools+of+projection+mapping
-VVVV workshop files enclosed
+VVVV workshop files enclosed
+
+Currently these tutorials are missing important coverage of VVVV logic. But this would be outside the scope of this course, so I left it out for the time being.
13 html_resources/README.txt
View
@@ -0,0 +1,13 @@
+VVVV.Tools.MakeDocumentation
+https://github.com/elliotwoods/VVVV.Tutorials.Fundamentals
+
+This folder should be copied into the folder where you are creating your tutorials.
+e.g. for my fundamentals tutorials I make a copy of this folder at path
+/c/kimchiandchips/Workshops/VVVV.Tutorials.Fundamentals/html_resources
+
+where my folder structure is:
+
+kimchips@CHUO /c/kimchiandchips/Workshops
+$ ls
+VVVV.Tutorials.Fundamentals
+VVVV.Tools.MakeDocumentation
Please sign in to comment.
Something went wrong with that request. Please try again.