lens-studio-volumetric-drawing
Volumetric Drawing
Lens Studio's VolumetricLine package allows you to create high-quality 3D tubes by extruding circular cross-sections along a path. Unlike simple 2D lines, these have actual volumetric geometry that responds to lighting, can be capped, and uses spline interpolation for perfect smoothness.
Creating a 3D Line
To define a path, you provide an array of SceneObject points.
const line = this.sceneObject.getComponent("Component.VolumetricLine");
// Define the control points in the room
line.pathPoints = [pointStart, pointMid, pointEnd];
// Configure quality
line.radius = 2.0; // Thickness in cm
line.circleSegments = 16; // Hoop detail
line.interpolationSteps = 10; // Spline smoothness
line.smoothness = 0.5; // Tension
// Color and Material
line.material = myNeonMaterial;
line._color = new vec3(0, 1, 1); // Cyan
Spline Interpolation (Catmull-Rom)
The package utilizes Catmull-Rom splines to ensure that the line passes smoothly through every control point without sharp corners.
// Internal math pattern for spline calculation
function catmullRom(p0: vec3, p1: vec3, p2: vec3, p3: vec3, t: number) {
// Spline tension math...
return resultPos;
}
Debug Gizmos
For visualizing spatial relationships without committing to full geometry, you can use the Line gizmo, which provides a performant 2D line that renders in 3D space with gradient support.
const gizmo = this.sceneObject.getComponent("Component.Line");
gizmo.startPointObject = userHand;
gizmo.endPointObject = targetObject;
gizmo.beginColor = new vec3(1, 0, 0); // Red
gizmo.endColor = new vec3(0, 0, 1); // Blue
Performance Tips
- Interpolation Steps: High values (>20) significantly increase vertex count. Stay low unless the path is very long.
- Continuous Update: If the points aren't moving, disable
continuousUpdateto save CPU and GPU cycles. - Mesh Topology: Default is set to Triangles. Use
RenderMeshVisualto tint and shade.
Reference Examples
The code logic below is extracted from the official VolumetricLine.lspkg and RuntimeGizmos.lspkg packages.
See the reference guides:
More from rolandsmeenk/lensstudioagents
spectacles-networking
Reference guide for the Lens Studio Fetch API and WebView component in Spectacles lenses — covering InternetModule (Lens Studio 5.9+), Fetch API via internetModule.fetch(Request) with bytes/text/json response handling, performHttpRequest, Internet Access capability, GET/POST requests, custom headers, Bearer auth, polling, timeouts, CORS/HTTPS, WebSocket and RemoteMediaModule for media from URLs, and bidirectional WebView messaging. Use this skill for any lens that calls a REST API, polls a JSON endpoint, loads remote images, embeds a webpage, or talks to a custom backend — including the Fetch sample. Use spectacles-ai for LLM/RSG calls, or spectacles-cloud for Supabase/Snap Cloud integration.
6lens-studio-vfx
Reference guide for Lens Studio's VFX Graph particle system — covering VFXComponent setup (VFX asset vs Component relationship), reading and writing .asset.properties to pass data into a VFX graph at runtime (position, color, float, direction vectors), particle system inspector settings (emitter rate, lifetime, shape, blending, world vs local simulation space), spawning particles from script (trigger emission via properties), sending scene object transforms and screen-space data to VFX, and common VFX bugs (type mismatches on properties, asset null checks). Use this skill whenever a lens needs particle effects, camera-reactive or gesture-driven VFX, attaching effects to face/body tracking anchors, or connecting real-time data (position, audio levels, expression weights) into a VFX graph.
5lens-studio-2d-ui
Reference guide for 2D UI and screen-space interaction in Lens Studio — covering ScreenTransform anchors/offsets/size/pivot and coordinate conversions (localPointToScreenPoint, screenPointToLocalPoint, localPointToWorldPoint), ScreenImage (texture, stretch mode, color tint), Text component (content, font, alignment, color, size), ScreenRegionComponent for defining tap/touch areas, TouchComponent with TouchStartEvent/TouchMoveEvent/TouchEndEvent, tap input for phone lenses, LSTween UI animations (colorTo, moveTo on screen elements), multi-swatch color picker pattern, undo stack pattern, and common gotchas. Use this skill whenever a lens needs a 2D UI panel, tap interaction, on-screen buttons, text labels, color pickers, swipeable menus, or undo/redo — covering Drawing, Quiz, TappableQuestion, MemeSticker, MusicVideo, and HighScore examples.
5spectacles-snapml
Reference guide for on-device machine learning in Spectacles lenses using SnapML — covering MLComponent inspector configuration, supported model formats (TFLite/ONNX), input tensor shape setup, synchronous (runImmediate) and asynchronous (runScheduled) inference patterns, parsing SSD/YOLO bounding box output tensors, INT8 quantization for NPU performance (avoid FP32 layers), low-pass filter smoothing to reduce jitter, ObjectTracking3D for persistent tracking, and integrating detections with physics colliders. Use this skill whenever a lens needs to run a custom ML model on Spectacles without a cloud call, or when debugging input-shape mismatches — including SnapML Starter, SnapML Chess Hints, SnapML Pool. Use spectacles-ai instead if the model runs in the cloud via RSG.
4spectacles-mocopi-integration
Connect Sony Mocopi motion capture hardware to Spectacles using WebSockets for real-time skeletal tracking.
2