Three Render

Three Render brings real-time WebGL visualisation to BeeGraphy via a compact set of Three.js helper nodes. It is aimed at designers who want to add complexity, context and depth to their parametric models without leaving the node editor: panel perforation, large instanced arrangements, and human scale reference are all available as simple, composable nodes.

Node Groups

Three Render

The core group provides scene-level utilities for visualising and enriching geometry.

• Perforated Panel — takes a mesh and applies a shader-driven hole pattern to its surface. It is ideal for quickly testing perforation densities, hole sizes and pattern layouts on facade or product designs without committing to destructive geometry operations. The original geometry stays intact; the perforation is purely visual, so the node can be tuned interactively while rendering.
• Instanced Mesh — places a single geometry at a list of positions as a GPU-friendly InstancedMesh. This is the right choice for repeating elements such as facade fins, seating rows, panels, tiles, or any array where the base geometry is identical. It dramatically reduces scene overhead compared to creating one mesh per instance.
• Scale Figure — inserts a simple human silhouette into the scene. Useful for communicating real-world proportions in screenshots, for checking clearances and ergonomics in product or architectural models, and for presentations where a familiar reference helps viewers read the scale of a design immediately.

Example Graphs

Perforated shade screen

Connect a planar surface to the geometry input of Perforated Panel, and a slider to its hole-size and spacing parameters. As the slider changes, the panel’s perforation density updates live in the viewport, making it easy to balance openness and shading for a facade shade screen. Combine the result with Scale Figure to confirm that the panel size is comfortable relative to a person standing nearby.

Repeating facade fins

Create one fin profile as a closed curve, extrude it to a solid, then pass the solid to Instanced Mesh together with a list of positions from a linear array. The result is a full run of identical fins rendered efficiently as a single draw call. Use Scale Figure in the same graph to check that the fin spacing and overall height read correctly against a human figure.

Tiled product display

To preview a modular product line, place several instances of a parametrically deformed tile in a grid using Instanced Mesh. Overlay a Perforated Panel on a backdrop surface to suggest retail or exhibition context, and add Scale Figure for a quick sense of size in the final presentation view. The nodes stay independent, so adjusting the tile definition updates every instance automatically.