VHS Slipcover Maker

Build the following focused alternative to VHS Slipcover Maker. This is a deliberately limited personal or small-team substitute, not parity with the paid service.

WORKING SLICE
Design a measured printable VHS wrap with front, spine, back and flaps, place user artwork and export a print-size SVG/PDF.

SETUP AND ARCHITECTURE
Use Vite, React, SVG and a versioned downloadable project file with URL state for small text/style settings. Prerequisites: A browser, user-owned cover artwork, measured physical template dimensions and access to a printer for the intended paper size. Before integrating anything, record actual versions and permissions, plus model files or provider limits only where used, in the README; make unavailable dependencies visible rather than simulating success.

DOMAIN MODEL AND INVARIANTS
Store TemplateDimensions, Panel, TextStyle and ImageCrop; physical units are authoritative and the spine/panel/fold lines derive from the selected measured template.

IMPLEMENTATION CONTRACT
Maintain one document model for preview, undo and export. Use stable element IDs; save after completed gestures, handle storage quota errors and provide explicit file backups. Provide an input/setup view, the main work view, and a review/export view appropriate to this workflow. Preserve the last saved state if a job or save fails. Include empty, loading, permission-denied, partial and retryable-error states. Log identifiers and error categories without secret values or unnecessary private content.

APP-SPECIFIC BOUNDARY AND RECOVERY
Start with one VHS template before other media formats. Store images in a downloadable project rather than huge URLs; do not claim every manufacturer's case has identical dimensions or that a decorative barcode is usable.

ACCEPTANCE SCENARIO
Print a calibration ruler at 100 percent and compare the wrap with the actual case; adjust dimensions explicitly and keep crop/artwork placement stable. Also reopen the app after an interrupted operation, confirm the saved record/export remains inspectable, and document the recovery action. These are implementation acceptance requirements, not a claim that this guide has been tested.

DELIVERY
Deliver a runnable repository with migrations or project-format versioning, a non-sensitive example, environment/permission setup, the exact manual acceptance steps, and a backup/export-and-restore walkthrough. Implement the working slice before optional integrations; list any deferred paid-product capabilities honestly. Do not add capabilities outside the working slice just to resemble the original product.

PROJECT RULES FOR AGENTS.md
Keep the domain invariants above executable at the write boundary. Propose scope changes before adding providers or permissions. Never fabricate source evidence, publish results, identity matches or successful delivery. Preserve user originals and require an explicit confirmation for destructive changes or external publication.

# AGENTS.md — Build guide for VHS Slipcover Maker

## Project scope
Design a measured printable VHS wrap with front, spine, back and flaps, place user artwork and export a print-size SVG/PDF.

Catalogue verdict: kinda. The core loop, type a title and print a correctly sized VHS slipcover, is a one-session build. But the rich design possibilities, range of 30+ physical media types, 22+ languages supported, and instant generation of covers from a variety of media sources makes this a lengthy project to spin up on your own. That part is not coming out of one prompt.
Use the implementation prompt below to define the deliverable. Complete each phase's acceptance checks before extending the scope.

## Working agreement
- Inspect the repository and its existing instructions before choosing paths, dependencies or commands. Keep one coherent stack and explain changes to the proposed architecture.
- Plan a vertical slice that accepts a real input and produces the useful output described below. Persist only the state the prompt calls for; respect memory-only and upstream-managed workflows. Use fixtures only when they are clearly labelled.
- After scaffolding, document the actual install, development, check and build commands in README and keep them synchronized with the package or project manifest. Do not report commands as successful unless they ran.
- Work in small steps. At handoff, list implemented flows, checks actually performed, remaining blockers, and any credentials or provider setup the owner must supply.
- Do not publish, spend money, contact customers, delete source data or run irreversible migrations without the project owner's authorization.

## Prerequisites
- Runtime and tools: Vite, React, SVG and a versioned downloadable project file with URL state for small text/style settings.
- Before starting: A browser, user-owned cover artwork, measured physical template dimensions and access to a printer for the intended paper size.

## Stack and architecture
- Vite, React, SVG and a versioned downloadable project file with URL state for small text/style settings
- Data design: Store TemplateDimensions, Panel, TextStyle and ImageCrop; physical units are authoritative and the spine/panel/fold lines derive from the selected measured template.
- Setup: A browser, user-owned cover artwork, measured physical template dimensions and access to a printer for the intended paper size

## Security and data integrity
- Maintain one document model for preview, undo and export. Use stable element IDs; save after completed gestures, handle storage quota errors and provide explicit file backups.
- Start with one VHS template before other media formats. Store images in a downloadable project rather than huge URLs; do not claim every manufacturer's case has identical dimensions or that a decorative barcode is usable.
- Keep secrets outside client bundles and exported projects; document what leaves the device and make retention/deletion controls visible.

## Agent implementation rules
- Project rule — domain: Store TemplateDimensions, Panel, TextStyle and ImageCrop; physical units are authoritative and the spine/panel/fold lines derive from the selected measured template.
- Project rule — scope and recovery: Start with one VHS template before other media formats. Store images in a downloadable project rather than huge URLs; do not claim every manufacturer's case has identical dimensions or that a decorative barcode is usable.
- Project rule — acceptance: Print a calibration ruler at 100 percent and compare the wrap with the actual case; adjust dimensions explicitly and keep crop/artwork placement stable.
- Project rule — delivery: document real setup commands and permissions; do not claim a build, accuracy level, performance result or security certification that has not been demonstrated.

