Candidate construction guide · native Resolve not tested
Hard cut into the same interface
Concrete original SVG/code kit; mechanically testable, unrendered by this builder. Parent renders and independent source-first critique are separate. Source quality remains unresolved; no completed-example or variant-as-example credit.
Source and adaptation
Exact source: Introducing ChatGPT Atlas, publication date 2025-10-21; source frames [675,744), 30/1 fps, 69 frames, 1920x1080 design canvas.
Publication metadata, source-master hash and source frame mapping are inherited from the pinned queue, not a new online metadata or master verification. The retained source excerpt is research only; it is not an active dependency or part of the overlay.
Largest known gap: Original architectural vectors replace source property photographs; unbranded UI and chosen crop/typing values preserve the mechanism but not source material, precise geometry or text cadence. No fresh rendered comparison exists.
69 consecutive retained excerpt frames decoded and statically viewed in 5 sheets at480x270 per cell; four selected frames viewed at960x540. This is not moving review or master-resolution inspection.
Source observations
- measured; local frames [15, 16]: Frame 15 shows the wide browser context; frame 16 is an abrupt enlarged crop of its lower-right region. This is a cut, not a sampled smooth zoom.
- estimate; local frames [0, 15]: The wide browser floats on a blurred blue/lilac field. A property gallery occupies the left and a mostly empty conversation panel the right. A small context chip and input sit at the bottom of that panel. The window drifts slightly upward in the wide section.
- estimate; local frames [16, 28, 36, 68]: The close crop preserves the right panel and its lower-right rounded edge, while clipping much of the gallery and booking form off the left and top. Residual upward motion is small; scale and drift are not fitted source measurements.
- estimate; local frames [33, 34, 36, 48, 68]: The close input changes from placeholder to caret around frame 34, then types from about frame 36. The excerpt ends with a partial question, not a send action or result. Exact inter-key timings are not recovered.
Intentional differences
- Cedar Studio and Harbor Workshop replace source lodging photographs/branding with original architectural vectors and illustrative copy.
- The old PunchCut is a useful stepped-camera mechanism, but change=54, zoom=1.55 and focus=(0.66,0.64) are chosen old defaults. The new frame-16 cut is source-observed; magnification=2.4, offsets and drift are this adaptation, not fitted source numbers.
- The underlying architecture is shared across wide/detail. Secondary content replaces all gallery palettes and labels without changing the camera or text-box limits.
- Typing uses even two-frame character steps, not a recovered source keystroke schedule. The close crop retains deliberate offscreen clipping at top and left.
Run from the download
Start in a fresh extracted kit root with exactly these runtime files:
guide.json
README.md
handoff.py
controls.csv
overlay-manifest.json
core-publication-v08.zip
active-assets.zip
Use Python3.11+, Node22.18+, npm, unzip, FFmpeg/FFprobe and an existing supported Chromium. The core pins Remotion4.0.520 and the runtime lockfile. Set REMOTION_BROWSER_EXECUTABLE to your local Chromium if discovery fails. No private checkout, preparation script, authoring generator or inspection archive is required.
The core and active overlay both contain project/... members. Apply the selected overlay AFTER the core. The legacy assets-001.zip archives are not this kit; do not install them. The core font and its license remain required even though all active image/video media is SVG/code.
set -eu
test ! -e project
python3 -c "import hashlib,pathlib; assert hashlib.sha256(pathlib.Path('core-publication-v08.zip').read_bytes()).hexdigest() == '307fb6b927e35e6d73779652873d994f5c3e36cb7deba65f22fa64748057a0de', 'Core checksum mismatch'"
python3 -c "import hashlib,json,pathlib; manifest=json.loads(pathlib.Path('overlay-manifest.json').read_text()); assert hashlib.sha256(pathlib.Path('active-assets.zip').read_bytes()).hexdigest() == manifest['archiveSha256'], 'Overlay checksum mismatch'"
unzip core-publication-v08.zip
unzip -o active-assets.zip
python3 handoff.py verify --guide guide.json --project project
python3 handoff.py frames --guide guide.json --project project > controls-regenerated.csv
(cd project && npm ci)
Run the exact archived CLIs from project/. These are user-run commands, not a claim that the author rendered. No --fps, --duration or --output option is supported; cadence and duration come from the recipe.
cd project
node --experimental-strip-types scripts/catalog.mjs show hard-cut-crop --contract
node --experimental-strip-types scripts/render.mjs --help
node --experimental-strip-types scripts/verify.mjs --help
node --experimental-strip-types scripts/render.mjs --recipe hard-cut-crop --variant default --out out/hard-cut-crop-default.mp4
node --experimental-strip-types scripts/render.mjs --recipe hard-cut-crop --variant adaptation --out out/hard-cut-crop-adaptation.mp4
node --experimental-strip-types scripts/verify.mjs out/hard-cut-crop-default.mp4
node --experimental-strip-types scripts/verify.mjs out/hard-cut-crop-adaptation.mp4
cd ..
Keep each output manifest next to its movie. The CLI refuses to overwrite an output or sibling manifest. Verification is provenance/technical checking, not source-fidelity approval. New editorial holds would change the requested bounded example and are not part of this kit.
Edit the complete Content object
Create the file from the installed recipe, never from a stale example or a partial object. This refuses to overwrite an existing custom file:
cd project
node --input-type=module -e "import {readFileSync,mkdirSync,writeFileSync} from 'node:fs'; const recipe=JSON.parse(readFileSync('recipes/hard-cut-crop.json','utf8')); mkdirSync('inputs',{recursive:true}); writeFileSync('inputs/hard-cut-crop-custom.json',JSON.stringify(recipe.defaults,null,2)+'\n',{flag:'wx'});"
cd ..
Edit project/inputs/hard-cut-crop-custom.json, respecting every field and the limits in guide.json. Both variants are original illustrative content, not real product behavior. For image slots, keep the declared viewBox/aspect and SVG-only dependency rules. Then:
cd project
node --experimental-strip-types scripts/render.mjs --recipe hard-cut-crop --content inputs/hard-cut-crop-custom.json --out out/hard-cut-crop-custom.mp4
cd ..
Construction steps
- Unpack core-publication-v08.zip, then active-assets.zip with overwrite enabled. The overlay installs this selected recipe and only its active SVGs. Do not fetch any legacy assets-001.zip.
- Verify recipe and every default/adaptation SVG with the unchanged handoff.py. Export native controls.csv rows before editing; local frame zero is the queued source start, not source frame zero.
- Build all native UI parts as individual rectangles, ellipses, paths and text layers. SVG files contain original vector materials only; no layer may reference source footage, screenshots or embedded raster data.
- In Fusion, create a 1920x1080, square-pixel composition at the exact recipe cadence, with local start zero. Keep the full listed node/parent order and one global clock; intersect every child gate with all ancestor gates.
- Use transparent RGBA subgroups. Multiply group alpha once after child compositing. Make overflow:hidden a true alpha intersection before the group transform, not a Transform effect mask that limits only the transform.
- Use Geist from the core with the exact pixel sizes, line heights and explicit newlines. Content length caps are not font measurements. Test both contents using the installed font; reject overflow rather than shrinking.
- Build one browser-window subtree, not a wide screenshot and a separately drawn detail. Browser=(212,y,1496,1000), radius14, overflow hidden. Its y is40@0,32@15,32@16,28@40,28@68; 0..15 linear,15..16 hold,16..40 smoothstep,then hold.
- Inside the browser, construct tab strip, address bar, navigation, three search fields, heading and gallery. The gallery clip=(0,448,1080,360). Use the five original SVGs, with the large room at(0,0,540,360) and four 268x178.6666666667 thumbnails at x542/812,y0/180. Keep two-pixel gutters; original SVG viewBoxes remain600x400.
- Add property tabs and booking controls below the gallery. Put side-panel=(1080,106,416,894) above that page in the merge stack. Its composer-rule is y884; context-chip=(1099,902,276,40); prompt origin=(1140,960). Property heading and context label share the property slot.
- Parent all browser layers, including sidebar and text, to crop-camera. Keep the context SVG outside this camera. Camera uses top-left origin(0,0) and is exactly x0,y0,scale1 on [0,16); at16 it becomes x-2348,y-1544,scale2.4 through68. Use left-key hold interpolation; no intermediate magnifications, motion blur, optical flow or dissolve.
- For full-frame Fusion transforms with centered Pivot=(0.5,0.5), the camera detail Center is(-0.0229166666667,1.22962962963), Size2.4, Aspect1, Angle0. This implements outputPixels=(-2348,-1544)+2.4*inputPixels; use the same transform for the entire browser, not independent target pieces.
- Gate input-placeholder [0,34), then input-question [34,69). The question is empty at34, one character at36 and one extra every two frames through17 characters at68. The send disc is present throughout, but no click, send or response is authored.
- The close view intentionally clips the page at top and left. Browser camera is held through68, but the small internal y settle lasts to40 and typing continues. Never call the whole late interval a frozen frame or extend past exclusive69.
Fusion hierarchy and controls
This is an application-unverified construction map, not a .comp or .drp import. No native Resolve output exists from this worker. The full controls, exact paths, materials and text are in guide.json; the per-frame numeric sampler is controls.csv.
Use Background_Canvas -> the ordered root Merge chain -> MediaOut1. Build every group on transparent RGBA before its parent transform. A group fill is behind all of its children. Each row identifies the exact recipe node, parent, half-open local gate and local pixel box. Do not flatten the whole interface into an image.
| Layer / tool | Parent | Local gate | x; y; width; height |
|---|---|---|---|
| context-background / image | Canvas | [0,69) | 0; 0; 1920; 1080 |
| crop-camera / group | Canvas | [0,69) | 0:0 hold; 16:-2348 hold; 68:-2348 hold; 0:0 hold; 16:-1544 hold; 68:-1544 hold; 1920; 1080 |
| browser-window / group | crop-camera | [0,69) | 212; 0:40 linear; 15:32 hold; 16:32 smooth; 40:28 hold; 68:28 hold; 1496; 1000 |
| window-dot-1 / ellipse | browser-window | [0,69) | 24; 22; 12; 12 |
| window-dot-2 / ellipse | browser-window | [0,69) | 46; 22; 12; 12 |
| window-dot-3 / ellipse | browser-window | [0,69) | 68; 22; 12; 12 |
| window-paper / rect | browser-window | [0,69) | 0; 0; 1496; 1000 |
| tab-strip / rect | browser-window | [0,69) | 0; 0; 1496; 52 |
| active-tab / rect | browser-window | [0,69) | 100; 12; 380; 40 |
| tab-title / text | browser-window | [0,69) | 133; 24; 296; 25 |
| address-bar / rect | browser-window | [0,69) | 0; 52; 1496; 54 |
| site-address / text | browser-window | [0,69) | 600; 68; 280; 25 |
| site-brand / text | browser-window | [0,69) | 24; 128; 280; 38 |
| site-nav / text | browser-window | [0,69) | 382; 132; 655; 30 |
| nav-rule / rect | browser-window | [0,69) | 0; 204; 1080; 2 |
| search-location / rect | browser-window | [0,69) | 18; 243; 316; 50 |
| search-location-text / text | browser-window | [0,69) | 37; 256; 274; 28 |
| search-dates / rect | browser-window | [0,69) | 346; 243; 316; 50 |
| search-dates-text / text | browser-window | [0,69) | 365; 256; 278; 28 |
| search-guests / rect | browser-window | [0,69) | 674; 243; 295; 50 |
| search-guests-text / text | browser-window | [0,69) | 693; 256; 252; 28 |
| search-button / rect | browser-window | [0,69) | 980; 243; 88; 50 |
| search-button-label / text | browser-window | [0,69) | 988; 258; 74; 24 |
| property-category / text | browser-window | [0,69) | 18; 328; 520; 25 |
| property-title / text | browser-window | [0,69) | 18; 360; 1000; 52 |
| property-subtitle / text | browser-window | [0,69) | 18; 414; 1000; 25 |
| gallery-clip / group | browser-window | [0,69) | 0; 448; 1080; 360 |
| gallery-room / image | gallery-clip | [0,69) | 0; 0; 540; 360 |
| gallery-kitchen / image | gallery-clip | [0,69) | 542; 0; 268; 178.6666666667 |
| gallery-garden / image | gallery-clip | [0,69) | 812; 0; 268; 178.6666666667 |
| gallery-terrace / image | gallery-clip | [0,69) | 542; 180; 268; 178.6666666667 |
| gallery-cabin / image | gallery-clip | [0,69) | 812; 180; 268; 178.6666666667 |
| gallery-count-chip / rect | gallery-clip | [0,69) | 944; 305; 124; 40 |
| gallery-count / text | gallery-clip | [0,69) | 957; 315; 100; 26 |
| property-tabs / text | browser-window | [0,69) | 18; 824; 1000; 25 |
| detail-rule / rect | browser-window | [0,69) | 0; 862; 1080; 2 |
| rating-chip / rect | browser-window | [0,69) | 32; 893; 50; 38 |
| rating-value / text | browser-window | [0,69) | 38; 901; 40; 24 |
| rating-caption / text | browser-window | [0,69) | 95; 902; 382; 28 |
| features-line / text | browser-window | [0,69) | 32; 967; 590; 26 |
| booking-panel / rect | browser-window | [0,69) | 660; 878; 390; 165 |
| booking-title / text | browser-window | [0,69) | 684; 901; 344; 34 |
| arrival-box / rect | browser-window | [0,69) | 685; 951; 164; 52 |
| departure-box / rect | browser-window | [0,69) | 859; 951; 164; 52 |
| arrival-date / text | browser-window | [0,69) | 714; 967; 126; 27 |
| departure-date / text | browser-window | [0,69) | 888; 967; 126; 27 |
| side-panel / rect | browser-window | [0,69) | 1080; 106; 416; 894 |
| side-rule / rect | browser-window | [0,69) | 1080; 106; 2; 894 |
| composer-rule / rect | browser-window | [0,69) | 1082; 884; 414; 2 |
| context-chip / rect | browser-window | [0,69) | 1099; 902; 276; 40 |
| context-square / rect | browser-window | [0,69) | 1110; 913; 19; 19 |
| context-label / text | browser-window | [0,69) | 1137; 914; 226; 23 |
| composer-plus / path | browser-window | [0,69) | 1101; 959; 28; 28 |
| input-placeholder / text | browser-window | [0,34) | 1140; 960; 284; 28 |
| input-question / text | browser-window | [34,69) | 1140; 960; 284; 28 |
| composer-send / ellipse | browser-window | [0,69) | 1450; 953; 36; 36 |
| composer-arrow / path | browser-window | [0,69) | 1458; 961; 20; 20 |
Coordinates, easing and alpha
- Local x/y are pixels from the top-left of the parent, not the composition. All keys use the same native local frame f. For absolute source time use sourceStart+f, and for nominal seconds multiply by fpsDenominator/fpsNumerator. These are not measured master PTS.
- Use full 1920x1080 transparent domains for transforms, retaining needed offscreen material until the final canvas clip. For the phone, any material clipped below the domain is never translated back into view in this recipe. Do not reduce each layer domain to its visible bounding box before parenting.
- For zero-rotation local origin(ox,oy), sx=scalescaleX and sy=scalescaleY: bx=x+ox-sxox, by=y+oy-syoy. Output pixels=(bx+sxinputX,by+syinputY). Full-frame Fusion centered Pivot=(0.5,0.5) then uses CenterX=bx/1920+sx/2; CenterY=1-by/1080-sy/2. Use independent X/Y Size if scales differ. All authored rotations are zero; Angle sign would invert for CSS clockwise rotation.
- For a local rectangle center use ((x+w/2)/1920,1-(y+h/2)/1080), Width=w/1920, Height=h/1080. For rounded corners preserve the radius in pixel geometry; reconstruct a Bezier rounded rectangle rather than treating the Fusion Corner Radius knob as pixels. Every SVG path/viewBox and native icon path is preserved in the guide.
- Left-key hold means the left value persists strictly before the next key, and the right value begins exactly at that key. Smooth means uu(3-2*u), not Resolve default Auto or the older cubic Bezier(.16,1,.3,1). Bake controls.csv values as native-frame keys when an analytic expression is inconvenient.
- Masks change alpha before compositing. overflow:hidden plus radius clips descendants to the rounded rectangle; a radius alone only shapes the background of a group and is not an extra child clip. Keep the browser/screen/gallery clips in their local parent coordinate system.
- CSS rect borders lie inside their stated box. Native fallback uses an outer rounded mask minus an inset rounded mask of border thickness; do not expand the box with a centered outline. Whole-group opacity is applied once after child Over merges.
- Keep premultiplied RGBA consistent for Over. If a color operation needs straight alpha, unpremultiply then premultiply immediately around it. No arbitrary opacity compensation, Screen blend or black backing. The original SVG radial/linear gradients use local alpha stops.
- The free prompt shadow is a separate black rectangle with alpha0.07 and CSS blur24px. Fusion Gaussian radius is not assumed equal to CSS blur; compare that one material at full resolution. Other geometry remains sharp and motion blur is disabled.
- Geist text uses explicit line breaks and listed pixel boxes. Resolve Text+ font size/baseline and SVG gradient appearance need actual application calibration. Do not claim identical rasterization from a numerical sampler pass. Use held StyledText strings for the exact character prefix schedule if Write On counts differently.
- Use no optical flow, dynamic zoom, retiming, transition handles or synthesized audio. No extra frames precede or follow the source window. Final output is clipped to1920x1080, not scaled to fit it.
Editable SVG materials
Every SVG is generated from scratch by generate_assets.py. That optional source file can reproduce assets byte-for-byte when supplied; it is not a runtime prerequisite. The active archive already contains the required SVGs. No tracing, bitmap conversion, source master, remote resource, SVG image node or embedded font is present.
Rebuild each SVG as a vector subgroup using svgConstruction in guide.json: all viewBoxes, element attributes, paths, gradient coordinates, stop colors and opacities are explicit. Resolve SVG imports may lose paint/gradient semantics; do not assume a successful import is equivalent. Native Background/Polygon/Ellipse material layers are the fallback, not a screenshot export.
| Active SVG path under project/public | SHA-256 |
|---|---|
| art/hard-cut-crop/cabin-adaptation.svg | 45d0b7c37cd0fe987e0b9ca6f2381114f2a70943be4b0c0e002639d3641931fd |
| art/hard-cut-crop/cabin-default.svg | d0f8a623710250a2f5f5fd5db04ee68cc5b2e3df12d55c3c5e3f9ef66f5d1bf5 |
| art/hard-cut-crop/context-adaptation.svg | 8bf8ab1d71e6dab09c524c78528fe012ae500e5b1f0f4c97a32163613892b357 |
| art/hard-cut-crop/context-default.svg | 5e621e793036d9531b89f59a458b65041f04e8510e21793bfa499244fab64187 |
| art/hard-cut-crop/garden-adaptation.svg | d6996e37d4b23c39349263cc4e06f8bf96ef04b378c810956707a490c45e3385 |
| art/hard-cut-crop/garden-default.svg | 6e8500629ae5d60e637afb07ba200a8f11d3697063fd38af10ccd788e94b75c9 |
| art/hard-cut-crop/kitchen-adaptation.svg | ef9291e9b4e35b91da9e7b2306548ef4edd5ca8c687aff7113aebd92738012c9 |
| art/hard-cut-crop/kitchen-default.svg | 31b0d2d934cec8d80d62145e1080a7b0350a5fd9194c8d2c1e4cebbc7fabef4f |
| art/hard-cut-crop/room-adaptation.svg | dd9acad7a3cceb2a01afaecaeb43df163a06bb8ef0f59b478e6fd4c8b47a3066 |
| art/hard-cut-crop/room-default.svg | 099e5deaa54bbd379e54403fa4a131bcf4e81ed5f2141a0baa9715ce8a6bc5d7 |
| art/hard-cut-crop/terrace-adaptation.svg | d3c9cd4ed6823b05f3f84b7d7ddd7ab94c41287b14cb7c935c1eb52421b1d1df |
| art/hard-cut-crop/terrace-default.svg | 6752b55aa09a03d6d1e432adb798147510c0f0bd6a474887ed9557d534ff6bc3 |
Checkpoints and regression gates
| Local / source frame | Expected implementation state |
|---|---|
| 0 / 675 | Wide camera scale1; browser y40. |
| 8 / 683 | Wide frame, only small internal y drift. |
| 15 / 690 | Last wide frame; browser y32. |
| 16 / 691 | First detail: scale2.4,x-2348,y-1544. No intermediate crop. |
| 24 / 699 | Detail camera held; browser y is settling. |
| 33 / 708 | Last placeholder frame. |
| 34 / 709 | Placeholder off; empty question gate on. |
| 35 / 710 | Question remains empty. |
| 36 / 711 | One question character. |
| 40 / 715 | Browser y28 final pose; three question characters. |
| 52 / 727 | Nine question characters. |
| 64 / 739 | Fifteen question characters. |
| 68 / 743 | Seventeen question characters; no send. Exclusive end69. |
The focused test_guide.py is an authoring regression suite, not a required download step. It checks exact recipe/source/SVG pins, archive whitelist, deterministic SVG generation, hierarchy and masks, native/quarter-frame sampler agreement, all handoff rows, half-open cuts, content rejection and actual archived CLI options without rendering.
A human still needs to review parent-rendered default and adaptation outputs at native cadence, compare the source and validate the Fusion reconstruction. A contact sheet is not moving review.
Limits
- Original architectural vectors replace source property photographs; unbranded UI and chosen crop/typing values preserve the mechanism but not source material, precise geometry or text cadence. No fresh rendered comparison exists.
- No output render/encode, npm dependency installation, moving-source review, audio assessment, blind test or native Resolve execution was performed by this builder.
- Full native source masters were unavailable. Retained excerpts have960x540 pixels; 1920x1080 source dimensions and master hashes are inherited queue metadata.
- All historical source-quality status remains unresolved. Mechanical readiness does not approve material, typography, motion, source fidelity or production use.
- The core includes a licensed Geist font. This is SVG/code-only active imagery, not an assertion that the entire runtime contains no binary files.
- Only selected recipe and active SVG files belong in the overlay. No old asset pack, source master, private worker, dependency tree or critic output belongs in it.
- Text fit requires the actual loaded browser font; field length caps and numeric tracks alone cannot establish readability.
- Both content variants demonstrate one treatment, not two new examples. No shared counts, catalog entries or publication state are modified.
Historical inputs and source masters are provenance only. The downloadable run steps use only the listed kit files and installed tools. The source-only builder pass precedes any fresh critic findings; it does not accept its own visual quality.