---
type: knowledge
created: 2026-09-19
updated: 2026-09-19
sensitivity: standard
tags: [ai, prompts, skills, huangbai-ai]
status: active
---

# huangbai-AI 案例项目逐层学习

本分册覆盖 13 个仓库，来源是主任务本轮取得的公开仓库文本快照。阅读从仓库入口进入设计契约、生成提示词、交付记录和历史修订；只提取可迁移方法和版本关系，不复述来源中的私人资料或未公开业务细节。另对部分关键源码做了定向静态核验，未通读全部源码。本分册未安装依赖、运行生成任务、读取外链私人资料、部署或验证在线成品。

## 阅读覆盖

索引共 298 个文档路径：230 个全文阅读、51 个历史或过程文件节选阅读、2 个与已读全文完全同 SHA-256 的重复副本、15 个未进入提供缓存的许可证或依赖元数据。283 个缓存文档全部有真实覆盖记录，零个 unread。节选记录保留 Unicode 字符位置，0 起始、末端不含；不是把下载、列目录或关键词扫描记为全文。重复映射及每份文件 SHA-256 见 [阅读台账](Reading-Ledger.json)。

| 仓库 | 全文 | 节选 | 相同副本 | 未取回元数据 |
|---|---:|---:|---:|---:|
| lumiq-parallax-collab | 179 | 51 | 0 | 4 |
| yingxian-pagoda | 22 | 0 | 0 | 1 |
| OpenWork | 3 | 0 | 0 | 0 |
| lumiq-website-public | 1 | 0 | 2 | 3 |
| lumiqstudiovercel | 2 | 0 | 0 | 2 |
| private-daily | 11 | 0 | 0 | 1 |
| token-xiuxian | 4 | 0 | 0 | 0 |
| chronos-lux3d | 2 | 0 | 0 | 0 |
| fs50p-watch-experience | 2 | 0 | 0 | 4 |
| BaoshuMa | 1 | 0 | 0 | 0 |
| aether-3d | 1 | 0 | 0 | 0 |
| website-ppt-style-skill-refs | 1 | 0 | 0 | 0 |
| webdesigncase | 1 | 0 | 0 | 0 |

这里的“学过”表示已阅读、归纳并可据此选择工作方法，不表示训练模型、永久自动加载所有技能、执行案例或逐帧观看二进制成品。

## 逐仓库结论

### lumiq-parallax-collab：最完整的提示词与迭代案例

入口：`README.md`、`AGENTS.md`、`当前进度.md`；实现入口为 `related/website`。`output/imagegen`、`output/libtv`、`outputs/libtv-4k-redraw` 内 83 份生成提示词与说明已全文阅读，随后读到 `output/交付` 中逐轮生成、接入、加载、移动端、视觉走查及版本说明。`沟通记录` 是历史证据，长会话只读与设计、提示词、根因和验证有关的段落。

当前与历史：根 README 和交接说明强调 2026-09-07，但 `当前进度.md` 有 2026-09-14 更新，后者已包含更晚的首屏、移动端和审阅发布变化。旧文件里的“正式版”是其当时结论，不能覆盖更新记录。H3 A—I、不同首屏方案和背景五版是演进或未采用方案，不能当成同时生效的要求。

可迁移方法：

