手工间小游戏设计

状态：首版已实施（2026-10-23）。

1. 整体定位

在「玩具」区增加「手工间」合集，首批包含织布机、剪纸、水面印花。 面向想随手创作、放松几分钟的玩家，每次体验以做出一件可以保存的小作品为目标。

三款游戏分别突出制作的节奏、展开成品的惊喜、颜色变化的自由探索。 以自由创作为主，不设置倒计时、输赢或评分；允许不规则和小失误成为作品的一部分。 目标是首次进入后约一分钟学会操作，三到十分钟完成第一件作品。

2. 小小织布机

**体验目标：**看着一根根线变成布，享受穿梭与压紧的重复节奏。

**核心流程：**选择经线配色 → 抬起一组经线 → 左右拖动梭子穿入纬线 → 压紧这一行 → 换组、换色并继续 → 收边、剪下成品。

• 首版采用俯视的小型织布机，提供两组交替抬线的平纹织法。 经线决定纵向颜色，每一行的纬线可单独换色，组合出条纹与格纹。
• 梭子穿过时能看清线的上下交错；压紧时布面收拢，配一声轻微的“咔哒”。 玩家决定何时完成，成品带流苏，可做成小杯垫或书签。
• 首版支持配色、逐行编织、撤销上一行和成品导出。 斜纹、自由抬线、背面查看和围巾等长幅作品作为后续扩展。

**完成标准：**玩家能独立织出一块有自选配色的布，每一步都看得出对成品的影响。

3. 剪纸窗花

**体验目标：**通过少量剪切获得复杂图案，在展开时得到惊喜。

**核心流程：**选择纸色与折法 → 在折好的纸上画出切口 → 剪下局部 → 继续修剪 → 展开 → 放到窗前查看成品。

• 首版提供两折、三折两种固定折法，折叠过程用动画交代。 从纸边画一条折线并回到纸边，切掉标示的一侧；闭合轮廓可剪出内部孔洞。
• 确认剪切前高亮将被移除的区域，剪下的纸屑短暂落下。 展开时逐层翻开，让玩家看到局部切口如何形成对称花纹。
• 首版支持连续剪切、撤销、展开预览与返回修剪，并提供一个简单窗景。 支持透明背景图片导出；自由折纸与立体纸雕留作后续扩展。

**完成标准：**切口与展开结果对应清楚，玩家至少能通过一次修剪改变最终图案。

4. 水面印花

**体验目标：**不需要绘画基础，也能通过滴色和拖动得到有层次的花纹。

**核心流程：**选择配色 → 向水面滴颜料 → 用针或梳子拖动花纹 → 放纸吸取 → 揭起纸张 → 保存作品。

• 颜料滴入后扩成色斑，后滴的颜色推开先前的颜色，保留清楚的色层。 针用来拉出局部弧线，梳子同时拉出多条细纹，形成羽毛纹或波浪纹。
• 首版提供滴管、针、梳子三种工具，以及几组可调整的配色。 优先保证拖动结果连续、可控，采用简化的二维色纹变形表现。
• 纸张覆盖水面后缓缓揭起，图案转印到带轻微纸纹的成品上。 支持撤销、重新开始和图片导出；复杂颜料混合与多种纸材留作后续扩展。

**完成标准：**滴色和拖动都能立即改变花纹，纸上保留玩家确认转印时的图案。

5. 共用体验与首版边界

• **界面：**中央放制作台，工具与颜色靠边排列，撤销和完成按钮始终容易找到。 电脑使用鼠标，手机使用点按与单指拖动；先选工具再操作，避免依赖悬停或右键。
• **反馈：**保留材料质感和必要的制作动效，音效可以关闭；关键反馈同时用画面表达。 减少动态效果时，折叠、展开与揭纸改为简短过渡。
• **保存：**首版在当前浏览器自动保存每款游戏的一份草稿，刷新后可以继续。 成品导出 PNG；开始新作前提示保存当前作品，保存失败时明确提示。
• **接入：**以纯客户端单人小游戏加入现有玩具区，沿用其访问与专注模式规则。 首版范围为三款独立创作体验及共用保存能力，作品广场、联机与鱼干奖励不在本轮范围。

6. 推进顺序与后续方向

建议依次制作织布机、剪纸、水面印花：先建立制作、撤销、保存和导出的完整流程， 再验证纸张切割与对称展开，最后打磨色纹变形和触屏拖动的流畅度。

首版验收关注四件事：新手能完成作品；操作与结果对应；刷新可恢复草稿； 电脑与手机都能完成并导出作品。实际手感和设备性能在原型阶段验证。

后续可增加制作过程回放、作品分享，以及每人贡献一小段的公共长布。 这些是可选扩展，尚未排期。

7. 首版落地

• 入口： 玩具 → 测试 → 手工间合集 /game/collections/test/craft → /game/loom、/game/papercut、/game/marbling， 与玩具区其它游戏共用专注模式闸门和 https 协议闸门。
• 纯客户端： 三个页面都只有薄服务端壳，制作状态、渲染、音效与导出全部在浏览器内完成， 没有新增库表、接口或鱼干奖励。
• 草稿： localStorage 各一份 —— craft-loom-v1、craft-papercut-v1、 craft-marbling-v1；挂载后读入，改动以 220ms 防抖写回。解析失败的旧数据直接忽略， 回到新作品状态。
• 导出： 织布与剪纸导出 PNG（剪纸保留透明底，可直接叠到窗景上）；水面印花导出 1600×1120 带纸纹的 PNG。
• 减少动态效果： 折叠、展开、铺纸与揭纸改为短过渡；编织与剪刀的提示音仍可关闭。
• 测试： 纯模型由 tests/unit/craft-{loom,papercut,marbling}.test.ts 覆盖； 完整操作链路（含刷新续作与 PNG 导出）在 tests/e2e/craft-games.spec.ts 里按桌面与手机 两种视口各跑一遍。