# 人类投降派文明级官网实现记录

本文为研究档案公开版，保留来源版本的论述与限制。公开时间：2026-09-08；不表示已完成同行评审。 本文属于公开研究资料（历史笔记、研究稿或来源记录）：已完成格式、来源限制与重复项筛查，尚未完成逐篇独立事实复核；原文中的解释、候选判断和未确认内容均按其原有限制阅读。

来源版本日期：2026-05-23

证据边界：本页记录一次官网导出实现与体验设计，不新增影片事实裁决；页面中使用的片内锚点、视觉素材、说话人、心理、生产史和传播效果仍服从 T0/T1/T2/T3 证据层级。

# 人类投降派文明级官网实现记录

## 定位

本页记录 2026-05-22 新建的公开官网导出：

```text
inspool-wiki-zh/exports/sites/人类投降派文明级官网-2026-05-22/
```

它不是研究仪表盘，也不是 Wiki 内部门户，而是把 [人类投降派文明级传播宣言-2026-05-22](/research/hs-a965d85ba3a85713) 与 [人类投降派文明级首发传播包-2026-05-22](/research/hs-d38cec1b73df5cf2) 落成一个可打开、可浏览、可带给陌生观众的高质感电影官网原型。

## 核心体验

首屏口径固定为：

```text
现实已经变成现场。
你还拥有自己吗？
```

页面用片内公共现场剧照作为主视觉，让电影先显影，再由文字把观众推入问题。核心不是“这部电影很复杂”，而是：

```text
它真正追问的不是现实是真是假，
而是现实由谁继续组织。
```

## 主要模块

- 首屏主视觉：以公共现场剧照、巨幅标题、双入口按钮和“不要只看画面，要看现场怎样把人变成画面”建立第一印象。
- 文明协议：用 Reality / Self / Witness / Archive 四个交互标签，把《黑客帝国》式“现实是否真实”问题推进为“现实由谁继续组织”。
- 四个日常入口：新增“当你被看见 / 当你说不出来 / 当别人替你继续 / 当你想把一个人留住”，让陌生观众先从自身经验进入。
- 四道入口：把旧传播阶梯改写为“被看见 / 被解释 / 被接管 / 重新观看”，去掉首屏、传播任务、方法说明等后台语言。
- 现场流地图：用身体、语言、观众、档案、流程五个节点解释 [现场流](/research/hs-f1753922fc3d5068) 不是现场感，而是一个人的内部被外部继续。
- 电影房间：新增“公共现场 / 白布 / 出口光”视觉板块，让官网从概念介绍扩展为可感知的电影建筑。
- 留下的场面：保留 `01:44:03-14`、`02:19:36-55`、`02:28:34-43`、`02:30:04-02:31:09` 与片尾时间点，但把“可写/边界”改成“留下/守住”，让观众看到场面，而不是看到写作纪律。
- 离场后三问：新增“沉默是否被太快翻译”“珍惜是否先变成占有”“被看见后还剩多少未解释干净的自己”，把电影外溢到观众离场后的自我检查。
- 带走几句话：把旧发布控制台改写为“一句话 / 写给朋友 / 一分钟开场 / 离场后”，保留复制功能，但改为观众可以自然转述的公共语言。

## 设计判断

本次没有沿用 `主体换手仪表盘-2026-05-17` 的研究仪表盘风格，而是新建面向公众的官网目录。视觉系统使用黑色、象牙白、琥珀、暗红、灰蓝和低饱和绿，避免单一色相支配；布局保留电影剧照、声谱图和片内时间视觉，但将跑偏的游戏 UI 接触表从首要视觉位置换下，避免第一波公共观看被片内游戏界面误导。

最重要的设计修正是首屏主视觉层级：修复 `hero` 背景被负 `z-index` 压到页面背景之后的问题，让电影现场真正显影，而不是退化成纯黑底海报。

## 2026-05-22 公共文案加厚