1. 先建立页面信息架构，每层一个明确任务，再决定哪些内容适合静态图、视频或实时 3D。不能把“每款产品占一屏”当作官网通用结构。
2. 给每张参考图分工：产品原图约束身份与结构，版式图约束构图，风格图约束光色，关键帧约束运动状态。原始硬件图与产品名称一一绑定，避免多参考互相污染。错误生成图不能成为新的产品真相；只认可版式时，应保留版式提示词、重新绑定正确产品图。
3. 提示词必须写清楚主体数目、固定比例、位置、前后遮挡、镜头是否移动、转场顺序及结束停留，不能只写“丝滑”。视频时段只是意图，前端应根据实际成片帧对齐，不能把提示词秒数当作精确执行保证。
4. 连续镜头共享关键帧和同一轴线。网页保留一个主视频身份与时间线，标题、导航、按钮、表单使用真实 HTML；生图里的文字不能替代可点击、可翻译、可访问的界面。
5. 多次使用坐标和百分比重定位仍偏移时，改成明确的灰色剪影或红框版式引导，叠加干净身份参考和空背景；继续实测，不能宣称提示词具备像素级约束能力。
6. 场景不仅要美观，还要物理自洽：人物视线、设备屏幕朝向、手势、桌面角度、书封与实体三维结构要相容。若读者与镜头需看到同一屏，调整到肩后或俯拍视角。
7. 移动端单独设计 9:16 画面，保留真实 UI 所需的上方留白和裁切安全区。横图硬裁、局部拼贴曾导致比例和边缘问题；这是案例中的失败经验，不是所有项目都必须重新生成素材。
8. 固定背景与玻璃采样统一屏幕坐标；纯背景与产品层分离有利于控制。背景流动、HTML 卡片入场与页面滚动各有职责，避免全屏所有对象同时晃动。
9. 加载状态取真实下载、解码和首帧就绪进度；视频已可见后再撤蒙版，不能用假计时到 100%。失败可重试，离开时回收资源。完整预下载与分段预加载有启动延迟取舍，按素材量选择。
10. 视频卡在回传时先查原任务状态，避免连续重复生成扣费。记录失败和未采用版本；供应商“4K”标签必须核实下载尺寸，不能混淆实际像素与界面选项。
11. 对齐检查采用相同视口和交互状态的实际截图、关键区域及计算后几何。样式声明存在不代表生效，案例中公共 margin 覆盖就是根因；“去掉描边”也不等于去掉整块半透明卡片。
12. 滚轮劫持和停靠多次修订说明交互需要实测：键盘、触控板、手机、输入框、内部滚动和 reduced-motion 都需留出口；不可照搬早期强制吸附规则。

证据路径：`output/交付/线上白屏修复-2026-09-07/修复与验证.md`、`output/交付/独立固定背景-2026-09-10/生成说明.md`、`output/交付/背景五版-2026-09-11/交付说明.md`、`output/交付/手机静态背景-2026-09-14/首页统一构图提示词.txt`、`output/交付/手机静态背景-2026-09-14/第二页UI留白提示词.txt`，以及覆盖表中具体 imagegen/libtv 路径。

验证边界：文档中的压缩前后体积、SSIM、加载时间和某机器 seek 测量，是对应素材与环境的结果，不能扩展为普遍性能承诺。mock 表单通过不证明数据库写入；云端构建 READY 不证明全部线上浏览器路径；移动视口截图不等于真机浏览器验证。

### lumiq-website-public 与 lumiqstudiovercel：发布副本和历史实现

`lumiq-website-public/README.md` 标明 2026-09-14 最新公开版本，来源提交 `7ca75d6`；`related/website/README.md` 与 `design-qa.md` 是已读协作仓库文件的相同副本。顶层说明给当前发布口径，子目录旧 README 不能覆盖它。需核对 LFS 实体文件及完整性 manifest，普通 ZIP 或很小的指针文件不代表素材完整。

`lumiqstudiovercel/README.md` 与 `design-qa.md` 是早期网站和设计验收来源，可学真实页面层级、断点、素材裁切、跨语言与点击区域的一致性。历史会话中的多语言、占位表单和路由状态已经多轮变化，不能直接当今天状态。案例里所有三语言键齐全只证明覆盖，仍需验证语言切换保持页面、查询参数、HTML lang、SEO 关联和真实含义。

### yingxian-pagoda：文化展陈、镜头与模型验证

全文读入口 `README.md`、`使用说明.md`、`制作与验证.md`，以及 `第三版设计/六幕设计与镜头衔接.md`、`设计对照`、材质光影/镜头/首屏说明、`offline-render` 三套说明和深层结构复核。

版本冲突：根 README 的 v11 晚于早期发布包但不是最深层最新证据，`yingxian-pagoda/结构比例复核.md` 与 `小工具校验说明.md` 已有 2026-09-16 v18。不能因根入口写“当前”就跳过后续复核。若继续开发，要让实际模型、脚本与使用入口确定当前状态。

可迁移方法：先把展陈叙事分幕，再定义每幕摄像机、聚焦构件、解释文字和衔接。改变材质、光照、背景、雾或视角时分开比较，避免所有变量一起改变后找不到偏差来源；同一模型的全貌、结构与局部镜头应能往返恢复。程序化结构检查和真实渲染截图互补，线框、屏幕空间比例和近景可发现只看远景发现不了的问题。离线渲染、实时 WebGL、浏览器 UI 是不同产物。

