---
schema_version: 1
id: "modular-light"
name: "Modular Light"
summary: "A folded paper-and-aluminum lamp catalogue and numbered assembly workbench with real module, shade and light configuration."
family: "spatial"
tags: ["dimensional", "product-led", "geometric", "precise"]
best_for: ["products", "architecture", "portfolio"]
avoid_for: ["data"]
density: "balanced"
image_dependency: "low"
motion_level: "expressive"
complexity: "medium"
signature: {"composition": "A vertical collection title, broad central folded lamp and a narrow configure invitation; B a numbered parts rail and live assembly workbench beside controls.", "typography": "Large light grotesque collection typography and small monospaced assembly numbers, with clear practical sans-serif copy.", "navigation": "Visible principle, light and assembly destinations; B starts directly in a parts-to-configuration workbench.", "content_rhythm": "Catalogue spread, fold principle and three use scenarios versus numbered components, direct construction and an envelope ledger.", "imagery": "Original depth-tested WebGL polygonal lamp with folded opaque paper planes, matte aluminum joints and a visible directional light cone; truthful SVG fallback.", "color_and_material": "Warm white, graphite and butter yellow; sage material option, flat readable labels and finely separated joint lines.", "interaction": "Three to seven real modules, three shades and three purposes update geometry and concept dimensions, with undo, exact copy, download and validated unsent enquiry.", "motion": "Five modules assemble in 900ms, scenario cone and ambience interpolate, one-axis explosion returns on toggle and module edits briefly reflow; stable reduced state and pause."}
status: "ready"
prompt_path: "prompts/modular-light/prompt.en.md"
---

# Modular Light

## Intent

Modular Light explains an imagined lighting collection through the actual relationship between joined planes, illumination and configuration. The fictional Plivane is a concept demonstration, not a manufacturer, certified product or available stock. Visitors inspect a five-module paper and aluminum shade, try three lighting purposes and build a local configuration. The resulting dimensions are clearly concept envelope parameters, not engineering or electrical safety data. A separate enquiry can be prepared honestly without claiming delivery to a server.

## Signature

Preserve five invariants: visibly separate folded opaque panels; readable aluminum joins; a directional cone related to the selected purpose; a catalogue-scale object with vertical collection typography; and a numbered configuration route with reversible choices. These relationships carry the direction beyond butter yellow. The object stays still after each finite transition. Text, controls and dimensions remain flat ordinary HTML, so the product story does not become a 3D-only experience or an orbit-control exercise.

## Typography

Large light-weight grotesque display type gives the collection a contemporary catalogue voice. A uses vertical writing only for its large collection title on wide screens; mobile returns it to a normal horizontal heading. Arial and Helvetica system fallbacks keep Lithuanian text readable without external font files. Small monospaced component numbers and units remain clearly subordinate to headings. Paragraphs use a comfortable measure; practical labels retain normal casing, visible focus and enough room for translation.

## Color and surfaces

Warm white surrounds the object; graphite supplies readable text and the assembly panel. Butter yellow identifies the catalogue invitation and useful actions, while sage marks the material explanation and one selectable shade. The same generated tokens drive interface and original mesh colors. Matte paper and metal are stylized directional-shading interpretations, not measured material simulations. The light cone blends gently into a warm scene background. Essential text never sits over the variable cone or relies on that light for contrast.

## Layout A

A starts as a product catalogue spread: a vertical collection title on the left, a large central lamp, and a narrow invitation to configure on the right. A broad fold-principle section explains the panel, joint and assembled envelope. Three named uses change the light and their explanation. Care disclosures precede a dark assembly form and exact export area. The visitor understands material and purpose before editing. There are no testimonials, fabricated stock notices or interchangeable feature cards.

## Layout B

B starts at the assembly workbench. A numbered parts rail, central native object and adjacent dark controls create an inspect-to-build task immediately. A text component list and an explicit one-axis explosion make the relationship between flat modules and the assembled shade readable. Purpose choices and a dimensional ledger follow before enquiry. The visitor constructs first and checks the concept record afterwards. This changes hierarchy, navigation and content sequence from A rather than merely moving its catalogue panels.

## Imagery

All geometry is original code: each opaque paper module has a central crease, two broad planar faces and a visible metal joint. Five modules initially create a polygonal shade around a small aluminum suspension. Three to seven modules change the actual mesh and width. A translucent native cone and ground footprint express purpose, without pretending to be photometric evidence. An original SVG of the same folded lamp is shown if WebGL is unavailable; module and shade choices still update that illustration.

## Navigation and interaction

Use visible principle, light and assembly links, and a real sibling-layout link. Module buttons are bounded from three to seven, shade choices change the visible paper, and purpose changes cone width, ambience and descriptive text. A small undo history reverses configuration edits, including count. Copy and download always export the exact current readable summary, with a manual selection fallback if clipboard access fails. The additional enquiry validates trimmed required fields and produces a clearly unsent local text draft.

## Motion

Opening assembles the five modules along a single axis in 900 milliseconds and stops. Selecting reading, evening or work changes the cone and warm background over a short bounded episode without a flash. The assembly toggle separates modules along the same axis with numbered markers and returns them on a second action. Changing count briefly reflows geometry; undo restores the previous configuration. Reduced motion applies final poses immediately, while pause, offscreen suspension, hidden-document handling and cleanup prevent continuous work.

## Responsive behavior

At 1440 pixels the catalogue spread retains three unequal zones and a large complete shade. The workbench keeps its numbered rail separate from the object and controls. At 768 the title becomes horizontal and the narrow invitation moves below the object; workbench controls follow the scene before the ledger. At 390 and 360 all controls remain large, labels wrap and the full product stays in the bounded scene. The phone never rotates the object automatically or requires dragging to reach information.

## Accessibility

Provide one main landmark and h1, a skip link, ordered headings and native buttons with pressed state. The canvas has an informative label and adjacent textual component and purpose descriptions. Number markers repeat information available in the ordinary component list rather than becoming an exclusive visual legend. Visible focus works on warm white and graphite surfaces. Form errors use native validation and honest local status. Actual checks cover resources, contrast, keyboard, widths and reduced/fallback modes; they do not claim universal certification.

## Adaptation

Replace the fictional collection and concept parameters with approved project content. Retain the inspectable joining logic, purposeful light and reversible count-to-envelope relationship in another platform. A verified product can supply real dimensional and electrical data only when the owner provides evidence. Another modular object can use its own authored panels while keeping the catalogue-versus-workbench distinction. The full public creation brief includes project, audience, content and stack placeholders; the demonstration remains usable when these fields are left empty.

## Avoid

Exactly three deviations damage this direction: replacing the folded module construction with a smooth glowing blob; adding perpetual rotation or flashing illumination that competes with reading; and exporting a stale configuration or presenting concept dimensions as verified production specifications. Keep joins and plane count visually inspectable. Do not add fictitious checkout, certification, client reviews or a successful enquiry send. The scene is an original illustrative product study and its controls must remain useful without WebGL.

## Closest styles

Industrial Spec uses dimensioned orthographic views and a comparison document; Modular Light uses an illuminated depth-tested object, a vertical catalogue spread and a reversible construction workbench. Its navigation edits purpose and count rather than switching between static drawing records. Soft Spatial uses rounded clay volumes, diffuse shadows and an object-to-practice sequence. Here folded polygonal planes, explicit joins, numbered components and exact configuration export change imagery, structure and task. Compare actual desktop and mobile results rather than accepting a palette-only distinction.