用户指出上一版页面仍有“穿帮”的后台方案感，例如“每一句强文案，都必须落回片内锚点”这一类写作纪律不应出现在观众可见页面。本轮据此完成一次公共呈现层重写：

- 去除可见页面中的 `首屏 / 传播 / 证据 / 可写 / 边界 / Launch Console / Day 1 / 平台 / 公众号 / 小红书 / 微博 / 短视频 / 宣发 / 母核 / 首发包 / 锚点` 等后台工作语言。
- 将 `锚点` 导航改为 `场面`，将 `首发` 改为 `带走`，将按钮改为“进入这部电影 / 带走一句话”。
- 新增 `Four Entrances`、`Rooms Of The Film`、`After Viewing` 三个公共内容层，让官网更像一部电影的世界入口，而不是宣发工作台。
- 保留核心公共命题：`现实已经变成现场。你还拥有自己吗？`、`现场流让内心不再私有`、`重新学习一种不占有人的观看`。
- 增加根目录 `favicon.ico`，避免本地服务器根路径 `favicon.ico` 404 干扰控制台验收。

## 验收

- `node --check` 已通过。
- `git diff --check` 已通过。
- Playwright 真实浏览器截图完成桌面端与移动端长页检查。
- 浏览器 console 检查为 0 errors / 0 warnings。
- 图片加载检查：8 张页面图片均 `complete=true`，自然尺寸正常。
- 交互已点测：文明协议、四道入口、现场流节点、时间场面、带走句切换和复制按钮均可用。
- Vimeo 观看区块点测：完整影片与预告片初始状态均不创建 iframe；分别点击后创建正确 Vimeo iframe；390px 移动端 `overflowX=0`。
- 桌面与移动端均未发现文字溢出、关键区块遮挡或断图。

## 2026-05-22 Vimeo 正片与预告片入口

用户提供 Vimeo 正片链接后，本轮在官网靠前位置新增 `Watch The Film` / `观看` 区块，并把首屏主按钮从“进入这部电影”调整为“观看全片”。随后用户补充预告片链接，本轮将观看区升级为完整影片与预告片双入口。站点现在提供四条观看路径：

- 完整影片站内播放器：点击“播放完整影片”后动态创建 Vimeo iframe。
- 完整影片外部兜底：点击“打开完整影片”跳转到 `https://vimeo.com/934438119`。
- 预告片站内播放器：点击“播放预告片”后动态创建 Vimeo iframe。
- 预告片外部兜底：点击“打开预告片”跳转到 `https://vimeo.com/935555288`。

实现上没有把用户原始链接中的临时 `turnstile` 参数、`login=true` 参数写入页面，而是使用 Vimeo 页面给出的清洁播放器地址：

```text
https://player.vimeo.com/video/934438119?h=5b65b88961
https://player.vimeo.com/video/935555288?h=64a716cb9a
```

播放器采用点击后加载，而不是首屏立即加载。原因是本地匿名自动化环境直接请求 Vimeo iframe 时可能触发 Cloudflare / Vimeo 隐私挑战，导致预览控制台出现第三方噪音；点击后加载可以让官网初始体验保持干净，同时保留完整影片与预告片入口。正式部署后如果 iframe 播放仍被拦截，应检查 Vimeo 视频隐私、嵌入权限和部署域名白名单。

本轮同步新增来源页 2026-05-22-Vimeo正片-934438119（馆内参考，未随本文公开），并更新 [2026-05-22-Vimeo预告片-935555288](/research/hs-5cbd723460df8907) 的 `embed_url`，用于长期记录正片与预告片外链和 embed URL。

## 部署检查

正式服务器上线前应确认：

