Image Analyzer

分析参考图像,提取关键视觉元素、颜色、布局、风格等信息,生成详细的视觉描述和代码实现建议。使用场景:用户发送参考图时,分析图片内容并生成实现代码。

davidme6 Updated

File contents

Image Analyzer Skill

功能

分析参考图像,提取:

  1. 视觉元素:家具、物品、人物等
  2. 颜色方案:主色调、辅助色、强调色
  3. 布局结构:位置、大小、比例
  4. 风格特征:卡通、写实、简约等
  5. 代码实现:生成对应的 Canvas 绘制代码

工作流程

  1. 接收用户发送的参考图
  2. 分析图片内容
  3. 提取关键信息
  4. 生成实现代码
  5. 输出详细报告

输出格式

## 图片分析

### 场景类型
卧室/厨房/客厅/浴室

### 家具清单
1. 衣柜 - 位置/颜色/大小
2. 床 - 位置/颜色/大小
3. 书柜 - 位置/颜色/大小
...

### 颜色方案
- 墙壁:#FFF8DC(米黄色)
- 地板:#DEB887(浅木色)
- 衣柜:#8B4513(棕色)
...

### 布局比例
- 衣柜:左侧 28% 宽度
- 窗户:中间 30% 宽度
- 书柜:右侧 28% 宽度
...

### 实现代码
[生成 Canvas 绘制代码]

使用示例

用户发送参考图

分析输出:

## 图片分析结果

### 场景:卧室

### 家具识别
1. 左侧衣柜(棕色双门)
2. 中间窗户(蓝色玻璃)
3. 窗户下床(蓝色床单)
4. 右侧书柜(彩色格子)

### 颜色提取
- 墙壁:#FFF8DC
- 地板:#DEB887
- 衣柜:#8B4513
...

### 代码实现
[生成完整的 scene.js 代码]

davidme6/self-learning-skill/tree/main/.agents/skills/image-analyzer commit a048eb66b9

Frequently asked questions

npx skillmds@latest add davidme6-self-learning-skill/image-analyzer