specs-build-ui

Use SpectaclesUIKit components composed through FlexLayout or GridLayout inside a TypeScript BaseScriptComponent. Create a Component.Canvas at the root, add a Frame or BackPlate surface, offset content +0.6 cm in Z, and place the panel at z=-110 cm for full binocular overlap.

Frame is a movable, billboarded window with drag, resize, and close/follow buttons, while BackPlate is a lightweight static panel with no interaction. Use Frame for windowed UI and BackPlate for static panels whose size is driven by FlexLayout's onLayoutComplete event.

Frame initializes on OnStartEvent, so disabling its host SceneObject synchronously in onAwake prevents initialization entirely. Build all content inside frame.onInitialized.add and make enabled = false the last statement of that callback, and set autoShowHide = false.

Creating GridItem or FlexItem components is necessary but not sufficient; the layout only positions children registered via layout.addItems(). GridLayout does not reliably auto-discover children, especially for content built inside frame.onInitialized, so always call addItems explicitly.

No. The root Canvas uses Hierarchy sorting, so render order is determined by depth-first SceneObject hierarchy position, and manual renderOrder values fight that pass and cause flicker. Fix z-fighting with a +0.6 cm content offset and by ordering siblings in the hierarchy instead.

Do not invoke it standalone for a full from-scratch Specs experience; that flow belongs to the lens-studio-router orchestrator which coordinates meshes, audio, and scene construction. Standalone use is correct only when the project is already set up and you want a single UI module added.