# Contact & tension — interactive 3D component

Canonical root: https://brand.nikuniku.ai/assets/rebrand-kit-v0.1/artwork/interactive/ . Read `interactive-artwork.json` at the kit root for exact asset IDs, complete dependency paths and hashes. `demo.html` is a working self-hosted example, not a placeholder.

The browser renders actual evaluated Blender mesh positions, corner normals, physical thickness and ribs. It does not rotate a flat image. The 61 finished PNG/SVG/MP4/GIF artworks remain available separately. This is original authored branding, never model-output evidence. The fixed logo and typography remain in the static cover; only the sculpture region is rendered live.

## Reuse without guessing

1. Copy this whole folder and its relative paths. Keep `vendor/LICENSE.txt` and `vendor/SOURCES.json`. Serve over HTTPS with JavaScript modules enabled; `file://` does not support the fetch/module component.
2. Copy the `[data-sculpture]` figure, controls, stylesheet and module references from `demo.html`. Retain the relative poster image path and static fallback. Do not replace the whole page or mutate engine/runtime model IDs.
3. All network requests stay on the host serving these files. There is no CDN, provider API, account, telemetry or storage call. Runtime requires WebGL2. Reduced-motion/no-JS/unsupported/failed loading retain the complete static cover. The rest of the kit works offline; the interactive example needs a local static server.
4. Tune only the bounded constants in `sculpture.js` after checking performance and motion. Current slow rotation is .045 rad/s, pointer influence .18/.08 rad, bounded scroll .495 rad, pixel ratio <=1.5. Pause freezes input and rotation; reset restores the initial view. Offscreen and hidden-tab rendering stops.
5. For geometry changes edit the original `../source/contact-study.blend`, then run the included export script in Blender: `blender -b ../source/contact-study.blend --python export-mesh.py -- --output .`. This exports meshes only; it does not render images or call a model. Regenerate the binary and metadata together, update all hashes, and inspect every angle. Material color triples are linear RGB.
6. For another engine, preserve its LICENSE/NOTICE, technical IDs, runtime behavior and original output evidence. This component is website branding; it does not modify an engine binary or fabricate an architecture. Use exact `interactive.*` IDs and keep the dependency set together.

## Acceptance

Check real GPU drawing, pointer/scroll response, pause/reset, reduced motion, no-JS, mobile touch scrolling, failed mesh loading, context loss/retry, resize/200% text, actual download hashes and console/network health. Do not interpret a rendered canvas as physical-device performance certification. No trademark/final brand approval is implied. Three.js0.184.0 is pinned MIT source, vendored unchanged with npm SHA512 and individual SHA256 provenance. Refreshing vendor files is an explicit developer action via `fetch-vendor.py`; normal builds never access the network.

## Computed image and motion examples

Read `../../computed-motion.html` and `computed_examples` in the manifest. The optional `data-procedural` mode evaluates the original surface equations in a GPU vertex shader, including finite-difference normals and .035 shell thickness. It does not reproduce Blender bevels/Cycles exactly. `parametric.mjs` contains the CPU surface evaluator, GPU equations and the shared timeline. Add `data-sequence` for the4-second title sequence; it starts paused, supports seek and plays once. Copy the labelled controls from the example. Tension range0–1, seek range0–4 seconds; retain all fallbacks, pause and licenses. Source geometry and brand mark remain distinct. Existing MP4s are prior Blender exports, not matching exports of this new sequence. Real footage and model outputs remain encoded content with original provenance; procedural packaging cannot replace that evidence.