Skip to content

feat(site): hero 胶片重剪为完整五镜头,预览图舞台化 - #2

Merged
MJorgin merged 1 commit into
mainfrom
feat/site-hero-film-and-stage-previews
Sep 18, 2026
Merged

MJorgin merged 1 commit into
mainfrom
feat/site-hero-film-and-stage-previews

Conversation

@MJorgin

@MJorgin MJorgin commented Sep 18, 2026

Copy link
Copy Markdown
Owner

问题

  • 介绍页 hero「视频」是一张 36 帧 JPEG 雪碧图,且只是 README 主影片(五镜头 496 帧)的头尾两段重剪:前 40% 近黑近乎静止 → 1 帧白闪 → 后 55% 一张近白幻灯片冻到结束,品牌信号红几乎不出现(即反馈的「脱色」)。
  • 三个方向预览 + Built 图是直接塞进深色页面的裸幻灯片导出:两张近空白画布、一张暗红块,密度/气质完全不一致。
  • 旧分享卡是浅色 contact sheet,和现在的深色电影感页面两套视觉。
  • 网站胶片当年没有生成脚本,无法复现。

改动

Hero 胶片(内容换血)

  • 新 scripts/render_site_filmstrip.py:用 ffmpeg 从已提交的主影片 assets/hero-concept-gate.mp4 跨全部五个镜头均匀采样 72 帧 → site/assets/hero-filmstrip.webp(1.2MB,比旧 36 帧 JPEG 的 1.5MB 更小、帧数翻倍);hero_first/last.jpg 同步重生成;页面 JS 帧数 36→72、sprite 切 WebP。
  • 滚动叙事现在是完整弧线:舞台建立 → 三方向横移推近 → 变成 deck → 投影仪/手机/校验墙 → 拉回收尾。

预览图舞台化

  • 新 scripts/sitestage.py(共享)+ scripts/render_site_previews.py:原始截图移至 assets/site-previews/,幂等合成为深色舞台上的发光屏幕(环境光、发丝边、落地阴影、倒影;chosen 方向保留信号红光晕+红边)。幻灯片像素不做任何裁剪/改动。
  • 输出仍为原文件名,rail 和 pinned 两处同时受益。

分享卡

  • 新 scripts/render_site_social_card.py:1280×640,深色舞台 + 页面原标题「Clear ideas / before pixels.」+ chosen 屏幕。

文档:storyboard 增补网站资产生成方式;README 脚本清单同步。

验证

  • node scripts/check_site.mjs ✅(含新增 Pages 部署闸门)
  • python scripts/check_launch_motion.py ✅ 正常滚动拖动 + reduced-motion 静帧契约
  • Playwright 桌面 1440 宽四档滚动 + rail/pinned + 390px reduced-motion:零横向溢出;逐帧量化新胶片饱和度/红色占比/亮度弧均正常,不再有 20 帧冻白
  • 三个渲染脚本各跑两遍确认幂等;py_compile、DSH manifest 检查通过

产物全部提交,CI 不负责构建(仅 ffmpeg / macOS SF Pro 为本地构建依赖,已写入文档)。

…view screenshots on the cinematic set

The launch page filmstrip was an ad hoc 36-frame recut of only the master
film's head and tail: ~40% near-static dark stage, a one-frame flash, then
~55% of a frozen near-white slide — and the rail/pinned screenshots were
raw slide exports that read as blank white canvases on the dark page.

- render_site_filmstrip.py: deterministically samples 72 frames across all
  five shots of assets/hero-concept-gate.mp4 into a 1.2MB WebP sprite
  (smaller than the old 1.5MB JPEG at twice the frames); first/last JPEGs
  regenerated; site JS updated to 72 frames and the WebP
- sitestage.py + render_site_previews.py: raw slides move to
  assets/site-previews/ and are composited as lit floating screens (glow,
  bezel, floor shadow/reflection, signal-red halo on the chosen direction),
  idempotent
- render_site_social_card.py: OG/Twitter card restaged with the launch
  headline and chosen screen
- docs + README inventory updated
@MJorgin
MJorgin merged commit 9e98cb3 into main Sep 18, 2026
3 checks passed
@MJorgin
MJorgin deleted the feat/site-hero-film-and-stage-previews branch September 18, 2026 07:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants