# 拾声·河南 v1.0.23｜掌心里的中原

本轮只精修移动端，保留 v1.0.22 的内容、声音系统和电脑端设计。使用 redesign-existing-projects 技能先审查实际手机截图，再针对性修正构图与阅读层级；图片使用内置 image_gen 生成，不使用外部图片热链。

## 问题与处理

- 原有手机图大多是横图缩小版，再被 cover 拉满整章，造成主体丢失、纹理模糊。入口、中原大地、石窟改用真正竖版构图。
- 长章节不再让一张图从顶部拉伸到页面末尾：中原环境图限制为 740px 高并渐隐到阅读底色；新声为 260px 独立影像区，文字索引与说明移至下方；档案与余音背景限制高度。
- 章标改为编号＋完整中文标题，删除手机端重复英文；继续使用原 TransitionManager，不新增滚动劫持。顶栏实色、紧凑章标底色隔开正文，避免透字和串字。
- 入口保留河南大字、问句、双入口；右侧取景保证城楼不被裁掉。小高度屏幕允许入口内部滚动，按钮不锁死在屏幕外。
- 水脉保留原本适配水岸的 WebGL 纹理流动，调整文案位置和渐变遮罩，不更换素材而破坏水岸运动掩膜。
- 人间保留可点选河南地图，人口与城镇化信息下移到清晰阅读区；麦田收获图改为 4:3，秋播／春管／夏收改为纵向时间序列。
- 文脉优先完整展示石窟概念影像，标题接在影像下沿，避免覆盖雕像面部；清明上河园使用已有清晰图片的 4:3 裁切，不生成无必要的重复图。
- 新声的机械臂使用已有图片在受控横向影像窗中完整展示，保留四主题的缩略图、Crossfade、来源与声音功能。
- 留声优化档案行字号、录音说明和操作间距；共振改为单列触控滑杆，扩大滑块；余音改用竖版大地照片并渐隐至尾声底色。
- 手机菜单支持独立滚动和安全区；避免菜单在短屏上不可达。新增样式全部限于 max-width:760px，未重写桌面布局。

## 手机专用影像

| 文件 | 用途 | WebP 体积 |
| --- | --- | --- |
| assets/images/v1.0.23/entry-portrait.webp | 入口与序章，河流／麦田／城楼 | 175,024 B |
| assets/images/v1.0.23/land-portrait.webp | 人间与余音，麦穗／村庄 | 196,030 B |
| assets/images/v1.0.23/stone-portrait.webp | 文脉，完整石窟形态 | 188,376 B |

三张合计 559,430 B，900px 宽。原始 PNG 在 source-images/v1.0.23/，完整最终提示词在同目录 prompts.json；使用内置 image_gen 模式。以上都是概念影像，不宣称真实地点实拍或精确文物复原。

所有图片均在包内。手机首屏仅请求入口竖图，不同时下载电脑首图。其他竖图按邻近章节加载；跨越 760px 断点时已加载图片可自动切换，尚未进入的章节不会被无条件预载。原桌面文件及 v1.0.22 内容图路径保留。

## 测试结果

浏览器：本地 Chrome，手机模拟触摸及 DPR 2；不是物理手机验收。

- 320×568、360×800、390×844、430×932、768×1024、1440×900、1920×1080：8章节及入口，无横向溢出、标题区域碰撞、JS 异常或缺图。
- 短屏入口内容可滚动；390px 手机菜单点选章节可达。
- 宽窄屏切换：同一张已加载环境图正确切换手机版和桌面版。
- 1440、1920 两尺寸与 v1.0.22 逐章比较：章节高度、标题矩形、字号和实际图片路径一致。
- 7段触摸导航正常；快速连续跳章最终只有1个章标，目标状态正确。
- 实际触摸事件滑动：scrollY 从844到1289，停手后保持1289，无自动回拉。
- 地图点击选择人间声景成功；关闭声音成功；超硬材料主题切换成功。
- 声纹索引16项；模拟麦克风录音保存1条；混音4声部、PNG声纹导出正常。
- 录屏 qa/video/page@fc6a010c60d45e16429fc9eb804c98d1.webm 记录手机操作，不包含系统声音。

冷启动样本：缓存关闭、6Mbps下载、80ms延迟，本地Chrome模拟。390px首屏约528KB，7请求，load事件约953ms；1440px约531KB，7请求，约1014ms。这里只是一次本地条件测试，不是线上测速、LCP、真机帧率或任何设备上的速度保证。

测试数据：qa/mobile-layout-tests.json、qa/mobile-flow.json、qa/desktop-performance.json；关键截图在 qa/。实际部署包解压后的根路径和子目录测试另见发布目录 DEPLOYMENT_CHECK_v1.0.23.json。

## 部署与后续

只上传《拾声河南_宝塔部署_v1.0.23.zip》，解压到原网站运行目录，保留服务器自己的配置。index.php 与 assets 应在同一级，不要将完整源码包再次覆盖上传。部署前备份原目录。

入口样式和脚本已改为 site-v1.0.23，避免复用旧版缓存。测试并未登录或修改正式服务器；静态预览只验证 PHP 入口内容的资源关系，不代表实际执行过 PHP-FPM。

仍建议在 iPhone Safari、安卓微信内置浏览器、真实触屏设备上检查音频解锁、系统录音权限、分享下载与刘海安全区。手机横屏超过760px时采用原有平板／桌面响应式布局；不保证所有机型都有同等WebGL性能，保留原静态回退。