Permalink
Browse files

Up to 11th tutorial

  • Loading branch information...
1 parent a286062 commit 7173241eb011b05b93f1cf6c0a7ee6419b266f2d @elliotwoods committed Oct 6, 2011
View

Large diffs are not rendered by default.

Oops, something went wrong.
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -18,23 +18,23 @@
document.createElement('hold');
document.createElement('release');
</script>
-<link rel="stylesheet" type="text/css" href="MakeDocumentation/style.css" />
+<link rel="stylesheet" type="text/css" href="html_resources/style.css" />
</head>
<body>
-<img src="./1. IOBox.png" />
+<img src="C:\kimchiandchips\Workshops\VVVV.Tutorials.Fundamentals\1. IOBox.png" />
<h2>0 - IOBox</h2>
<p> The most basic input / output mechanism in VVVV is the <node>IOBox</node>. </p><p> There are different IOBoxes for different types of data (Value, String, Color, Enum, Node). </p><p> The most basic type of data is called a Value, which means a real number (note for programmers: this is currently represented by a double precision floating point value). </p><p> IOBoxes perform multiple roles: <ol> <li>Give opportunities for user input/output</li> <li>Holds data when no input is connected</li> <li>Perform access to inputs/outputs of subpatches (more on that later!)</li> </ol> </p>
<h2>1 - Drag right mouse button</h2>
-<p> Move your mouse cursor over the IOBox without pressing any buttons. Now hold down the right mouse button <hold/><rmb/>and drag up/down to change the value. </p><p> To move through values more slowly (more accuracy) hold down either <key>Ctrl</key> or <key>Shift</key> whilst dragging the right mouse button: e.g. <key>Ctrl</key>+<hold/><rmb/>. Hold down both to get even more accuracy <key>Ctrl</key>+<key>Shift</key>+<hold/><rmb/>. </p><p> To move through values more quickly hold down <key>Alt</key>+<key>Ctrl</key> or <key>Alt</key>+<key>Shift</key> whilst dragging the right mouse button. Hold <key>Alt</key>+<key>Ctrl</key>+<key>Shift</key> for maximum speed. </p><p> In VVVV, generally we use the right mouse button <rmb/> for interacting with Values and other datatypes. We use the left mouse button <lmb/> to change the patch itself.</p>
+<p> Move your mouse cursor over the IOBox without pressing any buttons. Now hold down the right mouse button <img src="html_resources/hold.png"/><img src="html_resources/rmb.png"/>and drag up/down to change the value. </p><p> To move through values more slowly (more accuracy) hold down either <key>Ctrl</key> or <key>Shift</key> whilst dragging the right mouse button: e.g. <key>Ctrl</key>+<img src="html_resources/hold.png"/><img src="html_resources/rmb.png"/>. Hold down both to get even more accuracy <key>Ctrl</key>+<key>Shift</key>+<img src="html_resources/hold.png"/><img src="html_resources/rmb.png"/>. </p><p> To move through values more quickly hold down <key>Alt</key>+<key>Ctrl</key> or <key>Alt</key>+<key>Shift</key> whilst dragging the right mouse button. Hold <key>Alt</key>+<key>Ctrl</key>+<key>Shift</key> for maximum speed. </p><p> In VVVV, generally we use the right mouse button <img src="html_resources/rmb.png"/> for interacting with Values and other datatypes. We use the left mouse button <img src="html_resources/lmb.png"/> to change the patch itself.</p>
<h2>2 - Double left click</h2>
-<p> The alternative way of changing the value is to double click on the IOBox <click2/><lmb/> to change the value by entering it with the keyboard.</p>
+<p> The alternative way of changing the value is to double click on the IOBox <img src="html_resources/click2.png"/><img src="html_resources/lmb.png"/> to change the value by entering it with the keyboard.</p>
<h2>3 - Editing using input pin</h2>
-<p> In general, we can edit the value of an input pin by right clicking on it <click/><rmb/>. We can also use right click drag <hold/><rmb/>. An IOBox is a very special type of node where the contents can effect the input pin. No other node will affect its input pin.</p>
+<p> In general, we can edit the value of an input pin by right clicking on it <img src="html_resources/click.png"/><img src="html_resources/rmb.png"/>. We can also use right click drag <img src="html_resources/hold.png"/><img src="html_resources/rmb.png"/>. An IOBox is a very special type of node where the contents can effect the input pin. No other node will affect its input pin.</p>
<h2>4 - When connected</h2>
<p> When an <pin>input</pin> is connected, then you cannot edit that input. Since altering the value of an IOBox would alter the value of an input, you cannot interact directly with the value of an IOBox when an input is attached.</p>
<h2>5 - Spreaded IOBoxes</h2>
<p> An <node>IOBox</node> can carry more than one <concept>Value</concept>. VVVV has a special way of dealing with several values at the same time, this is called a <concept>Spread</concept>. </p><p> Here we have an <node>IOBox</node> which works with 4 values. This is sometimes called a '4D vector' <node>IOBox</node></p>
<h2>6 - Shortcut to create IOBox</h2>
-<p> Since you'll be making these all the time, VVVV kindly gives you a shortcut to create a new <node>IOBox</node>. </p><p> To do this double right click <click2/><rmb/> in an empty area of the patch. This will give you a simple <node>IOBox (Value advanced)</node>. </p><p> A menu will also appear allowing you to create different types of <node> IOBox</node>.</p>
+<p> Since you'll be making these all the time, VVVV kindly gives you a shortcut to create a new <node>IOBox</node>. </p><p> To do this double right click <img src="html_resources/click2.png"/><img src="html_resources/rmb.png"/> in an empty area of the patch. This will give you a simple <node>IOBox (Value advanced)</node>. </p><p> A menu will also appear allowing you to create different types of <node> IOBox</node>.</p>
</body>
</html>
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -0,0 +1,32 @@
+<?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\10. DirectX 2.png" />
+<h2>0 - Quality settings</h2>
+<p> The <node>Renderer (EX9)</node> has plenty of settings hidden away in the <node>Inspektor</node>. Here are some of the ones you definitely want to become familiar with: </p><p> <ul> <li><pin>Fullscreen Depthbuffer</pin> - For 3D scenes you generall want to turn this 'on', i.e. choose a setting other than <b>NONE</b>. The <concept>Depth Buffer</concept> is what that graphics card uses to detect when objects are in front of each other, so it knows how to draw them properly</li> <li><pin>Fullscreen Dimensions</pin> - When you make your renderer fullscreen, this is the resolution that it will use. The renderer will become fullscreen on whatever screen it is on at that time, i.e. if you want it to come up on the second screen, you must drag the renderer window to there before going fullscreen. Also by doing this, you will have the correct list of resolutions for that screen</li> <li><pin>Fullscreen Antialiasing</pin> - This smooths the edges of objects, generally turn this on to make graphics look detailed and smooth. Depending on your graphics card different options will be available.</li> <li><pin>Windowed Depthbuffer</pin> - Same as <pin>Fullscreen Depthbuffer</pin>, but this option applies instead when the renderer is not fullscreen</li> <li><pin>Windowed Antialiasing</pin> - Same as above</li> </ul> </p><p> The most important thing most of the time is to make sure to turn on Antialiasing and Depthbuffer. </p><p> To demonstrate this, I've created 3 renderers at the side which share a common scene and a common camera. They each have different settings for <pin>Windowed Antialiasing</pin> and <pin>Windowed Depthbuffer</pin>. WARNING: The <node>Inspektor</node> locked inside this patch will block you opening up another <node>Inspektor</node>. But if you turn off the <b>Attached</b> button, then it will start acting like a normal <node>Inspektor</node> (albeit inside the patch rather than in a window).</p>
+<h2>1 - Multiple renderers</h2>
+<p> Here we're also demonstraing something that VVVV does effortlessly: </p><p> Rendering the same objects to multiple <node>Renderer</node>'s. </p><p> In fact, with VVVV you can mix and match <node>Renderer</node>'s however you like. It's a real strength of the platform. And something that isn't properly available on any other hardware accelerated platform for media arts use.</p>
+<h2>2 - Perfmeter</h2>
+<p> The <node>PerfMeter (Debug)</node> node gives you vital information about how your computer is performing and what is slowing it down. </p><p> The big number is the <concept>Framerate</concept> which is measured in <concept>Frames Per Second (fps)</concept>. You generally want this to be the same as your <concept>Refresh rate</concept> (commonly 60Hz, therefore 60fps is best). </p><p> The running graph is the history of your framerate, and the other graphs give you more detailed information as to what is taking up your processing time. </p><p> An ideal situation is generally a nice flat line at 60fps.</p>
+</body>
+</html>
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.

0 comments on commit 7173241

Please sign in to comment.