1. NodeBox 3
    1. Homepage
    2. NodeBox 3Node-based app for generative design and data visualization
    3. NodeBox OpenGLHardware-accelerated cross-platform graphics library
    4. NodeBox 1Generate 2D visuals using Python code (Mac OS X only)
  2. Gallery
  3. Download
  4. Documentation
  5. Forum
  6. Blog

Exploring Nodes

Spirograph Example

Let’s make a drawing based on the Spirograph principle.

In short: we will create a shape and copy it a few times on top of each other with a difference in rotation.

Exploring Spirograph

Create a freehand node and draw a small line in order to have a reference for the rest of the procedure. You can draw by clicking and dragging the mouse in the viewer pane.

Create a reflect node node and send the output of freehand1 to it. Watch out: there are two reflect nodes, we need the one with the black icon.

Create a copy node and send the output of reflect1 to it.

Render copy1 and click once on freehand1. Start drawing something and see the spirograph appear. Not pleased with the result? You can start over and clear the path by pressing the clear button of the path parameter.

Try out:

Exploring Spirograph Advanced

A pattern example.

Creating patterns is fairly easy in NodeBox 3.

Let’s create an example:

Create two polygon nodes.

The idea is to create a pattern that can be easily changed by using a seed parameter.

Create two wiggle nodes and connect polygon1 to wiggle1 and polygon2 to wiggle2.

We will generate a new shape based on the two shapes by using a binary operation.

Create a compound node and send wiggle1 to shape1 input and wiggle2 to shape2 input.

A key node for building networks that create patterns is the align node. It allows you to change the center point of a geometry. The base for these operations on the vertical and horizontal axes is the origin which you can toggle on/off in the viewer pane.

Create one and send compound1 to it.

Now create a (black) reflect node to make a reflection of the shape.

Create a copy node to create a few copies. Connect reflect1 to it.

The result should look like this:

Pattern step 1

Add a colorize node to give the shape a color.

Now we will create a grid node to multiply the pattern on a horizontal axis.

Now add a translate node to the network and send the pattern (copy1) to the shape port and grid1 to the (blue) translate port.

Finally add another copy node and send translate1 to it.

Rendering the copy2 node should return this result:

Pattern step 2

Try out:

Seed 1 Seed 2 Seed 3

One of the seeds sent to a compound node (together with an ellipse) and cut out by using a CNC-cutter:

CNC

A shape example.

Nodebox contains a few nodes that enable users to create a new shape. An interesting one is the coordinates node which can create a point based on an angle and a distance from a point. Let’s see what we can do with it.

Create a sample node and

Create a coordinates node and send the sample1 node to the angle port. Leave the distance parameter at its default value of 100. You should get a result like this:

Spiral step 1

At this moment all points are at an even distance of the orgin point. We will change this by using another sample node. Create one and

Send it to the distance port of the coordinates node. The coordinates node returns a list of points, to create an actual path send it to a connect node. Turn the closed parameter off so it does not connect the first point with the last one. This is your result:

Spiral step 2

Other shapes can be created by using another set of numbers for the distance and/or angle parameter.

Create a range node and

This returns a list of these numbers: 50, 60, 70, 80. Now create a reverse node to reverse the above list. Now send both lists to a combine node resulting in a new list (50, 60, 70, 80, 80, 70, 60, 50). Send the combine node to the distance port of the coordinates node. Render the connect node again and have a look at the result:

Coordinates star

Play around with the parameters of the range and sample nodes. The following shape was created by changing the parameters.

sample node:

range node:

Coordinates gear

Next Steps

Now that you’ve seen a few examples, you can: