# Sports art direction — draft 03

## Brief and acceptance

Replace the repetitive portrait/rectangle treatment with six genuinely different compositions. Show a full-body photographic NBA action cutout with ball and both shoes intact. Play actual NBA highlights inside landscape, portrait and story social frames. Preserve PlayStat's supplied logo, Poppins headline, navy #01024F and green #0AEB7D. No website changes or publication.

## Design contract

- Court vision: clear left-aligned type, a diagonal graphic and a full-body player on the right. Short caption below; no paragraph footer.
- Editorial profile: warm white field, left column headline, contained player at right, fine divider and small source.
- Green edition: dominant brand green, giant navy jersey number, player silhouette overlapping the number, compact headline.
- Matchup: opposing dark/light halves and authentic team marks. Explicit illustrative matchup; no invented fixture or score.
- Highlight cover: action still in a large 16:9 window with distinct masthead and headline below.
- Film notes: split evidence image and court-diagram field; diagram is illustrative, never presented as player tracking.

Keep credits outside the art in the library, with a short reference-study/source line on exported art. One title, one subject, one supporting graphic. Never cover the face, ball, shoes, broadcast scoreboard or player movement with annotations.

## Sources

Firecrawl read the public Hawks page and its original structured metadata:
https://www.nba.com/hawks/videos/jalen-throws-down-several-highlight-reel-dunks-in-hawks-loss-in-los-angeles

Title: Jalen throws down several highlight-reel dunks in Hawks loss in Los Angeles. Published 19 March 2024 UTC. Archive game, not a current fixture. The original page exposes 320p, 540p and 720p MP4 renditions; use the 1280×720 rendition. This is Jalen Johnson footage, separate from the LeBron poster study.

Full-body photo reference: FreePNGimg, asset 93881. The category identifies LeBron James; the image shows a full-body Lakers dribbling pose with both shoes and ball. Original PNG is 1804×2700 with a real alpha channel. Supplied by Thelma Carr according to the source page, which labels CC BY-NC 4.0. Photographer and underlying sports publicity rights are not independently established; this remains an internal design reference, not a production-cleared asset.
https://freepngimg.com/png/93881-golden-basketball-player-warriors-lakers-angeles-los
https://creativecommons.org/licenses/by-nc/4.0/

The file is unaltered. SVG viewport framing removes transparent outer margins; it does not redraw the player. Attribution: Thelma Carr / FreePNGimg, CC BY-NC 4.0 as stated by the source. No endorsement or current roster claim.

Rejected candidates had checkerboards baked in. Imagegen refused background removal on the prior public-figure reference; no edited output was produced or used. The already-transparent alternative is used without image generation.

## Verification

Observed on 29 October 2026 in the in-app Chromium browser at desktop 1280×720 and mobile 390×844:

- Original cutout: 1804×2700 RGBA, alpha range 0–255. Real player, ball and both shoes visibly intact. Source pixels unchanged.
- Twelve SVG variants rendered (six layouts × portrait/story). Output dimensions 1080×1350 and 1080×1920; text bounds stayed inside every artboard.
- Downloaded `playstat-sports-flight-story.svg` parsed as XML; logo, font and player embedded, with the same transparent-margin framing as the preview. Oversized title disables export.
- Official NBA MP4: videoWidth 1280, videoHeight 720, duration 93.533333 seconds, readyState 4. Visible action and advancing timestamps verified. Final desktop samples advance from 0.187 to 11.697 seconds; changing landscape → portrait → story preserved playback at 11.697 → 11.709 → 11.722. Mobile playback observed at 16.535 seconds.
- Frame dimensions observed: landscape 639.14×359.52 (16:9), portrait 639.14×798.92 (4:5), story 420×746.66 (9:16). Source video remains uncropped 16:9 in each. Play, pause, restart to 0, and viewing prompts worked.
- Mobile document width equals viewport width at 390px. One-column posters and vertical video frame inspected. No physical phone/Safari verification.
- Seven focused Node tests pass, including an export-framing regression check. Broader app tests were not rerun for this isolated library revision.

## Design review iterations

1. Baseline: portrait bust, repeated stacked hierarchy, dense footers and unplayable YouTube embed. Elvin rejected the design quality.
2. Rebuild: six compositions and actual full-body photo. Inspection caught excessive transparent margins and an obscured title. Use an SVG viewport to frame the unmodified player; move the first headline left and player right.
3. Finish: protect export framing after image embedding, correct the landscape canvas to 16:9, keep viewing prompts outside the artboard, and retain native footage proportions across all three formats. Desktop/mobile captures show the resulting candidate. No external design judge or user approval is claimed.

Evidence: `~/data-exports/playstat/branding-action-2026-10-29/`: before-desktop.jpg, before-mobile.jpg, six-designs.jpg, footage-after.jpg, mobile-footage.jpg, after-mobile.jpg, layout-checks.json, playback-checks.json and tests.txt. File names are evidence pointers; local preview is not deployment.

Standards review: source and media separated, real supplied logo retained, XML escaping/export validation retained, no production files changed. Spec review: full-body photographic action cutout, playable real NBA highlight, six compositions and three footage formats delivered. Remaining limits: media rights not cleared for production; remote NBA media require network access; no edited video render or physical-device test. Draft pending Elvin review.
