sneaker-unboxing is a creator studio for producing one specific deliverable: a realistic, aesthetic sneaker unboxing video in vertical 9:16, shot as a POV clip in which hands slowly open a blue shoebox, reveal the exact white sneakers with black stripes, grey suede toe and gum sole, and gently lift the sneaker for close-up detail shots — under soft natural window sunlight, on a black fluffy rug, with smooth handheld camera movement, realistic hands, no face, no text, and a premium product-review style.
The product intent is drop-culture anticipation rather than SaaS efficiency: the shoe is the product, the interface is the packaging, and the creator is a hype-adjacent reviewer who wants their output to look like a release, not a render. Because the video itself must contain no face and no text, all typographic energy lives in the studio around the 9:16 stage.
The audience is a single active human role: the Sneaker Unboxing Creator — one person producing a vertical POV unboxing clip of a specific white low-top with black stripes, grey suede toe and gum sole, and needing the finished asset to preserve the original shoe design and box exactly.
The system is a first-party web studio with application-owned identity. An anonymous visitor lands on a public entry surface that explains what the studio produces; a creator establishes identity through self-service enrollment, and returns through verification to resume durable generation and delivered-video state. Once inside, the creator composes a request (sneaker, shoebox, aspect ratio, premium product-review intent), runs the realistic POV opening and sneaker-reveal generation workflow, owns generation and review of the gently lifted sneaker close-up segment, applies the requested environmental and camera conditions (window sunlight, black fluffy rug, smooth handheld movement, realistic hands, no face, no text), and receives the finished vertical video for viewing or download.
Backend execution is required: the requested source design and box must be preserved and a finished asset produced, which is not achievable as a purely client-side interaction.
Actors
Narrow exclusions
Delivery ownership. The studio is first-party custom UI owned by the application. The creator's request, generation control, close-up segment review, condition settings and final delivery all live in the application's own surfaces. Video generation itself is backend execution owned by the system; the creator interacts with it through the application's generation surface and observes its progress and result there.
Access ownership. Identity is application-owned. The public entry surface is anonymously reachable and explains the product before identity establishment. Self-service enrollment and returning verification are the two access boundaries; the protected working surfaces (Request, Generate, Details, Settings, Delivery) require an established identity so that durable generation and delivered-video state remain bound to the correct creator and can be resumed on return. The entry interaction that establishes access is never owned by a protected destination.
Current vs. future. Everything in this document is current. No future-horizon requirements were accepted in the authoritative thread; nothing here is deferred.
Boundary discipline. The studio produces the video; it does not publish, distribute, schedule or monetize it, and it does not manage a shoe catalogue, inventory, orders or shipping. Those are outside the accepted scope.
Not applicable — no reference directive in this project declares content_source authority.
The page inventory is the supplied final page contract, preserved exactly and in order: Landing, Sign Up, Login, Request, Generate, Details, Settings, Delivery.
UNBOX. headline resting on a full-width shoebox-blue band; the literal blue-bordered 9:16 stage rectangle overlapping that band and bleeding off the bottom edge; rotated punched-hole tag labels reading 9:16, POV, NO FACE, NO TEXT; a single orange GENERATE pill CTA with a blinking dot; a marquee ticker of quoted constraint strings (WHITE LEATHER, BLACK STRIPES, GREY SUEDE TOE, GUM SOLE, WINDOW LIGHT, BLACK FLUFF); hazard-stripe section dividers.FR-1 — Generate a realistic aesthetic sneaker unboxing video in vertical 9:16. (explicit) As a Sneaker Unboxing Creator, I should generate a realistic aesthetic sneaker unboxing video in vertical 9:16 aspect ratio, so that I have a finished clip in the format my audience watches.
FR-2 — POV camera with hands slowly opening the blue shoebox. (explicit) As a Sneaker Unboxing Creator, I should generate a POV shot in which hands slowly open the blue shoebox, so that the clip opens with the unboxing moment in first-person view.
FR-3 — Reveal the exact white sneakers with black stripes, grey suede toe and gum sole. (explicit) As a Sneaker Unboxing Creator, I should have the reveal show the exact white sneakers with black stripes, grey suede toe and gum sole, so that the clip shows the actual shoe rather than an approximation.
FR-4 — Gently lift the sneaker and show close-up details. (explicit) As a Sneaker Unboxing Creator, I should generate a segment in which the sneaker is gently lifted and close-up details are shown, so that the clip includes a macro detail pass on the shoe.
FR-5 — Soft natural window sunlight lighting. (explicit) As a Sneaker Unboxing Creator, I should have the generation lit with soft natural window sunlight, so that the clip reads as a real window-lit shoot rather than a studio render.
FR-6 — Black fluffy rug setting. (explicit) As a Sneaker Unboxing Creator, I should have the generation set on a black fluffy rug, so that the clip's ground matches the intended look.
FR-7 — Smooth handheld camera movement. (explicit) As a Sneaker Unboxing Creator, I should have the generation use smooth handheld camera movement, so that the clip feels like a real handheld shoot.
FR-8 — Realistic hands. (explicit) As a Sneaker Unboxing Creator, I should have realistic hands appear in the generation, so that the unboxing reads as a genuine human action.
FR-9 — Preserve the original shoe design and box. (explicit) As a Sneaker Unboxing Creator, I should have the original shoe design and box preserved exactly, so that the clip represents the real product without restyling.
FR-10 — No face visible. (explicit) As a Sneaker Unboxing Creator, I should have no face visible anywhere in the video, so that the clip stays faceless as required.
FR-11 — No text in the video. (explicit) As a Sneaker Unboxing Creator, I should have no text anywhere in the video, so that the clip stays text-free as required.
FR-12 — Premium product review style. (explicit) As a Sneaker Unboxing Creator, I should have the video produced in a premium product review style, so that the output looks like a release rather than a render.
FR-13 — Self-service enrollment before protected video creation. (required_inference) As a Sneaker Unboxing Creator, I should complete self-service enrollment before protected video creation, so that my generation and delivered video state are retained and I can return to them.
FR-14 — Returning verification to resume durable generated video state. (required_inference) As a Sneaker Unboxing Creator, I should complete returning verification to resume or retrieve my durable generated video state, so that I can pick up prior generation and delivered video after leaving.
FR-15 — Backend execution preserves the requested source design and produces the finished asset. (required_inference) As a Sneaker Unboxing Creator, I should have backend execution preserve the requested source design and produce the finished asset, so that the delivered video actually matches the shoe and box I specified.
Product context. A single creator producing one specific deliverable: a realistic, aesthetic sneaker unboxing video in vertical 9:16, shot as a POV clip. Their recurring work is generating the POV unboxing clip — hands slowly opening the blue shoebox, revealing the exact white sneakers with black stripes, grey suede toe and gum sole, then gently lifting the sneaker for close-up detail shots under soft natural window sunlight on a black fluffy rug. They are hype-adjacent: they want their output to look like a release, not a render.
Primary goal. A finished, realistic vertical video that preserves the original shoe design and box, with no face and no text, in a premium product-review style.
Distinct accepted responsibilities. This role is the sole initiator and controller of every accepted capability: composing the request (sneaker, shoebox, aspect ratio, style intent), running the POV opening and reveal generation, owning generation and review of the gently lifted close-up segment, applying the environmental and camera conditions, and viewing or downloading the finished video. No other human role shares or splits this work.
Relevant inputs and decisions. The sneaker specification (white low-top, black stripes, grey suede toe, gum sole), the shoebox specification (blue shoebox), the fixed vertical 9:16 aspect ratio, the premium product-review style intent, and the condition set (window sunlight, black fluffy rug, smooth handheld movement, realistic hands, no face, no text). The creator decides when a produced segment matches the request and when to re-run generation.
Interactions with other accepted participants. The creator is the only active human participant. Their counterpart is the generation backend, which executes the video generation and persists durable state; the creator observes its progress and results through the generation, close-up and delivery surfaces and re-runs it when a result does not match. There is no other human handoff, approval or receipt in the accepted scope.
Observable success. A finished vertical 9:16 video plays in the delivery stage and downloads successfully; it shows the POV opening of the blue shoebox, the exact specified sneaker, the gently lifted close-up, window sunlight, the black fluffy rug, smooth handheld movement and realistic hands, with no face and no text, and it preserves the original shoe design and box.
UNBOX. headline resting on the full-width shoebox-blue band, with the literal blue-bordered 9:16 stage rectangle overlapping it and bleeding off the bottom edge, and the rotated punched-hole tags reading 9:16, POV, NO FACE, NO TEXT.WHITE LEATHER, BLACK STRIPES, GREY SUEDE TOE, GUM SOLE, WINDOW LIGHT, BLACK FLUFF) and understands what the studio produces.GENERATE pill CTA.Muse and headline. Virgil Abloh — industrial label language for a premium sneaker unboxing studio. The headline idea: the product is the shoe, the interface is the packaging. The shoebox is literally the design system: industrial tags, quoted labels, hazard stripes, exposed seams, safety orange on concrete grey.
Mode. Dark mode only.
Colour tokens (exact hex, by role).
| Role | Token | Value |
|---|---|---|
| Background (concrete-black ground) | --bg | #121212 |
| Surface (raw-tag grey) | --surface | #1C1C1C |
| Text (bone white) | --text | #F2F2F0 |
| Primary (shoebox blue — flat field, never a button fill on white) | --primary | #1B4FD8 |
| Accent (safety orange — one per screen) | --accent | #FF4D00 |
| Muted (metadata, timestamps, tag strings) | --muted | #8A8A85 |
| Hairline rule | --rule | #2A2A2A |
Ratio. Roughly 70% black/grey, 22% box blue, 8% orange. Nothing is a gradient; every field is a flat plane separated by a hairline or a stripe.
Typography.
+0.02em at display sizes and +0.14em at label sizes, quoted with literal quotation marks ('UNBOX.', '9:16', 'NO FACE'), tight leading 0.92 so stacked lines lock together like a shipping label. Display sizes: clamp(52px, 11vw, 168px) for the hero word, clamp(28px, 5vw, 56px) for section heads. Never sentence case, never medium weight.+0.14em; data numerals in Space Grotesk tabular.Shape language. Hard 0px corners on type blocks and colour fields; 2px on inputs; 999px only for the single record pill. Everything reads as packaging: hairline 1px rules at #2A2A2A, 8px hazard-stripe bands, exposed 1px grid lines that run past content edges, tag rectangles with a punched 6px hole, and a diagonal cut (clip-path polygon) on one corner of media cards. No soft shadows, no glass, no rounded cards.
Spacing rhythm. Sections are separated by full-bleed hazard-stripe rules rather than whitespace. A vertical-first 9:16 stage column (max 420px) is centred on a 12-column desktop grid, flanked left by a fixed rail of rotated label text and right by a metadata block of tag strings. At 375px the stage goes full-bleed and the rails collapse into a top ticker and a bottom tag row; at 768px the stage sits left with metadata stacked right; at 1280px the three-column label/stage/metadata arrangement appears.
Imagery style. Real product photography only, shot as evidence: the blue shoebox lid mid-lift, the white sneaker with black stripes and grey suede toe on black fluff, macro of the gum sole edge, a hand entering frame from the bottom. All images sit inside flat colour blocks with hard crops and 1px borders; some are half-covered by a hazard stripe or a quoted label tag as if the frame were taped. No illustration, no 3D blobs, no stock people, no faces.
Accessibility. Readable text and controls stay whole at 375px, 768px and 1280px — headlines, wordmarks, labels, numbers, card text and controls stay entirely inside the viewport and their container, wrapping or scaling (for example font-size: clamp(...) with its mobile size) to fit, and no other element covers any part of them. Imagery, decoration and motion may be cropped, bled off an edge, rotated, overlapped or cut as the direction asks, provided they cover no readable text or control.
The first screen is not a centred SaaS hero — it is a shipping label.
A full-bleed #121212 ground carries an oversized 'UNBOX.' in Archivo Black at clamp(52px, 11vw, 168px), flush-left, its baseline sitting directly on a solid #1B4FD8 band that spans the full viewport width and is 18% of the screen height. The vertical 9:16 video stage overlaps that blue band on the right and bleeds off the bottom edge of the viewport, wrapped in a 2px #1B4FD8 border with a punched-hole tag label reading '9:16 / POV / NO FACE' rotated 90° along its left edge. Bottom-left sits a single #FF4D00 pill CTA 'GENERATE' with a blinking dot, and beneath it a horizontal marquee of quoted constraints. The dominant element is the type-and-colour-block stack, not the video.
Signature moves, implementable as specified:
'UNBOX.' headline whose baseline rests on a full-width #1B4FD8 colour band that the 9:16 video stage overlaps and bleeds off the bottom edge.'9:16', 'POV', 'NO FACE', 'NO TEXT'.#FF4D00 / #121212 bands) replace whitespace between every major section, and the primary CTA is the only orange element on its screen.'WHITE LEATHER', 'BLACK STRIPES', 'GREY SUEDE TOE', 'GUM SOLE', 'WINDOW LIGHT', 'BLACK FLUFF') crossing the viewport edge, wrapping to static rows under prefers-reduced-motion.Avoid. Any gradient, glassmorphism, blur panel or soft drop shadow; rounded 16–24px cards with hover-lift in a grid; blue-on-white or indigo primary buttons — the blue here is a flat field (#1B4FD8), never a button fill on a white ground; Inter, Roboto, Helvetica, Poppins or system-ui for headings or body; faces, models or any human head in photography (hands only, entering from the bottom edge); readable text baked into the video frame — all type lives in the studio UI around the 9:16 stage; centred headline + subtext + button hero composition; more than one orange element visible per screen. The generic indigo/blue-on-white SaaS template is forbidden for this project.
Interaction Model: Animated Motion Tempo: expressive Hero Dimensionality: flat
Landing Hero Motion Brief
'UNBOX.' headline whose baseline rests on the full-width #1B4FD8 band, with the blue-bordered 9:16 stage rectangle overlapping that band and bleeding off the bottom edge of the viewport.'WHITE LEATHER', 'BLACK STRIPES', 'GREY SUEDE TOE', 'GUM SOLE', 'WINDOW LIGHT', 'BLACK FLUFF') crosses the viewport edge continuously. The outcome is a first frame that reads as packaging: the visitor understands the format and the constraints before reading a single sentence.cubic-bezier(0.2, 0.8, 0.2, 1) for entrances, hard cuts rather than fades, a continuous horizontal marquee ticker of quoted tag strings, a stamp-in scale (1.06 → 1.0 with 2px overshoot) on the primary CTA, and a blinking orange record dot.#121212; 'UNBOX.' flush-left at clamp(52px, 11vw, 168px) with its baseline on the #1B4FD8 band; the 9:16 stage overlapping the band on the right and bleeding off the bottom edge, wrapped in a 2px #1B4FD8 border with the rotated punched-hole tag '9:16 / POV / NO FACE' along its left edge; bottom-left the single #FF4D00 'GENERATE' pill with its blinking dot; beneath it the marquee of quoted constraints.prefers-reduced-motion all marquees become static wrapped rows, the stage renders at 1.0 with no scroll scaling, the record dot stops blinking, and the CTA appears at its final scale — the same composition, fully readable and fully operable.NFR-1 — Vertical 9:16 aspect ratio. (explicit) The generated video must be vertical 9:16. This is a hard constraint on the deliverable, not a preference; the studio's layout treats the 9:16 stage as its structural motif. Rationale: the source states the aspect ratio explicitly.
NFR-2 — No face visible in the video. (explicit) The generated video must contain no visible face. Rationale: explicit hard constraint in the authoritative source.
NFR-3 — No text in the video. (explicit) The generated video must contain no text. All typographic energy lives in the studio UI around the 9:16 stage. Rationale: explicit hard constraint in the authoritative source.
NFR-4 — Preserve the original shoe design and box exactly. (explicit) The generated video must preserve the original shoe design and box; the studio must not restyle, recolor or substitute them. Rationale: explicit hard constraint in the authoritative source.
NFR-5 — Realistic hands only. (explicit) Only realistic hands may appear on camera; no visible person or head. Rationale: explicit hard constraint in the authoritative source.
NFR-6 — Durable generation and delivered-video state. (required_inference) Generation runs and delivered videos must persist and remain bound to the creator's identity so that a returning creator can resume or retrieve them. Rationale: required to make the accepted resume-and-retrieve journey executable.
NFR-7 — Backend execution for video generation. (required_inference) Video generation must execute server-side; preserving the requested source design and producing the finished asset is not achievable as a purely client-side interaction. Rationale: required to make the accepted generation capability executable.
NFR-8 — Readable text and controls stay whole. (explicit, from the creative direction)
At 375px, 768px and 1280px, headlines, wordmarks, labels, numbers, card text and controls must stay entirely inside the viewport and their container, wrapping or scaling to fit, with no other element covering any part of them. Moving and scrollable content may cross the viewport or container edge by design, provided every item becomes fully readable as it passes; under prefers-reduced-motion a usable static arrangement must be provided. Rationale: explicit accessibility rule in the creative direction.
NFR-9 — Reduced-motion support. (explicit, from the creative direction)
Under prefers-reduced-motion, all marquees become static wrapped rows and the 9:16 stage renders at 1.0 with no scroll scaling. Rationale: explicit motion rule in the creative direction.
docker-compose.yml as the runnable-service inventory — the frontend and the single backend, plus the database. Video generation runs inside the existing backend process; a separate queue worker is added only if generation latency requires asynchronous execution, in which case it is a distinct process in the same compose file.Assumptions
Constraints
Presentation and technology defaults [Default — not specified by user]
#1B4FD8).#FF4D00 / #121212 band used as a section divider in place of whitespace.No completed page designs yet.
Completed design pages will appear here when they are ready to preview.
No completed page designs yet.
Completed design pages will appear here when they are ready to preview.
No comments yet. Be the first!