- Vimeo 后台允许 `934438119` 与 `935555288` 被最终官网域名嵌入；如果使用域名白名单，需要把正式域名和必要的 `www` 子域都加入。
- 如果服务器设置 `Content-Security-Policy`，至少允许 `frame-src https://player.vimeo.com`；如果设置更严格的 `img-src / media-src / connect-src`，不要阻断 Vimeo 播放器自身资源。
- 不要把带 `turnstile`、`login=true` 或其他会话性参数的 Vimeo URL 写入长期页面。
- 部署后打开 `/#watch`，分别点击“播放完整影片”和“播放预告片”，确认两个 iframe 正常加载，浏览器控制台没有 CSP、X-Frame 或 Vimeo privacy 报错。

## 2026-05-22 全球英文主版与双语切换

用户进一步明确官网目标观众应面向全球，以英文作为第一阅读语言，中文作为第二语言，并要求同步打磨 Logo 与整体品牌呈现。本轮据此完成一次国际版重构：

- `index.html` 默认改为 `<html lang="en">`，标题、描述、首屏、导航、观看区、文明命题、现场流解释、场面和带走文本全部改为英文主版。
- 新增 `EN / 中文` 语言切换器，英文为首次进入默认状态；中文切换保留完整公共文案，不再依赖浏览器旧语言缓存。
- `app.js` 新增中英文 i18n 字典与动态内容字典，统一管理静态文案、交互卡片、时间场面、复制文本、播放器标题与 meta / Open Graph 描述。
- 品牌标识从单纯文字升级为 `SY` 电影框式 monogram：黑底、细线框、琥珀斜线、暗红识别点，配合标准英文名 `Shoot Self with You` 与中文片名 `人类投降派`。
- `styles.css` 补齐英文主版排版：英文优先使用 Georgia 系 serif，中文切换后标题回到中文宋体系；新增 header tools、语言切换、移动端 Logo 与按钮约束，避免 390px 手机端溢出。
- 公开页面继续避开后台写作语言，不把证据纪律、平台计划、宣发术语、Wiki/MiMo 规则或内部测试词暴露给陌生观众。

本轮验收补充：

- `node --check` 通过。
- `git diff --check` 通过。
- 桌面端默认语言为 `en`，页面标题为 `Shoot Self with You | Reality Has Become a Site`，默认激活 `EN`。
- 点击 `中文` 后页面切为 `zh-CN`，品牌、标题、文明协议标签与主要公共文案同步切换。
- 390px 移动端横向溢出为 `0`，header 高度约 `60px`，语言切换与低频按钮不挤压主体内容。
- 完整影片与预告片仍保持初始 `0 iframe`，点击后生成两个清洁 Vimeo iframe。
- 站点目录检索未发现 `turnstile / login=true / 强文案 / 锚点 / 宣发 / 母核 / 公众号 / 小红书 / 微博 / 短视频 / Test Plan / Assumptions / Writing Spec` 等不应出现在公开页的词。

## 2026-05-22 标准英文名与图像密度升级

用户明确指出 `Shoot Self with You` 才是《人类投降派》的标准英文名，并要求增加更多图片与图像内容，让外国观众更好理解电影。本轮据此完成一次标题与视觉层升级：

- 全站英文主名从早先临时译名切换为标准英文名 `Shoot Self with You`；中文层保留 `人类投降派`，并把英文名作为中文副标题显示。
- 首屏 H1 改为 `Shoot Self / with You`，不再先打抽象命题；抽象命题退到解释层，让外国观众先记住片名。
- 新增 `title-note`：解释 `shoot` 同时指拍摄、显影、瞄准注意力；`self` 不是私人财产；`with you` 是每个画面都必须面对的伦理压力。
- Logo monogram 从 `HS` 改为 `SY`，同步更新 data URI favicon。
- 首屏新增四张片内图像拼贴，把片名的异物感拉回电影材料。
- 在 Watch 区前新增 `The Title In Images`：用三张图像解释“自我不是先存在再被镜头拍到，而是在压力中被制造出来”。
- 在 Rooms 与时间场面之间新增 `Still Atlas`：以公共房间、白布、想消失的人、仍在观看的结尾、声音残余五个视觉入口增加图像密度。
- 页面图片总数从上一轮约 `8` 张提升到 `20` 张；Playwright 检查显示 `20/20` 图片加载成功。

