@lark-apaas/coding-steering 0.1.2 → 0.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lark-apaas/coding-steering",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Stack-specific steering content for miaoda-coding templates",
   "type": "module",
   "files": [

package/steering/html/skills/rich-interactive-design/SKILL.md

@@ -71,6 +71,7 @@ plan 中说明「主类 X，包含 Y 模块」即可。
 - 不区分桌面 / 移动端输入（PC 只 keydown / 移动端只 click）
 - 加载完成无 fade-in 过渡，首帧突现
 - 模拟 / 3D 场景里大面积装饰性紫蓝渐变背景（科幻味的廉价 AI 审美）
+- Canvas 2D 字符串颜色用 CSS Level 4 空格分隔语法（`hsl(200 90% 65%)` / `hsla(...)`）—— `addColorStop` / `fillStyle` / `strokeStyle` 只解析 Level 3 逗号分隔，空格分隔抛 `could not be parsed as a color`；CSS 上下文（`style.color` / CSS 变量 / Tailwind 配置）两种语法都支持，但写入 Canvas API 字符串参数（含模板字符串拼接）必须用逗号分隔 `hsla(200, 90%, 65%, 0.9)`
 
 ### 5.2 默认设计倾向
 
@@ -85,8 +86,10 @@ plan 中说明「主类 X，包含 Y 模块」即可。
 
 ### 5.3 资产策略
 
-- **程序化优先**：能用 SVG / Canvas / Three.js Geometry 画的就画，能用 Web Audio API 合成的就合成，不依赖外部资源
-- **GenerateImage 兑底**：复杂角色 sprite、场景背景、风格定调封面才用，产出以 base64 data URL 嵌入；详见各 task 文件
+- **路径按视觉目标选**（不分主次）：
+  - 抽象 / 程式化 / 卡通 → 程序化（SVG / Canvas / Three.js Geometry / Web Audio）
+  - 写实复刻"在用户脑子里有视觉标准答案"的真实物体（地球、人体、汽车……）→ CDN 贴图 + PBR + 真实模型（jsDelivr / threejs.org examples）；程序化几何模拟这类物体一定假
+  - 原创艺术内容（角色 sprite、风格化场景、封面）→ GenerateImage 兜底；详见各 task 文件
 - **图标**：禁止 emoji 充当功能性图标（导航 / 按钮 / 状态指示），用 Lucide 风格 inline SVG
 - **`<img>` alt**：每个 `<img>` 的 `alt` 必须有意义（描述图片内容），不要空 alt 或填文件名
 - **占位图**：禁用 placeholder.com 等外链占位服务；需要时用纯 CSS 占位框或程序化生成

package/steering/html/skills/rich-interactive-design/references/tasks/interactive-scene.md

@@ -217,6 +217,7 @@ const hits = raycaster.intersectObjects(targets, false);
 - **白屏到首帧突现**——没有 loading 进度
 - **纯 AmbientLight 全亮**——画面扁平如纸片
 - **MeshBasicMaterial 当主材质**——无光照响应，看着像未渲染
+- **Canvas 2D / 程序化生成写实物体纹理（地球、月球、人脸、汽车、知名建筑等"用户脑中有真实标准答案"的物体）**——一定会被识破为假；必须用 CDN 真实贴图
 - **不 dispose**——切场景内存爆炸，几次后 crash
 - **`setPixelRatio(devicePixelRatio)`**——高 dpr 手机直接卡死
 - **OrbitControls 不限制 polarAngle**——用户翻到地下看到悬空模型