边界：模型闭合、层数比例和导出检查是几何/展示验证，不等于测绘、结构工程或历史考证已经完成；镜头距离和曝光参数属于该迭代，不是可通用照抄的“最佳值”。

### chronos-lux3d：同一模型的奢侈品叙事

已读 `README.md`、`model/README.md`。从整体到机芯局部再到爆炸展示维持同一模型身份；近景遮挡件临时淡出，离开时恢复。Blender 可编辑帧与网页 GLB、灯光和相机分开交代。对生成资产的结构缺陷，用清晰可编辑几何修复；静态模式和 reduced-motion 保留内容。

这是参照展示效果的独立重建，不是原品牌源文件，也未证明机械传动或制造结构真实；不得把视觉拆解当作工程设计。

### fs50p-watch-experience：多章节商品展示

已读 `README.md`、`blender/README.md`。12 章镜头叙事、分件与爆炸、表带节奏和自包含预览能作为实现案例。Blender 重建零件、隐藏原始参考集合、运行时外壳资产与代码控制的表带/相机分开，交付中明确哪些可编辑、哪些运行时生成。

不是可验证机械机芯，示例商品文案不应转作用户业务承诺；仓库可读与第三方素材商业使用权不同，未读许可证不能作授权结论。

### OpenWork：数据证据驱动的 3D 信息界面

已读 `README.md`、`DESIGN_CONTRACT.md`、`design-qa.md`。同一地球场景由入场延续至搜索结果，不重新挂载切换。地点精度遵守数据证据：城市可定位，国家/时区/全球岗位不编造城市；总部回退需标明。地图只是浏览入口，键盘和列表应在地球资源失败时仍可用。

设计中突出地球、选中项、底部搜索，弱化无关数据；选中状态改变应可恢复；对照图的色彩与几何检查比凭感觉微调可靠。岗位和数据快照只代表仓库版本，本文不复述为当前招聘事实。

### aether-3d：程序化视觉与叙事状态

已读 `README.md`。章节驱动 Catmull-Rom 相机路径，GPU instancing、程序化着色、解析阴影、世界坐标到屏幕 HUD；固定进度、隐藏 UI 和 smoke 参数帮助截图复现。后期 bloom、tone、blur 和 grade 各有职责。这里学到的是状态控制与可复现调试方式，未在本轮实际渲染验证。

### BaoshuMa：原型中的真实输入和持续状态

已读 `README.md`。保持监听、校准、波形、识别倾向和置信反馈同屏连续更新；无有效敲击不假装识别成功，重新测试会清空旧状态。真实麦克风链路与分类准确率是两件事，模拟器能检查 UI 和权限，无法证明真实声音分类效果。

### token-xiuxian：持久计量与实时反馈分层

已读 `DESIGN_NOTES.md`、`demo/DESIGN_NOTES.md`、`SUBMISSION.md`、`desktop/README.md`。设计文档讨论按来源和 invocation 去重；当前 sync_data.py 实现按来源累计正向差值，并在连续三次相同回落后调整基线。文档目标与具体版本实现需区分，不能把仍存在的日志文件数量当作耐久累计；实时快照驱动动画，账本保持独立。分别处理缓存 token 语义、精确值与估计值。只读计量尽量不保存 prompt、request 或输出；更详细代理采集是独立模式。后台扫描单实例，坏文件保留先前有效状态，退出结束扫描。

这是一种可迁移的数据边界与状态设计；不采用仓库历史临时访问地址，不读取用户真实日志或安装桌面组件。

### private-daily：应用工程案例

已读 README、部署和变更说明、前端入口与 6 份工程文档。核心方法是手动、定时和回调共享一个任务执行入口与 queued/running/success/failed 状态；任务配置覆盖与全局配置分开，临时状态 finally 清理；错误用 code/message/hint/request_id 贯穿。前端以服务端缓存和局部 UI 状态分工，分阶段迁移、单一配置源、变更后失效缓存、版本化 localStorage 和回退入口。

部署快速入门不直接作为生产方案；文档保留的进程内队列、签名兼容和七天稳定性验证计划仍是限制或待办，不能说已完成。`docs/Skill_升级建议.md` 只是建议清单，并非已安装或已验证技能实现。没有读取任何真实私人文章或运行采集。

