# VisNote Image Creator Skill Document

## 安装 Skill

首先，请下载并安装 VisNote Image Creator skill：https://github.com/katherine0325/visnote-image-creator.git

## 配置 API Key

安装完成后，需要配置 API Key 环境变量。

请用户提供他们的 VisNote API Key，格式为 Bearer Token。

API Key 获取方式：
1. 访问 VisNote 个人主页：https://vis-note.netlify.app/profile
2. 复制已生成的 API Key

配置API Key：
3. 复制skill项目的 example-config.json 文件，并重命名为 config.json
4. 将复制的 API Key 填入 config.json 的 "your_api_key_here" 位置即可

## 获取所有可用模板

在生成图片前，可以先获取所有可用模板及其数据结构：

**接口地址：** `GET /api/open/templates`

**请求参数：**
- `keyword`（可选）- 搜索关键字，可搜索模板的 name/desc/tags 字段

**示例：**
- 获取所有模板：`GET /api/open/templates`
- 搜索包含"封面"的模板：`GET /api/open/templates?keyword=封面`
- 搜索包含"正文"的模板：`GET /api/open/templates?keyword=正文`

**响应示例：**
```json
{
  "success": true,
  "data": [
    {
      "id": "yellow",
      "name": "高对比大字报",
      "desc": "适合：避坑/干货/教程",
      "image": "https://...",
      "tags": ["封面"],
      "value": {
        "title": "示例标题",
        "subtitle": "示例副标题",
        "tag": "标签",
        "color": "#EAB308"
      }
    },
    ...
  ]
}
```

**注意：**
1. `value` 字段展示了该模板所需的数据结构，可以作为参考来组装用户请求的数据

## 使用方法

生成图片的指令格式：

```
请帮我使用 visnote-image-creator skill 生成一张图片，模板是 {模板ID}，内容是 {JSON格式的模板数据}
```

**示例：**

```
请帮我使用 visnote-image-creator skill 生成一张图片，模板是 yellow，内容是 {
  "title": "小红书\n爆款标题",
  "subtitle": "3秒抓住用户注意力 | 涨粉秘籍",
  "tag": "干货分享",
  "color": "#EAB308"
}
```

**注意事项：**
1. 模板ID可以从模板列表接口获取
2. 模板数据需要严格匹配对应模板的 `value` 结构
3. 每次生图会消耗用户的 VisNote 配额
4. 数据中的换行符使用 `\n` 表示

## 工作流程

1. **安装 Skill**：先安装 VisNote Image Creator skill
2. **配置 API Key**：从用户获取 API Key 并配置环境变量
3. **获取模板**：调用 `/templates` 接口获取所有可用模板和数据结构
4. **生成图片**：根据用户需求选择合适的模板，组装数据后调用生图接口

## 常用模板参考

以下是一些常用模板的 ID：

- `yellow` - 高对比大字报（免费）
- `magazine` - 杂志风格
- `glass` - 玻璃拟态
- `wechat` - 微信风格
- `newspaper` - 报纸风格
- `singleCard` - 单卡片
- `academicNotes` - 学术笔记
- `memo` - 便签
- `letterhead` - 信纸

更多模板请调用 `/api/open/templates` 接口查看。