It’s time to begin the process of getting Fugio out into the world.

If you’ve not been following its progress so far, Fugio is a visual programming system primarily designed for rapid development of digital art projects, with a view to being a highly flexible and educational platform that builds transferrable knowledge while not forcing anyone to write a single line of code (unless they want to!)

Fugio is completely free for anyone to use (and will be fully open source soon). It has taken me two years of hard work, time, and money to get it to this stage, and I’m very excited to finally share everything that I’ve been making.

As a lone developer, I haven’t had the luxury of a QA department testing all the code, so there’s definitely going to be some rough edges to begin with, hence this alpha release, which is aiming to catch as many common issues as possible before its full launch.

This first release is an extremely cut down version that only includes 42 basic nodes (the full version has around 200 nodes), but there is enough that we will be able to run through a short tutorial (below).

Please let me know if it does or doesn’t work. Also, all feedback (good and bad) is really important at this stage, so do please tell me!

Download

Click here to download Fugio

Installation for Windows

Double-click on the Fugio-1.x.x-WIN.zip to open the archive, which contains FugioInstaller.exe – run this to install.

Follow each stage of the installer. At this point you should just be able to accept the defaults.

Once the installer has finished, you can run Fugio by clicking on your Windows start button, going to the new Fugio entry, and clicking on the program icon to start the application.

If the application doesn’t start, try installing the Microsoft runtime that is included in the zip archive called vcredist_msvc2013_x86.exe

Installation for OSX

Double-click on the Fugio-1.x.x-OSX.dmg to open the archive, which contains FugioInstaller – run this to install.

Follow each stage of the installer. At this point you should just be able to accept the defaults.

Once the installer has finished, you can run Fugio by going to your Applications folder in Finder, going to the new Fugio directory, and clicking on the program icon to start the application.

If OSX complains that the application hasn’t been signed (it hasn’t) then either right-click on the application icon (or Ctrl+Left Click) and select Open from the menu. You’ll then see the same warning but this time with the option to run the application anyway.

Our First Patch

When you start Fugio you will see a welcome window. Click the OK button to continue.

You’ll be presented with the main editor window:

To start a new patch, go to the File Menu and click on New (or press Ctrl+N on Windows, or Command+N on OSX)

The new patch will open a window, where we can now add nodes.

There are several ways to do this but for now we’ll just double-click in the middle of the patch window. A new “Insert Node” window will appear. The first time you do this it will be completely blank. Start typing “Audio Output” (without the quotes) and you’ll see the names of nodes that match what you’re typing. Once you see “Audio Output (PortAudio)” at the top of the list, you can press return to add the node to the patch.

The node will appear in the middle of the patch. A node is a self-contained piece of code that has inputs and outputs. The one we have just added is for sending audio to your speakers or headphones.

It has two inputs (the little blocks on the left hand side, which we call pins), one for audio data, and one to set the overall volume of the audio being played. There is also a dropdown control to select which audio device on your computer to send the audio data to. This will almost certainly be different from the one in the picture above. You should be able to leave it as the default but feel free to change it if you need to.

You can move nodes around by dragging them around by their white title bars.

Add another node by double-clicking on the white space in the patch window. Make sure you don’t double-click on the node you’ve already added as this won’t work.

We’re going to add a slider to control the output volume. Start typing “Slider” into the window until “Slider (GUI)” appears at the top of the list. GUI stands for Graphical User Interface and means that it contains some type of thing you can visually control.

The slider has a single output pin (inputs are always on the left, outputs are always on the right), which is a number between 0 (zero) and 1. Hold the mouse cursor over the gray pin (not its name) and you should see a little popup that tells you some information about the pin, and in the case of numbers, it’s value, which is currently zero (as the slider control is all the way to the left).

Move the slider control to the middle, and hold the mouse cursor over the Number pin again, you’ll see the value has changed.

We’re now going to connect the output pin of the slider to the volume control of the audio output node.

Press the mouse cursor onto the slider’s Number gray pin and, while you keep your button pressed, drag the mouse away from the pin. If you have done this correctly, you’ll see a new link following the mouse cursor:

Drag the mouse to the Volume input pin of the Audio Output node. When you’re in the right place the link will turn gray (rather than red) to show that you can make this link. Release the mouse cursor.

If you’ve done this correctly, you’ll see the new link turn yellow (showing it’s now selected). Make sure it’s connected to the Volume pin (as above) and not the Audio pin.

As it’s currently selected, if you had made a mistake, you can press the Delete key (or Backspace on OSX) to delete the link.

Slide the slider all the way to the left (as above) to make sure the volume is set to zero (for now).

Double-click in the patch window to create a new node:

We’re going to add an audio signal generator. Double-click on the “Signal (Audio)” node in the list. If you add the “Signal (Number)” node by mistake, just press Delete/Backspace to delete it.

The new Signal node is going to generate an audio signal that we will be able to hear via the Audio Output node. Connect the Signal’s Audio pin to the Audio Output’s input pin, so it looks like this:

If everything is working, you should now be able to slowly move the Slider towards the right, and you should hear a tone playing. If you don’t, make sure your speakers/headphones are turned on and their volume isn’t set to zero. Alternatively try a different audio output device using the drop-down in the Audio Output node.

The Signal node can generate several kinds of audio signals. Let’s experiment with them. Add a new node (double-click on the path window) and add a “Choice” node:

Connect the Choice pin to the Signal Type pin:

The Choice node now lists the different kinds of signals that you can generate. Try selecting the different options. Put it back to Sine when you’re ready to move onto the next step.

We’re now going to play with the Frequency of the generated signal. Unlike the volume slider, the frequency value doesn’t go between zero and one. In fact, average human hearing lies between 20Hz and 20,000Hz (20kHz). Hertz (Hz) is the unit we use to count ‘cycles per second’.

We need to take the output of the slider and map its range to the frequency range we want to cover. We’ll use a “Number Range Map” node to achieve this.

Here we’re going to use a slightly lower range (20-8,000 Hz), but feel free to experiment.

Number Range Map takes an “Input Value” (which will be our slider value) that it expects to be within the range between “Input Min” and “Input Max”. By default these are set to zero and one respectively, which perfectly match the range of our slider, so we don’t need to change these values. What we do need to do is change the output range.

Move the mouse cursor over the input pin called “Output Min” and you’ll see its default value, which is currently zero. Right-click (or Ctrl+Click on OSX) on the pin’s gray box to bring up its menu, and choose “Edit Default”. Change the value to 20 and click on OK.

We now do the same with the “Output Max” pin and change the default value to 8000:

To see the effect of what we have just done, let’s add “LCD Number” node and connect it to the Output Value.

Add a new slider and connect it to the “Input Value”:

As you move this new slider, you will see the output number is 20 when the slider is at the far left, and 8000 when the slider is at the far right. Don’t worry if this is not entirely clear at this point – it’s not the most straightforward node to use but you will find it useful to quickly convert values between nodes.

We can now add a second link from the “Output Value” and connect it to the Signal’s Frequency input. Move the slider and hear the change in the sound.

The full patch should look like this (click on the image to zoom in):

That’s it for this first tutorial but even at this early stage there are plenty of other nodes to try out if you want to explore further.

In the Nodes window on the left of the editor is a full list of all the currently available nodes. Click on their names once to get further information and links to documentation. Double-click on the name to add it to the current patch window, or you can drag and drop it into the window.

If you have any feedback or questions, or were unable to complete the tutorial, please let me know via the comments of this post, or contact me here.

Share this: Email

Facebook

Twitter

Reddit

Pocket