### website-ppt-style-skill-refs 与 webdesigncase：素材参考库

两者 README 都很短，分别说明是自测截图和静态提示词参考资产。分类为素材库，未发现足以据此认定的可安装技能入口；图片没逐张观看，不把“列出素材目录”写成“学完每张图”。

## 从历史失败中保留的判断

- 生成图布局正确但产品形象错误时，保留构图意图，恢复原始身份依据；“更好看”不能抵消事实失真。
- 服务端口被另一工作区重启，会让本已修复的视频重新 404。验证时必须记录代码目录、提交和实际服务，不以“浏览器仍开着”确认版本。
- 静态按钮、无动作 Read more、只改标签的语言选择属于功能缺口；应走真实点击和保存链路。
- 历史 ChatCut 技能创建会话展示了“本机能用”到“目标用户只有目标应用也能用”的依赖收敛：先列能力与前置条件，再划分原生完整效果和降级效果。同一轨道算法控制人物前景/后景能避免漂移。此会话是历史过程证据，不能凭其断言现有 ChatCut 平台能力或本机技能安装状态；会话里删除来源说明的做法也不作为可迁移规范。
- 成功构建、视觉验收、真实写入、真机测试、远端部署与可持续运维应分级描述；案例中未做的验证仍保留未验证。

## 可复用提示词骨架

“先列出当前入口和资料版本，给参考素材逐项分配身份、构图、风格和运动职责。把页面或镜头按用户目标划分阶段；每阶段写清主体数目、位置、比例、遮挡、相机、转场与结束状态。真实文字和操作保留为界面控件。列出桌面、手机和减少动态效果的分别处理。先验证一段和一屏的实际输出，再展开整套；保留失败版本、实际尺寸与验证范围，明确当前采用版本。”

使用时按任务删减，不能自动套用案例的产品事实、风格、费用、模型名称、部署操作或历史用户指令。


## 固定版本来源

- [yingxian-pagoda · a11c8c72](https://github.com/huangbai-AI/yingxian-pagoda/tree/a11c8c721a0a88318b3c859247b0cdcac8628064)
- [OpenWork · b6fe2554](https://github.com/huangbai-AI/OpenWork/tree/b6fe2554567cf86af66ce52e32d81911a37e59f2)
- [lumiq-parallax-collab · af6637fb](https://github.com/huangbai-AI/lumiq-parallax-collab/tree/af6637fb62fa62c9a5082612d3e625d5342112ae)
- [BaoshuMa · b17c4098](https://github.com/huangbai-AI/BaoshuMa/tree/b17c4098c8101289893c1f1f3fd3e49cfead994f)
- [chronos-lux3d · 681060a3](https://github.com/huangbai-AI/chronos-lux3d/tree/681060a314b66177718038522a54a346511642b8)
- [website-ppt-style-skill-refs · 82d734bb](https://github.com/huangbai-AI/website-ppt-style-skill-refs/tree/82d734bb8f5bc0a2eec7f4ff1735c33f9644e00e)
- [fs50p-watch-experience · b19f1ab2](https://github.com/huangbai-AI/fs50p-watch-experience/tree/b19f1ab296bddf77b55cd4ac6247be633b6bd499)
- [lumiq-website-public · b68977c6](https://github.com/huangbai-AI/lumiq-website-public/tree/b68977c614591ece8d18a8849167db5b10430d44)
- [private-daily · c49c879e](https://github.com/huangbai-AI/private-daily/tree/c49c879ebc0d3d7812aa7480e86f1b082a4895a9)
- [lumiqstudiovercel · 2a3af3f9](https://github.com/huangbai-AI/lumiqstudiovercel/tree/2a3af3f984e5f36cf6262de834c97054b7ac7d9a)
- [token-xiuxian · 56dcc7c9](https://github.com/huangbai-AI/token-xiuxian/tree/56dcc7c995f721783be8e3b0d84028d49f3416be)
- [aether-3d · 52e7c034](https://github.com/huangbai-AI/aether-3d/tree/52e7c034f9791a89c5a9b9d64e4793275da6bcad)
- [webdesigncase · 83193997](https://github.com/huangbai-AI/webdesigncase/tree/83193997038696597aa8b1e85197986724572770)

[返回学习入口](README.md)
