50 lines
4.6 KiB
Markdown
50 lines
4.6 KiB
Markdown
# 明亮教具室 · 投影、数字和按钮精修
|
||
|
||
日期：2026-10-21。修订：v3。基于用户提供的941×1672参考图和v2实际运行画面进行逐项核对。
|
||
|
||
## 参考图分析与修正
|
||
|
||
| 参考图的特征 | v2差异 | 本次修正 |
|
||
|---|---|---|
|
||
| 棋块外沿有近距离黄棕晕染，下方另有短投影 | 只有普通投影，受光与暗部偏灰 | 暖色近边晕染与落地投影分开绘制；紫面暗部用蓝紫混色，奶油面用暖棕混色，不再统一压黑 |
|
||
| 底盘下方是向外衰减的阴影 | 向下复制底盘轮廓并填充黄色，出现额外实体下沿 | 底盘设为零挤出厚度，只用真实面alpha投影；底盘内部暗部减弱为淡暖色 |
|
||
| 小块数字按可见字形居中，大块数字位于左上单元区 | 使用字体行框中心，大块统一在整体中心 | 使用实际字形包围盒；大块与异形使用左上占用单元锚点，逻辑命中中心保持不变 |
|
||
| 白字有柔光和非常短的暗边 | 白字基本平涂，只有普通下投影 | 独立生成字形缓存，叠短紫暗边、白色柔光和清楚的浅色字面 |
|
||
| 深色数字有淡材质，并非纯黑 | 深色数字纯色 | 使用暖深墨渐变与稳定微颗粒，保持轻微、静止、不影响阅读 |
|
||
| 按钮的图标较大、短标签较小，二者有明确间隔 | 图标视觉尺寸不一致，文字偏规整且与图标争抢 | 重画回转、撤销、灯泡图标；按视觉质量分别校正尺寸；使用圆润短标签字体，重新设定上下留白 |
|
||
|
||
大块数字移动只是美术排版调整，仍保留一个逻辑块只走一步。通道格继续使用专用中心通道与数字角标，六边格保留中心布局；墙、门、类别和奇偶语义不变。
|
||
|
||
## 实现位置
|
||
|
||
- `src/bright-classroom/cushion.mjs`：从真实面alpha生成暖晕与投影，底盘不再复制实体底层；材质暗部支持着色混合。
|
||
- `src/bright-classroom/theme.mjs`：按字形墨迹边界定位文字；原生Canvas仅返回文字宽度时，通过一次离屏alpha扫描测量字形边界。
|
||
- `src/bright-classroom/number-stamp.mjs`：数字柔光、短暗边、淡渐变、固定颗粒与4MiB缓存预算。字形与材质像素均运行时生成。
|
||
- `src/bright-classroom/geometry.mjs`、`board-renderer.mjs`：区分数字锚点与逻辑中心，组合规则继续独立排版。
|
||
- `src/bright-classroom/ui.mjs`：按钮图文比例、图标轮廓和短标签字体。
|
||
- `src/hints.mjs`：已走块遮罩扩展到外沿晕染区域，避免提示压住新的材质效果。
|
||
|
||
按钮短标签使用站酷快乐体的改名子集 `NumberSwipePlayful.ttf`；数字继续使用Nunito800，正文继续使用Noto Sans SC。字体源、字集与哈希记录于 `fonts/manifest.json`；相关OFL一并交付。来源：[站酷快乐体](https://github.com/google/fonts/tree/main/ofl/zcoolkuaile)。
|
||
|
||
## 验证与证据
|
||
|
||
| Evidence | Finding | Path |
|
||
|---|---|---|
|
||
| 用户参考图与v2画面对照 | 底盘实体复制层与真实投影不同，字形行框不等于视觉中心 | 分离投影与挤出厚度，按字形边界定位 |
|
||
| `node --test bright-classroom.test.mjs hints.test.mjs lessons.test.mjs audio-copy.test.mjs`：33/33通过 | 几何、内孔、类别、字形居中、原生宽度测量回退和零厚度底盘检查通过 | 新渲染模块→模块验证 |
|
||
| `node smoke.mjs`：200/200通过 | 关卡唯一解、触摸通关、撤销、重开、提示、教学隔离、存档和前后台保持原行为 | 实际game.js→模拟微信验收 |
|
||
| 浏览器 `qa/hints.html`：200/200采样像素一致 | 新字效与外沿晕染不被提示改变 | 实际Canvas→提示与撤销重画对照 |
|
||
| 浏览器实际检查基础大块与320×568的36块关卡 | 普通数字、大块锚点、按钮图文与底盘投影可检查 | 样张观察→保存运行截图 |
|
||
|
||
没有新增图片游戏资源。截图仅用于QA，不进入运行包。微信手机的最终显示和性能仍需设备预览，浏览器与模拟微信结果不代替真机记录。
|
||
|
||
## 交付
|
||
|
||
- [当前试玩](http://127.0.0.1:17859/qa/bright-classroom.html)
|
||
- [投影字效精修版导入包](../releases/NumberSwipe-campaign-200-r2-明亮教具室-投影字效精修版-20261021.zip)
|
||
- [基础大块运行截图](../wechat-campaign-200-r2/qa/bright-classroom-polish-v3.png)
|
||
- [320宽密集盘运行截图](../wechat-campaign-200-r2/qa/bright-classroom-polish-v3-dense.png)
|
||
- [200关像素验证截图](../wechat-campaign-200-r2/qa/bright-classroom-polish-v3-pixels.png)
|
||
|
||
导入包SHA-256：`7A490BD9352563455F65501AF0EA0078839ECF22BE16DEB6712FF4DBA07D7ADD`。保留此前发布包；解压新包导入微信开发者工具，重新编译并生成预览。
|