juzi/docs/报告布局与跟手交互调整-2026-10-12.md

报告布局与跟手交互调整

综合评分布局已按后续要求调整为标题和分数整体在圈内居中；年龄标签与数字间距为 25px。最新实现与验证见《评分圈内居中与正脸语音修复-2026-10-12.md》。本文件其余跟手交互、JPG 优化与历史发布记录保留。

本次范围

1. 综合评分：标题移到黄色圆环外正上方，与「生物可视年龄」同高；分数数字本身水平、垂直居中，「分」独立放在数字右侧，不把分数挤偏。
2. 护理建议：标题左对齐，其他文案不变。
3. 检测等待：回退实拍背景，使用原 PSD 白色人头及黄色扫描动画，不出现用户照片。保留约 1 秒一轮、成功至少播放一轮、取消/失败立即退出，以及素材失败时的文字状态和取消入口。
4. 拍摄震动：复核现有功能。前端判断距离、居中、角度、光线等通过、进入「保持不动」时请求 [70,40,70] 毫秒短振；同一步抖动重试最多每两秒提醒一次，自动快门不重复震动。不支持、返回 false 或抛异常都静默跳过，不阻碍拍摄。是否实际震动仍取决于手机和浏览器，自动化不代替物理真机验证。
5. 报告三组页签：与「日常肤质」共用轻量滑动控制器。拖动时内容随手指平移，松手按距离/速度吸附；支持短拖回弹、轻扫、首尾阻力、系统取消和旋转屏幕。保持点按/键盘切换、上下滚动、图片点按放大；拖动不误触放大。各卡片独立，容器高度跟随当前内容，非当前页签从辅助阅读/焦点导航中排除。
6. JPG 优化：只转换在实际展示背景上可明显减小体积的三张产品图，原始 WebP、PSD 和原导出清单完整保留。背景和扫描底图仍用更小的 WebP；透明 logo、图标和蒙版保留 PNG。送检照片原本就是 JPEG，本次不二次压缩、不改变检测输入。

资源体积

产品	原始 WebP	网页使用 JPG	JPG 质量
25+	276,778 B	63,959 B	90
35+	267,094 B	66,077 B	90
50+	331,924 B	153,787 B	96
合计	875,796 B	283,823 B	减少 67.6%

三张图保持 504×503，白色产品卡底色合成，渐进式 JPEG、4:4:4 色度采样，PSNR 均不低于 40dB。页面只加载实际推荐的一款。构建脚本 tools/optimize_delivery_images.py 可重复生成；原图/新图的 SHA-256、体积、尺寸与参数记录于 design/ui-20261012/delivery-optimization-20261012.json。

验证

本地 8080 服务运行后执行：

node h5/test/report-touch-layout.mjs
node h5/test/scan-placeholder.mjs
node h5/test/profile-interaction.mjs
node h5/test/customer-feedback.mjs
node h5/test/customer-feedback-second.js
node h5/test/customer-feedback-second.mjs
node h5/test/customer-feedback-third.mjs
node h5/test/customer-feedback-fourth.js
node h5/test/customer-feedback-fourth.mjs
node h5/test/capture-quality-browser.mjs
node h5/test/report-persistence.mjs
node h5/test/login-performance.mjs
node h5/test/recommendation.js
node h5/test/regression.js
node h5/test/customer-feedback.js
node h5/test/profile-store.js
node h5/test/analyze-timeout.js

以上均通过。覆盖五种报告宽度/六种扫描视口、真实移动端触摸拖动中位移、三组吸附与高度、纵向滚动、放大/键盘、原稿素材哈希、白色人头、扫描完整循环和失败降级、实际本地人脸模型自动三连拍、账号隔离/历史报告/前后台一致性，以及评分和推荐规则回归。

慢网性能模拟：150ms 延迟、约 2Mbps 下载、4 倍 CPU 降速，测试冷启动登录约 1.68 秒，首屏资源 271,106 B；字体、人脸识别、产品和扫描图仍不竞争登录首屏。这是本地模拟测量，不等同于所有真机的公网耗时。

本次未修改拍摄合格阈值、评分算法、推荐规则、报告文案、登录或保存逻辑。未追踪的 new_feedback/ 保持原样，不纳入本次提交。

发布目标为 ubuntu@1me.xajuzi.com:/home/ubuntu/juzi，服务 juzi-h5.service。沿用 Git bundle 快进同步，不代用户推送 origin，不更改服务器环境配置或历史数据；上线后核对静态文件哈希、服务健康和匿名访问保护，并通过公网执行只读模拟账号浏览器测试。

线上验收（2026-10-12）

• 功能提交 63c9e06，从服务器基线 69dc996 快进发布，已重启服务。active/running，退出码 0、自动重启次数 0，本机及公网健康检查均通过。
• 公网首页、app/swipe-track/report-ui/profile-store/capture-quality 脚本、最新 CSS、三张 JPG、扫描底图与蒙版，共 12 份静态资源均为 200，SHA-256 与本地一致，保持 Cache-Control: no-cache；JPG 正确返回 image/jpeg。
• 公网匿名会话未登录且 no-store；报告列表、后台页面/统计返回 401，账号私有数据及服务端源码/测试入口返回 404。
• 公网 report-touch-layout.mjs、scan-placeholder.mjs、profile-interaction.mjs 全部通过；覆盖此次报告布局、三组真实触摸跟手/吸附/取消/边界/上下滚动/图片放大，以及白色人头扫描完整周期、失败/取消/迟到响应和基础信息记忆/隔离。没有页面 JS 异常，不创建线上账号/报告，不调用付费检测。
• 新报告专项脚本首次使用默认 load 导航与 30 秒预算，在公网冷加载字体/测试素材时超时。测试改为与现有公网用例一致的 60 秒预算及 domcontentloaded 导航，仍等待真实报告渲染与字体加载后执行原有断言，复验通过；不改运行时代码和界面行为。
• 已检查线上报告、滑动中状态和白色人头扫描截图。震动是否实际发生仍需支持该能力的手机真机确认。