本轮验收补充：

- `node --check` 与 `git diff --check` 通过。
- 公开站点检索未发现旧英文名、临时 Vimeo 参数或后台方案词。
- Playwright 验证：桌面端 `brand=Shoot Self with You`、monogram=`SY`、首屏标题可读；中文切换后品牌为 `人类投降派`、副标题为 `Shoot Self with You`。
- Vimeo 正片与预告片点击后仍生成两个清洁 iframe，标题分别为 `Shoot Self with You full film Vimeo player` 与 `Shoot Self with You trailer Vimeo player`。
- 390px 移动端首屏横向溢出为 `0`，标题、解释、按钮、核心句和四图拼贴均在首屏可见范围内形成完整入口。

## 2026-05-23 标题语法区与国际观众入口

用户继续要求官网用更多图像内容填充，并让外国观众真正理解标准英文名 `Shoot Self with You` 的力量。本轮在 `The Title In Images` 与 `Watch The Film` 之间新增 `How To Read The Title` 区块，把片名拆成三个公共入口：

- `Shoot`：不是把暴力当作奇观，而是拍摄、显影、瞄准注意力；当注意力开始瞄准，一个人就进入了可被现场接住的位置。
- `Self`：不是孤立灵魂或私人财产，而是经由声音、身体、迟疑、拒绝、字幕、记忆和接住它的目光共同出现。
- `With You`：不是浪漫亲密口号，而是现场开始之后，没有人再能独自被看见的压力。

该区块使用三张片内图像和三张固定卡片，继续避免把后台方案语言暴露给观众。英文主版把 `Shoot / Self / With You` 解释为三个词、三种压力、一个共同现场；中文切换保留完整对应表达。视觉上新增独立标题语法卡片系统，桌面端三列并置，移动端纵向进入观看流，避免把片名解释压成抽象概念说明。

本轮验收补充：

- `node --check` 与 `git diff --check` 通过。
- 公开站点检索未发现旧英文名、临时 Vimeo 参数或后台方案词。
- Playwright 验证：桌面端默认英文、标题语法区标题为 `Three words. Three pressures. One shared scene.`，三张卡片为 `Shoot / Self / With You`；中文切换后标题与三段解释同步切换。
- 页面图片检查提升为 `23/23` 加载成功；桌面端与 390px 移动端横向溢出均为 `0`。
- Vimeo 正片与预告片仍保持初始不加载 iframe，点击后生成两个清洁 Vimeo iframe。

## 2026-05-23 海外媒体与策展转述语言区

继续用户“继续”的官网全球化推进，本轮在 `Watch The Film` 与 `Civilizational Thesis` 之间新增 `For Programmers, Critics, Viewers` 区块。这个模块不是内部 press kit 说明，而是让海外电影节选片人、媒体作者、影评人和普通观众都能直接带走的公共转述语言。

该区块包含五张语言卡：

- `One sentence`：用一句话定义 `Shoot Self with You` 是关于“可见之后的自我”的电影，强调镜头、他人和公共现场继续组织一个无法完全替自己说话的生命。
- `Short synopsis`：压成短简介，突出 performance、intimacy、refusal、daze、public witnessing，并追问被记录是否可能成为真正被看见。
- `Festival line`：给电影节/策展语境使用，把本片写成 cinema becomes a site，身体、语言、观众、流程和档案共同决定人留下些什么。
- `Viewer invitation`：给普通观众的进入口，不要求解谜，而是测试自己是否还能不把人变成答案。
- `A boundary`：保留观看伦理，不让“看见”和“保存”被误读成占有或彻底知道。

中文切换保留对应内容，但该区块的第一目标是英文语境。视觉上使用低饱和蓝灰、琥珀和黑底细线网格，避免营销海报感；首张大卡原先字号偏大，本轮已下调为可读的官网引用尺度，并补充 `scroll-margin-top`，减少固定导航遮挡 section 跳转的问题。

