Overview

The VerkLabs designer app provides a creative visual environment for building, editing, and managing interactive 3D scenes and materials in your browser. It combines a Scene Viewer, a node-based Shader Editor (used for materials and 3D deformations), and a Storage System for managing projects, textures, sounds, and other assets.

Main Modules

The app is divided into several key modules:

• Scene Viewer – the main 3D workspace where you can navigate, manipulate, and preview your objects and animations.
• Pop-Out Menu – a collapsible control panel giving access to scene settings, camera tools, user info, and system actions such as saving, loading, and exporting.
• Shader Editor – a powerful node-based interface for creating and editing materials and position deformations that are compiled into shaders executed by the GPU.
• Node Menu – a categorized library of available node types, from basic math and color operations to advanced texture, sound, and animation nodes.
• Storage Directory – your cloud-connected workspace for managing projects, uploads, downloads, projects, and assets.

Scene Viewer

The Scene Viewer is your central window into the 3D world. You can simply enjoy the scene animations, or explore the scene interactively using mouse or trackpad gestures, control the camera focus, and interact with individual objects.

Use the Media Bar at the bottom to control playback. It disappears when you’re not moving the mouse, providing an unobstructed view.

Use the mouse or trackpad to:

• Move and rotate the camera
• Change focal point

Pop-Out Menu

At the top of the Pop-Out Menu sits a menu bar with quick controls: Save, Save As, Open, New, Home, and Share.

The Pop-Out Menu also includes:

• User Information & Settings
• Scene Settings
• Camera Animation Settings
• 3D Object List
• Object Properties

The 3D Object List shows all items in your scene, and the Object Properties Panel lets you fine-tune properties such as label, material, size, transparency, and animation parameters (position, rotation, orbit, scale, etc.).

Shader Editor

The Shader Editor provides a visual way to design materials and deformations using nodes interconnected in a node network.

You can:

• Select, move, and connect nodes
• Adjust their properties
• Create custom node types
• See live previews of your material outputs

Color-coded connections, warnings, and selection tools make it clear how data flows between nodes.

Node Menu

With the Node Menu, you can add nodes to your node network.

The Node Menu is grouped by category:

• Source Data, Source Values
• RGBA, HSLA, Numbers
• Mixing & Selecting Colors, RGBA Effects
• Vectors, Drawing, Texture Operations
• UV Operations, 3D Operations
• Animated Values, Environment Values
• Vertex Output
• Annotations, Custom Nodes

If your node network is becoming too complicated, or you have defined interesting behaviours you might want to reuse, you can select a subset of nodes and save them as a Custom Node that you can re-use throughout your project. Nodes can also be copied and pasted between different projects.

Storage Directory

You save your projects and assets in the Storage Directory. Here you can browse folders, filter or sort documents, and manage permissions or shared access. The Storage Directory also provides tools for editing document properties, uploading, and deleting assets.