JMOS文档与样张

motion-batch3 · 引线 / 主题波 / 拆解(候选样张)

来源:仓库 reviews/2026-10-09/motion-batch3/README.md · 版本 0ca44f9 · 候选样张,未并入主应用 · 录屏 motion-batch3.mp4 与总览图 motion-batch3.png 体积较大,未随本站发布(仓库同目录可看)

在本站打开样张第三批入口04 孪生 GLB(引线)拆解 OP07005 主题切换波

留档说明(2026-10-09):样张代码在 prototypes/motion-batch3/,未并入主应用。文中提到的 *.patch 是当时交付的补丁,内容就是该目录;补丁文件本身不入库。

基线:6782659 + motion-batch1 + motion-batch2。样张只在 prototypes/motion-batch3/,服务端口 8889,不改 app/jmos。 做法与数值参考 reference.md §3.1、§3.8、§3.9 和 §4.1 第 5、7、8、9 条;代码为本仓库新写,未复制外部代码(不需要 MIT 声明)。没有用参考方的名称、配色或字体,也没有新增色值:样张文件里 HEX / rgba / color-mix 为 0 处;verify.mjs 里只有用来比对计算结果的 rgb() 期望值。

产出:motion-batch3.png、motion-batch3.mp4、本文件、motion-batch3-sample.patch(只含 prototypes/motion-batch3/,没有模型文件)。

1. 三项内容

1.1 跟随 3D 的标注引线(04 GLB 孪生 + 04 低多边形查看器)

1.2 05 应用中心主题波

1.3 设备拆解(04 GLB 内的模式)

2. 验证(两个引擎 Chromium + WebKit,软件渲染)

项目结果
矩阵:浅/深 × 390 触屏/768/1440/2560 × 04 GLB、04 查看器、05、07 里的 0464/64(改 leader.js 后、检查改为最多等 6s 轮询后全量重跑):0 报错、无横向溢出、切主题后 07 与内嵌页同步、≥641 有引线、≤640 无引线
行为50/50(每引擎 25)
引线跟随(拖动旋转 + 滚轮缩放,逐帧比较端点与相机投影)最大误差 1.20–1.37px(< 2px),端点移动 408–448px
展开时间线360ms,信息牌 200ms 起淡入,线 270ms 画满
换选同侧:信息牌全程不透明;换边:位置只在看不见时改变(无瞬移)
遮挡 / 出视野虚线 + 空心端点;出视野不画线,点「定位」回来重新连线
拆解单调到 1,zoom 1.08,8 组 = 清单 8 行;合拢中途再展开、展开中途合拢均从当前位置反向,多次反向后位置误差 0、zoom 1、选中框和引线恢复
05 主题波A-01 → A-02 → A-03 依次开始,全部结束 528–560ms;反向后回到原主题,卡片不留自己的主题
05 角度 / → 键和第一、二批逐个 transform 一致
减少动态效果主题直接切换;信息牌直接出现;拆解直接到位
对比度引线对视窗底 4.77(浅)/ 6.76(深);信息牌小字 ≥ 4.65
手机拆解抽屉 354px 高、8 行、行高 44、在标签栏上方,画面上移 71px,收起后复原

说明:软件渲染一帧要几百毫秒,所以展开时间线用虚拟时钟逐 10ms 取样(只替换 performance.now),拆解反向按进度触发,每帧步长检查「从上一帧位置按阻尼逼近当前目标」。

分档相对成本(拆解展开 + 合拢期间每次 3D 重绘的耗时,Chromium 软件渲染,1440×900)

档位像素阴影重绘中位数相对
流畅0.48M(分辨率 0.8,像素 0.64×)关277ms0.59
均衡0.75M开473ms1
高画质0.75M(DPR 1 下与均衡同像素)开469ms≈1

绘制调用约 96、三角形约 3.1 万,三档相同;拆解额外增加的是每个部件一组边线。这里的绝对值没有意义,只看相对值;真实帧时间须在 MacBook Air 上实测。

3. 录屏与慢放检查

motion-batch3.mp4:97.4s,6.1MB,1440×900,7 段:引线 0:00 / 拆解浅色 0:20 / 拆解深色 0:41 / 手机抽屉 0:54 / 查看器 1:06 / 主题波 1:14 / 减少动态效果 1:25。 软件渲染直接录会严重掉帧:一帧 300–500ms,飞镜头只录到 1–2 帧,看起来像跳切。所以录制时把页面时钟(performance.now、rAF、setTimeout、CSS 动画)放慢 6 倍(主题波段 14 倍),成片再加速回原速。动效代码和参数都没改。 主题波在成片里看起来约 1s,原因是录屏取帧延迟。在同样放慢时钟的页面里逐帧取样,三张卡分别在 219、364、499ms 换完,和不放慢时(265 / 424 / 533ms)一致。 慢放检查记录见第 5 节。

4. 待决事项(已按默认继续)

  1. 查看器样张打开了轨道相机(否则引线无从「跟随」)。
  2. 拆解只放在 04 GLB 里;查看器原有的「拆解」按钮不动。
  3. 部件按模型材质归组,不是 BOM;接入真实 BOM 后替换适配层 parts-adapter.demo.js。
  4. 拆解时隐藏浅色全局边线,改用每个部件自己的边线。
  5. 主题波只做单独打开的 05;嵌在 07 里仍按重载规则;07 卡片(可选项)未做。
  6. 主题波期间(≤600ms)页面上其他属性的过渡暂停,只保留外框 450ms 和卡片 240ms。
  7. 拆解时不显示引线,合拢后恢复。
  8. 动效分组:引线归 surfaces,拆解归 camera(减少动态效果时都直接到位)。

5. 慢放检查记录

逐段按 2–10 帧/秒抽帧查看:

6. 限制