本轮验收补充：

- Playwright 验证：英文默认标题为 `A few sentences that can travel.`，五张卡片标签为 `One sentence / Short synopsis / Festival line / Viewer invitation / A boundary`。
- 中文切换后标题与五张卡片同步切换，中文首卡保留标准英文名 `Shoot Self with You`。
- 页面图片仍为 `23/23` 加载成功；桌面端与 390px 移动端横向溢出均为 `0`。
- Vimeo 正片与预告片点击后仍生成两个清洁 iframe。

## 2026-05-23 六部分电影导览区

用户进一步指出官网需要真正从电影的六个部分入手，系统介绍这部电影，并使用截图解释其展开方式。本轮据此在 `For Programmers, Critics, Viewers` 与 `Civilizational Thesis` 之间新增 `The Six Movements` / `六个部分` 区块，让陌生观众在进入文明命题之前，先获得一条沿影片结构观看的路线。

该模块严格服从 2026-05-23 分段校正：第三部分为 `2-3`，第四部分为 `3-4`，第五部分为 `4-5`，第六部分为 `5-End`，不再把数字 `4` 后材料并回第四部分主体。六个公开导览标题为：

- `0-1 | Coordinates`：开端先建立房间、光线、镜头、脸和方向，让自我进入可显现条件。
- `1-2 | Rehearsal Becomes a Machine`：排练不再只是准备，而由身体、纸张、镜头、门、停顿和错误生产事件。
- `2-3 | Proof Enters the Senses`：当语言无法完全证明关系，证明进入床、水、皮肤、黑暗、记忆和捕捉游戏。
- `3-4 | Public Site`：发呆、空白、跳过、帮说、座位、观众、流程和白布把自我推入公共组织。
- `4-5 | Reverse / Afterimage`：公共现场凝固之后，事件以计数、延迟、重复和残影方式返回。
- `5-End | Archive / Silence`：名单、标识、黑场和安静把事件交给记忆，同时拒绝把保存等同于占有。

每张卡片均包含一张片内截图、英文主标题、中文切换文案、`Watch for` / `It changes` 两个公开观看提示。页面没有暴露后台写作纪律或内部测试语言，而是把证据边界转译为观众可直接使用的观影路线。

本轮使用的六张截图来自既有 `raw/assets`，分别覆盖开端方位、排练段、中段感官证明、第四部分公开现场、数字 `4` 后后效和片尾 logo/归档入口。它们作为公开视觉入口使用，不新增影片事实裁决。

本轮验收补充：

- `node --check` 与 `git diff --check` 通过。
- 公开站点目录检索未发现 `强文案 / 锚点 / 宣发 / 母核 / 公众号 / 小红书 / 微博 / 短视频 / Test Plan / Assumptions / Writing Spec / 证据纪律 / 穿帮` 等后台词。
- 浏览器验证：`#movements` 区块存在，6 张 movement card 全部出现，英文标题为 `Coordinates / Rehearsal Becomes a Machine / Proof Enters the Senses / Public Site / Reverse / Afterimage / Archive / Silence`。
- 六张新增图片均 `complete=true` 且自然尺寸正常。
- 中文切换后六个标题同步变为 `方位 / 排练变成机器 / 证明进入感官 / 公共现场 / 反向 / 残影 / 档案 / 静默`。
- 中等宽度与 390px 移动端复验：六部分模块自身无横向溢出，卡片转为单列，图文布局可读。
- 运行 `./inspool-wiki-zh/scripts/obsidian_wiki_health.sh` 成功；输出为全库既有图谱趋势，不是本轮官网修改引入的问题。

## 边界

本官网是 T3 公共呈现层。它可以把既有 Wiki 的传播判断转成可体验界面，但不能反向证明影片事实、传播影响或影史地位。所有片内事实仍回到 T0/T1，MiMo 仍为 T2 候选，公共文案仍需服从 [观看责任](/research/hs-ea602728dd616deb)。