Launch App

VerkLabs Designer Reference Manual

Build interactive 3D scenes, shaders and music in your browser

Object Properties

This chapter covers the Node Editor’s own title bar, and the Properties panel it opens. Both work at the level of whichever single object is currently open in the Node Editor. For controls that work at the project level instead, see the Project Settings chapter.

Learn it by doing. These lessons walk you through it, step by step, in the editor:

Materials with attitude (about 35 minutes): Give a torus a glossy material, a glowing rim and an oil-slick sheen that shifts with the view, and let a floor fade into the distance with fog.
Start lesson · Follow the coach
A cloud of particles (about 40 minutes): Work with a cloud of thousands of points: give each its own color, make them rise in an endless stream, shrink as they go, and swell with the beat.
Start lesson · Follow the coach

Node Editor Title Bar

The Node Editor’s own title bar sits above its node graph, and gives you:

More Actions

A drop-down with:

  • Undo – undoes the last change in the node graph.
  • Delete Selected – deletes the currently selected node(s).
  • Create Custom – saves the current node graph as a reusable Custom Node.

Properties

Opens the Properties panel for the object currently open in the Node Editor (see below).

Add Node

Opens the Node Menu, for adding nodes to the graph.

Scale to Fit

Zooms and pans the node graph so every node is visible.

Snap to Grid

Toggles whether nodes snap to a grid as you move them.

Transparency

A slider that adjusts the Node Editor’s own background transparency – useful while Floating, so you can still see the scene behind it. Not shown while Side by Side, since there’s nothing behind it to reveal there.

Switch Object

The object name in the middle of the title bar is a drop-down – click it to switch the Node Editor to a different object’s node graph without leaving the editor. The back arrow next to it steps back out to the parent graph, when the current one is nested (e.g. inside a Custom Node).

Side by Side / Float

Switches the Node Editor’s own layout between Side by Side (splitting the screen with the Scene Viewer) and Floating (a draggable, resizable panel on top of it) – the icon and label always show which one clicking it would switch to. The 3D/Objects button in the Canvas Top Bar (see Project Settings) opens and closes the Node Editor; this button only changes how it’s laid out, and remembers your choice for next time.

Close

Closes the Node Editor.

Properties

Opened via the Properties button in the Node Editor’s own title bar (above). Shows the properties, orientation, and vertex shader settings of whichever object is currently open in the Node Editor.

Object Properties

  • Type – the type of object (e.g. Sphere or Box).
  • Label – the object’s label, as shown in the Objects list and in the Node Editor.
  • Active – whether the object is shown in the scene.
  • Geometry – for particle-based objects sampled from another object’s surface, which object to sample from.
  • Shaders – click the edit button to open the Node Editor for the material and deformations of the object. With the Copy from… drop-down, you can copy a shader from another object in the scene.
  • Parameters – basic size and segment resolution parameters for the object.
  • Build Recipe – only visible for a Builder object. With the Builder, a new object is built from a recipe, a JSON structure that describes a particular kind of object. This is an experimental section under development; the Builder can create complex structures that would be hard to create manually.
  • Scale – a quick way to resize the object. The absolute size is determined by the scale and the size set in Parameters above.
  • Speed – the animation speed for the object. Each object has its own clock for its Time nodes, which runs at this speed. An object made while the scene is running starts on the scene’s clock, so objects that move in step with each other (a moon round a planet) stay in step. Stopping and starting the Runsheet sets every clock back to the start.
  • Transparency – whether the object is transparent. Use if the material isn’t fully opaque.
  • Clickable – whether the object can be selected from the scene viewer.
  • Hidden – hides the object without deleting it (distinct from Active above, which controls whether it’s rendered at all).
  • Recalc. Normals – recalculates surface normals from the deformed geometry, so shading responds correctly to shader-driven deformations.
  • Throws Shadow – whether the object casts a shadow (see Light & Shadow).
  • Feedback – whether the object’s previous frame is fed back into its own shader, for feedback/trail effects.
  • Wireframe – visualizes all vertices and edges from which the object shape is built. Note that if deformations are applied with a shader, they will not be visible in the wireframe.
  • Material Sides – which side(s) of the object use the material. A side without material is not visible. Since many objects (like a sphere or a box) are only seen from the outside, applying the material to the Front side is often enough.

Object Orientation

  • Position – click the Position Editor button to enable the position editor, so you can move the object around in the Scene Viewer. You can also enable it by holding Shift while clicking the object. Three arrows appear in the x, y, and z directions when it’s active (zoom out if you don’t see them – they grow with distance). Drag the object itself to move it along an imaginary surface perpendicular to your line of sight, or drag one of the arrows to move it along a single axis. Enabling the Position Editor turns off the Focal Point.
  • Rotate (around Y), Tilt (around X), Roll (around Z) – the object’s orientation.
  • Orbit Plane, Orbit Speed, Orbit Radius, Orbit Ratio (B/A), Orbit Helper – an object can orbit along an ellipse in the scene; these determine how and at what speed. Use the Orbit Plane Editor to reorient the plane of the orbit (shown as a grid of blue squares, with the plane’s normal shown as a yellow axis) by dragging the green or red arrow, and the Orbit Helper checkbox to show/hide it. For more flexibility and closer integration with your shaders, use the orbit nodes in the Node Editor instead.
  • Rotation Axis, Rotation Speed – an object can rotate around an axis; the Rotation Axis Editor orients the axis (shown in yellow, dragged via its red and green arrows), and Rotation Speed determines how fast it rotates. For more flexibility and closer integration with your shaders, use the rotation nodes in the Node Editor instead.
  • Orbit Around – makes the object orbit around another object. The other object might itself orbit, creating nested paths (like a satellite orbiting a planet).

Vertex Shader

  • Point Size – for point-based geometry (e.g. particles), the size of each point.