## Optional agent skills and references
- Recommended skill: [vercel-composition-patterns](https://github.com/vercel-labs/agent-skills/blob/main/skills/composition-patterns/SKILL.md) — separate document tools, property inspectors and export controls into explicit reusable React components. Follow the maintainer's installation instructions and match its requirements to the chosen runtime.
- Recommended skill: [web-design-guidelines](https://github.com/vercel-labs/agent-skills/blob/main/skills/web-design-guidelines/SKILL.md) — review keyboard access, focus, validation, error recovery and the readable work/review interface or HTML report. Follow the maintainer's installation instructions and match its requirements to the chosen runtime.

Read the linked SKILL.md and its dependencies before adding a skill. Select only the skills matching this project's runtime and task; their documentation does not supply API access, credentials or approval to perform external actions. Pin the reviewed revision where the tool supports it. Follow the chosen agent's documented project-level installation mechanism.

## Distribution ideas
These are optional planning notes. Obtain the owner's approval before publishing or contacting anyone.
- Demonstrate this working slice using synthetic or explicitly authorized non-sensitive examples: Design a measured printable VHS wrap with front, spine, back and flaps, place user artwork and export a print-size SVG/PDF.
- Share a synthetic example export and the acceptance walkthrough; keep real customer, health, financial and source data private: Print a calibration ruler at 100 percent and compare the wrap with the actual case; adjust dimensions explicitly and keep crop/artwork placement stable.
- State the limits before asking someone to replace their existing tool: Start with one VHS template before other media formats. Store images in a downloadable project rather than huge URLs; do not claim every manufacturer's case has identical dimensions or that a decorative barcode is usable.

## Engineering roadmap
1. Phase 1 — Pin the working slice and create its example input: Design a measured printable VHS wrap with front, spine, back and flaps, place user artwork and export a print-size SVG/PDF. Confirm setup: A browser, user-owned cover artwork, measured physical template dimensions and access to a printer for the intended paper size.
2. Phase 2 — Implement persistence and write-time invariants before decorating the UI: Store TemplateDimensions, Panel, TextStyle and ImageCrop; physical units are authoritative and the spine/panel/fold lines derive from the selected measured template.
3. Phase 3 — Connect the working view to real saved state. Maintain one document model for preview, undo and export. Use stable element IDs; save after completed gestures, handle storage quota errors and provide explicit file backups.
4. Phase 4 — Expose the app-specific limits and recovery path in context: Start with one VHS template before other media formats. Store images in a downloadable project rather than huge URLs; do not claim every manufacturer's case has identical dimensions or that a decorative barcode is usable.
5. Phase 5 — Walk through this concrete acceptance case and preserve its exported evidence: Print a calibration ruler at 100 percent and compare the wrap with the actual case; adjust dimensions explicitly and keep crop/artwork placement stable. Finish the README and backup/restore instructions; report unfinished capabilities explicitly.

## Paid-product capabilities outside this build
- 30+ measured dieline templates: cassette J-cards, CD inserts, vinyl jackets, Blu-ray and DVD wraps, MiniDisc
- movie and music search that auto-fills cover art and metadata
- designs that persist and share as a URL
- die-cut label-sheet PDFs aligned to vendor sticker stock
- 22 UI languages

## Implementation prompt
Build the following focused alternative to VHS Slipcover Maker. This is a deliberately limited personal or small-team substitute, not parity with the paid service.

WORKING SLICE
Design a measured printable VHS wrap with front, spine, back and flaps, place user artwork and export a print-size SVG/PDF.

SETUP AND ARCHITECTURE
Use Vite, React, SVG and a versioned downloadable project file with URL state for small text/style settings. Prerequisites: A browser, user-owned cover artwork, measured physical template dimensions and access to a printer for the intended paper size. Before integrating anything, record actual versions and permissions, plus model files or provider limits only where used, in the README; make unavailable dependencies visible rather than simulating success.

DOMAIN MODEL AND INVARIANTS
Store TemplateDimensions, Panel, TextStyle and ImageCrop; physical units are authoritative and the spine/panel/fold lines derive from the selected measured template.

IMPLEMENTATION CONTRACT
Maintain one document model for preview, undo and export. Use stable element IDs; save after completed gestures, handle storage quota errors and provide explicit file backups. Provide an input/setup view, the main work view, and a review/export view appropriate to this workflow. Preserve the last saved state if a job or save fails. Include empty, loading, permission-denied, partial and retryable-error states. Log identifiers and error categories without secret values or unnecessary private content.

APP-SPECIFIC BOUNDARY AND RECOVERY
Start with one VHS template before other media formats. Store images in a downloadable project rather than huge URLs; do not claim every manufacturer's case has identical dimensions or that a decorative barcode is usable.

ACCEPTANCE SCENARIO
Print a calibration ruler at 100 percent and compare the wrap with the actual case; adjust dimensions explicitly and keep crop/artwork placement stable. Also reopen the app after an interrupted operation, confirm the saved record/export remains inspectable, and document the recovery action. These are implementation acceptance requirements, not a claim that this guide has been tested.

DELIVERY
Deliver a runnable repository with migrations or project-format versioning, a non-sensitive example, environment/permission setup, the exact manual acceptance steps, and a backup/export-and-restore walkthrough. Implement the working slice before optional integrations; list any deferred paid-product capabilities honestly. Do not add capabilities outside the working slice just to resemble the original product.

PROJECT RULES FOR AGENTS.md
Keep the domain invariants above executable at the write boundary. Propose scope changes before adding providers or permissions. Never fabricate source evidence, publish results, identity matches or successful delivery. Preserve user originals and require an explicit confirmation for destructive changes or external publication.

## Completion evidence
Demonstrate the prompt's acceptance scenarios against the scoped workflow. Include setup from a clean checkout and failure recovery. Check persistence across restart and export/restore only for the state the prompt says to store; for memory-only tools, confirm that temporary content is discarded as specified. Record actual results and remaining limitations. A detailed plan alone does not establish a working replacement.