Jammy/TrueGrowth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial TrueGrowth source import

Browse Source
This commit is contained in:
Jammy
2026-07-07 09:36:36 +08:00
commit 3b6781d695
2283 changed files with 691996 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
docs/user-manual/content/advanced/command-palette.mdx Normal file
View File

@@ -0,0 +1,38 @@
---
title: 命令面板
category: advanced
order: 9
---
# 命令面板
命令面板可以快速搜索并执行常用功能，适合高频操作和键盘流用户。
## 打开方式
- 快捷键：`Cmd + K`
- 菜单：左上角菜单 → **命令面板**
## 基本用法
1. 输入关键词筛选命令
2. 使用 ↑ / ↓ 选择
3. 按 **Enter** 执行
4. 按 **Esc** 退出
## 命令分类
命令按以下类别归类：
- 工具
- 编辑
- 视图
- AI
- 导出
- 设置
## 使用建议
:::tip
不记得具体位置时，直接在命令面板里搜索功能名称即可。
:::

129
docs/user-manual/content/advanced/export-import.mdx Normal file
View File

@@ -0,0 +1,129 @@
---
title: 导出与导入
category: advanced
order: 1
---
# 导出与导入
Opentu 支持多种格式的导出和导入，方便你保存和分享作品。
## 导出图片
### 导出为 PNG
1. 点击左上角的菜单按钮
2. 选择 **导出图片**
3. 选择 **PNG 格式**
**特点**：
- 支持透明背景
- 适合网页使用
- 文件较大
**快捷键**：`Ctrl/Cmd + Shift + E`
### 导出为 JPG
1. 点击菜单按钮
2. 选择 **导出图片**
3. 选择 **JPG 格式**
**特点**：
- 不支持透明背景
- 文件较小
- 适合照片类图片
## 导出选中区域
只想导出一部分？
1. 先选中要导出的元素
2. 再执行导出操作
只有选中的内容会被导出。
## 保存项目
### 保存为 JSON
将项目保存为 `.drawnix` 文件（实际是 JSON 格式）：
1. 点击菜单按钮
2. 选择 **保存文件**
3. 选择保存位置
**快捷键**：`Ctrl/Cmd + S`
### 打开项目
1. 点击菜单按钮
2. 选择 **打开文件**
3. 选择 `.drawnix` 文件
## 自动保存
Opentu 会自动保存你的工作：
- 数据保存在浏览器本地
- 刷新页面不会丢失
- 切换项目自动保存
:::tip
虽然有自动保存，但重要项目建议定期手动导出备份。
:::
## 备份与恢复
### 导出备份
可以将所有数据打包导出：
1. 点击菜单按钮
2. 选择 **备份 / 恢复**
<Screenshot id="backup-restore" alt="备份恢复对话框" />
3. 选择要备份的内容：
- 提示词历史
- 项目文件
- 素材库
4. 点击 **导出**
会下载一个 ZIP 文件，包含所有选中的数据。
### 导入备份
从备份文件恢复：
1. 点击菜单按钮
2. 选择 **备份恢复**
3. 选择要导入的 ZIP 文件
4. 选择要恢复的内容
5. 点击 **导入**
:::note
导入会与现有数据合并，不会覆盖。
:::
## 分享作品
想分享你的作品？
1. **导出为图片** - 分享到社交媒体
2. **导出为 JSON** - 发给其他 Opentu 用户
3. **截图分享** - 快速分享
## 常见问题
**Q：导出的图片太大/太小？**
A：导出的图片大小取决于画布上内容的实际尺寸。如果需要特定尺寸，可以先调整内容大小。
**Q：导出时背景是透明的？**
A：PNG 格式支持透明背景。如果需要白色背景，可以在画布底层添加一个白色矩形，或导出为 JPG 格式。
**Q：项目文件可以发给别人吗？**
A：可以。把 `.drawnix` 文件发给对方，对方用 Opentu 打开即可。

150
docs/user-manual/content/advanced/image-preview-edit.mdx Normal file
View File

@@ -0,0 +1,150 @@
---
title: 图片预览与编辑
category: advanced
order: 5
---
# 图片预览与编辑
Opentu 提供强大的图片预览和编辑功能，让你可以查看、裁剪、调整图片效果。
## 图片预览
<Screenshot id="image-preview" />
<p class="screenshot-caption">图片预览界面：① 关闭预览 ② 缩放控制 ③ 编辑工具</p>
### 打开预览
在画布上**双击**图片元素，即可打开全屏预览。
### 预览功能
预览界面支持：
- **缩放** - 滚轮缩放或点击 +/- 按钮
- **拖动** - 拖动查看大图细节
- **多图浏览** - 如果画布上有多张图片，可以左右切换
- **联动模式** - 多图时可开启同步缩放/拖动（按 `S` 键切换）
### 预览工具栏
| 按钮 | 功能 |
|------|------|
| 缩放滑块 | 调整图片大小 |
| 适应窗口 | 让图片适应当前窗口 |
| 原始大小 | 以 100% 比例显示 |
| 上一张/下一张 | 切换图片 |
| 联动模式 | 多图同步操作 |
## 图片编辑
### 进入编辑模式
1. 在画布上选中图片
2. 点击弹出工具栏中的 **编辑** 按钮（画笔图标）
或者在预览界面中点击 **编辑** 按钮。
### 编辑界面
图片编辑器提供两大功能：
## 裁剪功能
点击 **裁剪** 按钮进入裁剪模式：
### 自由裁剪
直接拖动裁剪框的边缘或角落，调整裁剪区域。
### 比例裁剪
选择预设的宽高比：
- **自由** - 任意比例
- **1:1** - 正方形
- **4:3** - 传统照片比例
- **16:9** - 宽屏比例
- **9:16** - 竖屏比例
- **原始** - 保持原图比例
### 智能去白边
点击 **自动去白边** 按钮，自动检测并裁剪掉图片的白色边框。
:::tip
这个功能对 AI 生成的图片特别有用，可以快速去除多余的白边。
:::
## 滤镜调整
点击 **滤镜** 按钮进入调整模式：
### 预设滤镜
选择预设滤镜效果：
- **原图** - 恢复原始效果
- **鲜艳** - 增强饱和度和对比度
- **柔和** - 降低对比度，更柔美
- **复古** - 怀旧暖色调
- **黑白** - 经典黑白效果
- **冷色** - 蓝色冷调
- **暖色** - 橙色暖调
### 手动调节
使用滑块精细调整：
- **亮度** - 整体明暗
- **对比度** - 明暗差异
- **饱和度** - 色彩鲜艳程度
- **色温** - 冷暖色调
- **锐化** - 图片清晰度
## 保存编辑
编辑完成后，有三种保存方式：
### 覆盖原图
点击 **保存** 按钮，直接覆盖画布上的原图。
### 另存为新图
点击 **另存为** 按钮，保留原图，在画布上创建新的图片。
### 下载
点击 **下载** 按钮，将编辑后的图片保存到本地。
### 放弃编辑
点击 **X** 关闭按钮或按 `Esc` 键，放弃所有修改。
## 撤销和重做
编辑过程中支持撤销重做：
- **撤销** - 点击工具栏的撤销按钮，或按 `Ctrl/Cmd + Z`
- **重做** - 点击重做按钮，或按 `Ctrl/Cmd + Y`
## 快捷键
| 快捷键 | 功能 |
|--------|------|
| `Ctrl/Cmd + Z` | 撤销 |
| `Ctrl/Cmd + Y` | 重做 |
| `Esc` | 取消/退出编辑 |
| `Enter` | 确认操作 |
## 小贴士
:::tip
编辑大图时可能需要等待一会儿，请耐心等待处理完成。
:::
:::tip
如果对编辑效果不满意，可以随时撤销或重新开始。
:::
:::note
SVG 格式的图片暂不支持编辑功能。
:::

75
docs/user-manual/content/advanced/knowledge-base.mdx Normal file
View File

@@ -0,0 +1,75 @@
---
title: 知识库
category: advanced
order: 7
---
# 知识库
知识库是你的个人知识管理空间，支持目录、标签、搜索、导入导出，并可将笔记插入到画布。
## 打开知识库
1. 点击 **工具箱**
2. 找到 **知识库**
3. 点击 **打开** 或 **新窗口**
## 界面结构
- **左侧栏**：搜索、标签筛选、目录树、笔记列表
- **中间**：笔记编辑区（Markdown 编辑）
- **右侧**：相似笔记与知识提取
## 目录与笔记
### 默认目录
- **笔记**：通用知识与灵感记录
- **Skill**：自定义 Skill 的专用目录
### 目录操作
在目录上右键可以：
- 新建笔记
- 复制目录
- 重命名
- 删除
### 笔记操作
在笔记上右键可以：
- 创建副本
- 插入到画布（生成关联卡片）
- 删除
## 标签与检索
- 在顶部搜索框中输入关键词快速定位
- 使用标签筛选笔记
- 在菜单中选择 **管理标签** 进行维护
## 导入与导出
在左上角 **更多操作** 菜单中可以：
- **导入 Markdown**：批量导入 `.md` / `.markdown`
- **导入 ZIP**：导入完整的知识库备份
- **导出 ZIP**：打包导出全部目录、笔记和标签
:::note
导入内容会与现有数据合并，不会覆盖已有笔记。
:::
## 知识提取
在右侧切换到 **知识提取**：
1. 让 AI 归纳关键知识点
2. 选择需要的条目
3. 保存为笔记或合并为一篇
## Skill 目录用法
- **系统 Skill** 会以只读笔记显示
- **自定义 Skill**：在 Skill 目录新建笔记，写清楚角色、输入与输出格式
- 保存后即可在 AI 输入框的 Skill 下拉中选择

94
docs/user-manual/content/advanced/media-library.mdx Normal file
View File

@@ -0,0 +1,94 @@
---
title: 素材库
category: advanced
order: 2
---
# 素材库
素材库用于管理你的图片和视频素材，包括 AI 生成的和手动上传的。
## 打开素材库
点击底部工具栏的 **素材库** 按钮，或点击底部的图库图标。
<Screenshot id="media-library" alt="素材库面板" />
## 素材来源
素材库中的素材有两种来源：
### AI 生成
所有通过 AI 生成的图片和视频都会自动保存到素材库。
### 手动上传
你也可以手动上传图片：
1. 打开素材库
2. 点击 **上传** 按钮
3. 选择本地图片文件
## 使用素材
### 插入到画布
1. 在素材库中找到想要的图片
2. 点击图片
3. 图片会自动插入到画布中
### 作为参考图
在 AI 生成图片时：
1. 点击输入框的图片图标
2. 选择 **素材库**
3. 选择要参考的图片
## 管理素材
### 查看详情
点击素材可以查看大图和详细信息。
### 删除素材
1. 选中素材
2. 点击删除按钮
:::note
删除素材不会影响已经插入画布的图片。
:::
### 筛选素材
可以按类型筛选：
- **全部** - 显示所有素材
- **图片** - 只显示图片
- **视频** - 只显示视频
## 存储说明
素材保存在浏览器本地存储中：
- **优点**：无需登录，数据在本地，隐私安全
- **注意**：清除浏览器数据会丢失素材
:::tip
重要素材建议使用 **备份恢复** 功能定期导出备份。
:::
## 常见问题
**Q：素材库满了怎么办？**
A：可以删除不需要的素材释放空间。或者导出备份后清理。
**Q：换电脑/换浏览器素材还在吗？**
A：不在。素材保存在当前浏览器中。需要使用 **备份恢复** 功能迁移数据。
**Q：素材库支持多大的文件？**
A：取决于浏览器的存储限制，一般几百 MB 到几 GB 不等。

151
docs/user-manual/content/advanced/settings.mdx Normal file
View File

@@ -0,0 +1,151 @@
---
title: 设置与配置
category: advanced
order: 3
---
# 设置与配置
了解如何配置 Opentu 的各项设置，包括 API 配置、主题切换等。
## 打开设置
点击左上角的菜单按钮，打开应用菜单：
<Screenshot id="app-menu" alt="应用菜单" />
选择 **设置** 打开设置对话框：
<Screenshot id="settings-dialog" alt="设置对话框" />
## API 配置
要使用 AI 生成功能，需要配置 API。
### 图片生成 API
1. 打开设置 → **图片生成** 选项卡
2. 填写 **API Key**
3. 填写 **API 地址**（如有需要）
4. 点击保存
**获取 API Key**：
- 可以使用 [tu-zi.com](https://tu-zi.com) 提供的 API 服务
- 或使用自己的 Gemini API Key
### 视频生成 API
1. 打开设置 → **视频生成** 选项卡
2. 配置视频 API 相关信息
3. 保存设置
## 主题切换
支持亮色和暗色两种主题：
1. 点击右下角的主题切换按钮
2. 或在设置中选择主题模式
**亮色主题**：适合白天使用，背景明亮
**暗色主题**：适合夜间使用，保护眼睛
## 语言设置
支持中文和英文界面：
1. 打开设置
2. 找到语言选项
3. 选择 **中文** 或 **English**
## 数据存储
### 本地存储
Opentu 的数据存储在浏览器本地：
- **项目文件** - 你的画布内容
- **素材库** - 上传和生成的图片视频
- **提示词历史** - 使用过的提示词
- **设置** - 你的配置信息
### 存储位置
数据保存在：
- IndexedDB - 大文件存储
- LocalStorage - 配置信息
- Cache Storage - 缓存数据
### 数据安全
- 数据不会上传到服务器
- 只保存在你的浏览器中
- 清除浏览器数据会丢失
:::tip
重要数据请定期使用 **备份恢复** 功能导出备份。
:::
## 清除数据
如需清除数据：
### 清除当前画布
1. 点击菜单 → **清空画布**
2. 确认清除
**快捷键**：`Ctrl/Cmd + Backspace`
### 清除所有数据
1. 打开浏览器设置
2. 清除网站数据
3. 选择 opentu.ai 的数据
:::note
清除后无法恢复，请先备份重要内容。
:::
## 快捷键设置
目前使用系统默认快捷键，暂不支持自定义。
常用快捷键参考首页的快捷键列表。
## 移动端适配
Opentu 支持在移动设备上使用：
- **触摸操作** - 支持手指缩放和拖动
- **响应式布局** - 自动适应屏幕大小
- **工具栏适配** - 底部工具栏优化
### 移动端特殊操作
- **双指缩放** - 缩放画布
- **单指拖动** - 移动画布（手形模式）
- **长按** - 触发右键菜单
## 常见问题
**Q：设置保存在哪里？**
A：保存在浏览器的 LocalStorage 中，换浏览器需要重新配置。
**Q：API Key 安全吗？**
A：API Key 只保存在你的浏览器本地，不会上传到服务器。但请注意不要在公共电脑上配置。
**Q：为什么 AI 功能不可用？**
A：请检查：
1. API Key 是否正确配置
2. API 地址是否正确
3. 网络是否正常
4. API 额度是否充足
**Q：如何迁移到新电脑？**
A：使用 **备份恢复** 功能：
1. 在旧电脑导出备份 ZIP 文件
2. 在新电脑导入该 ZIP 文件

51
docs/user-manual/content/advanced/task-queue.mdx Normal file
View File

@@ -0,0 +1,51 @@
---
title: 任务队列
category: advanced
order: 8
---
# 任务队列
任务队列用于管理所有 AI 生成任务，支持图片、视频与角色相关任务的追踪、筛选与批量操作。
## 打开任务队列
点击右侧工具栏底部的 **任务队列** 按钮即可展开面板。
## 任务状态
顶部 Tab 支持快速切换：
- **全部** - 查看所有任务
- **生成中** - 正在处理的任务
- **失败** - 需要重试的任务
- **已完成** - 可插入或下载的任务
## 筛选与搜索
- 类型过滤：图片 / 视频 / 角色
- 搜索框：按提示词或内容关键字检索
## 单个任务操作
任务卡片提供常用操作：
- **插入**：将生成结果插入到画布
- **下载**：保存到本地
- **编辑**：进入内置编辑器继续处理
- **重试**：失败任务一键重试
- **删除**：移除任务记录
## 批量操作
点击 **多选** 进入批量模式后，可以：
- **取消** 进行中的任务
- **重试** 失败任务
- **删除** 选中任务
## 常见提示
:::tip
生成完成的图片或视频会自动进入素材库，方便后续复用。
:::

164
docs/user-manual/content/advanced/toolbox.mdx Normal file
View File

@@ -0,0 +1,164 @@
---
title: 工具箱
category: advanced
order: 6
---
# 工具箱
工具箱是 Opentu 的扩展功能中心，提供各种实用工具来增强你的创作体验。
## 打开工具箱
<Screenshot id="toolbox-entry" />
<p class="screenshot-caption">点击工具箱按钮打开工具箱</p>
点击右侧工具栏的 **打开工具箱** 按钮。
<Screenshot id="toolbox-drawer" />
<p class="screenshot-caption">工具箱抽屉：内容工具和 AI 工具</p>
## 工具分类
工具箱中的工具分为两大类：
### 内容工具
提供创作素材和灵感的工具：
| 工具 | 功能 |
|------|------|
| **香蕉提示词** | 查看和复制优质 AI 提示词 |
| **动作场景库** | 专业人体姿态参考素材库 |
| **知识库** | 个人知识管理与 Skill 管理 |
### AI 工具
AI 驱动的创作工具：
| 工具 | 功能 |
|------|------|
| **Chat-MJ** | ChatGPT Web 聊天界面，支持 Midjourney |
| **批量出图工具** | Excel式批量 AI 图片生成 |
| **AI 图片生成（单图）** | 专业 AI 图片创作工具 |
| **AI 视频生成** | AI 驱动的短视频创作 |
## 使用工具
### 方法一：在抽屉中打开
1. 点击工具项右侧的 **打开** 按钮
2. 工具会在侧边面板中显示
### 方法二：独立窗口打开
1. 点击工具项右侧的 **新窗口** 按钮（带外链图标）
2. 工具会在独立的浮动窗口中打开
### 独立窗口功能
独立窗口可以：
- **拖动** - 移动窗口位置
- **调整大小** - 拖动边缘改变窗口大小
- **最小化** - 缩小到角落
- **关闭** - 关闭窗口
## 香蕉提示词
这是一个提示词库，收集了各种优质的 AI 绘图提示词：
### 浏览分类
提示词按风格分类：
- 人物
- 风景
- 动物
- 抽象艺术
- 更多...
### 使用提示词
1. 找到喜欢的提示词
2. 点击 **复制** 按钮
3. 粘贴到 AI 输入框使用
## 批量出图工具
需要批量生成图片时，使用这个工具：
### 表格编辑
像 Excel 一样编辑多行提示词：
- 每行一条提示词
- 支持批量编辑
- 支持图片参考
### 批量生成
1. 填写提示词列表
2. 选择模型和设置
3. 点击开始批量生成
4. 查看生成进度和结果
### 历史追踪
所有生成记录会保存，可以随时查看历史任务。
## 知识库
知识库是你的个人素材与知识管理区，适合记录灵感、规范、项目资料，并支持自定义 Skill。
### 快速打开
1. 在工具箱中找到 **知识库**
2. 点击 **打开** 或 **新窗口**
### 常见用法
- 记录笔记并按目录管理
- 使用标签快速筛选
- 将笔记插入到画布作为卡片
## 动作场景库
提供人体动作参考素材：
### 分类浏览
- 站立姿势
- 坐姿
- 动作姿势
- 多角度参考
### 使用方法
1. 浏览找到需要的姿势
2. 点击查看大图
3. 可以作为 AI 生成的参考
## 工具筛选
### 搜索工具
在搜索框输入关键词，快速找到需要的工具。
### 分类筛选
点击分类标签筛选：
- **全部** - 显示所有工具
- **内容工具** - 只显示内容类工具
- **AI 工具** - 只显示 AI 类工具
## 小贴士
:::tip
常用的工具可以用独立窗口打开，边创作边使用。
:::
:::tip
批量出图工具非常适合需要大量图片的场景，比如制作系列图片。
:::
:::note
部分工具需要网络连接才能使用。
:::

197
docs/user-manual/content/advanced/troubleshooting.mdx Normal file
View File

@@ -0,0 +1,197 @@
---
title: 问题排查
category: advanced
order: 4
---
# 问题排查
遇到问题不要慌，本文介绍如何排查和解决常见问题。
## 调试面板
Opentu 提供了一个内置的调试面板，可以帮助定位问题。
### 打开调试面板
在浏览器地址栏输入对应环境的调试面板地址：
| 环境 | 调试面板地址 |
|------|-------------|
| 正式环境 | [https://opentu.ai/sw-debug.html](https://opentu.ai/sw-debug.html) |
| 体验环境 | [https://pr.opentu.ai/sw-debug.html](https://pr.opentu.ai/sw-debug.html) |
**规则**：在当前应用地址后面加 `/sw-debug.html`
### 调试面板功能
调试面板界面如下：
<Screenshot id="debug-panel" alt="调试面板" />
调试面板提供以下功能：
#### 1. Service Worker 状态
显示当前 Service Worker 的运行状态：
- **已连接**（绿色）- 正常工作
- **未连接**（红色）- 需要排查
#### 2. 导出诊断日志
点击 **导出日志** 按钮，会下载一个 JSON 文件，包含：
- 任务队列状态
- API 请求日志
- 错误信息
:::tip
遇到问题时，导出日志文件发给开发者，可以帮助快速定位问题。
:::
#### 3. 数据备份
在调试面板中也可以进行数据备份：
- 点击 **数据备份** 按钮
- 选择要备份的内容
- 下载 ZIP 文件
#### 4. 清除缓存
如果应用出现异常（如页面空白、功能失效），可以尝试清除缓存：
- 点击 **清除缓存** 按钮
- 刷新页面
:::note
清除缓存不会删除你的项目和素材，只会清除应用程序的缓存文件。
:::
## 常见问题
### AI 生成功能不可用
**症状**：点击发送后没有反应，或提示错误
**排查步骤**：
1. **检查网络连接**
- 确保网络正常
- 尝试刷新页面
2. **检查 API 配置**
- 打开 **菜单 → 设置**
- 确认 API Key 已正确填写
- 确认 API 地址正确
3. **检查 API 额度**
- 登录 API 服务商后台查看余额
4. **查看调试面板**
- 打开 `sw-debug.html`
- 查看是否有错误日志
### 页面加载缓慢或空白
**症状**：页面长时间白屏或加载很慢
**解决方法**：
1. **清除浏览器缓存**
- 打开调试面板
- 点击 **清除缓存**
- 刷新页面
2. **硬刷新**
- Windows: `Ctrl + Shift + R`
- Mac: `Cmd + Shift + R`
3. **检查浏览器兼容性**
- 推荐使用 Chrome、Edge、Safari 最新版
- 不建议使用 IE 浏览器
### 素材库图片不显示
**症状**：素材库中的图片显示为空白或加载失败
**解决方法**：
1. **检查存储空间**
- 浏览器本地存储可能已满
- 删除不需要的素材释放空间
2. **清除并重新缓存**
- 打开调试面板
- 查看缓存状态
- 尝试清除异常的缓存项
### 数据丢失
**症状**：项目或素材突然消失
**可能原因**：
1. **浏览器数据被清除**
- 检查是否使用了"清理工具"
- 检查浏览器隐私设置
2. **使用了无痕/隐私模式**
- 无痕模式关闭后数据会丢失
- 请使用正常模式
**预防措施**：
- 定期使用 **备份恢复** 功能导出数据
- 重要项目及时导出为 PNG 或 JSON 文件
### 视频生成一直等待
**症状**：视频任务长时间显示"处理中"
**说明**：
视频生成需要较长时间（1-5 分钟甚至更长），这是正常的。
**如果超过 10 分钟**：
1. 在任务队列中查看任务状态
2. 如果显示失败，点击 **重试**
3. 检查调试面板中的错误日志
### 快捷键不生效
**可能原因**：
1. **焦点在输入框中**
- 点击画布空白区域，确保焦点在画布上
2. **与浏览器快捷键冲突**
- 某些快捷键可能被浏览器占用
- 尝试使用工具栏按钮代替
3. **输入法干扰**
- 切换到英文输入法
- 关闭输入法后重试
## 获取技术支持
如果以上方法无法解决问题：
### 1. 收集信息
- 打开调试面板，导出日志
- 截图问题界面
- 记录操作步骤
### 2. 联系方式
- **GitHub Issues**: [提交问题](https://github.com/ljquan/aitu/issues)
- **用户交流群**: 扫码加入
<img src="https://tuziai.oss-cn-shenzhen.aliyuncs.com/aitu/AiTu.png" alt="用户交流群二维码" style="max-width: 180px; border-radius: 8px;" />
### 3. 提交问题时请包含
- 问题描述
- 操作步骤
- 浏览器版本
- 导出的日志文件（如有）
- 截图（如有）

165
docs/user-manual/content/ai-generation/image-generation.mdx Normal file
View File

@@ -0,0 +1,165 @@
---
title: AI 生成图片
category: ai-generation
order: 1
---
# AI 生成图片
只需输入文字描述，Opentu 就能帮你生成精美图片。支持多种 AI 模型，可选择不同尺寸。
## 快速开始
### 第 1 步：输入描述
在页面底部的输入框中，用文字描述你想要的图片。
<Screenshot id="ai-step-0" alt="AI 输入框" />
**示例描述：**
- "一只橙色的猫咪在阳光下打盹"
- "未来城市的夜景，霓虹灯闪烁"
- "水彩风格的山水画"
<Screenshot id="ai-step-1" alt="输入提示词" />
### 第 2 步：选择模型（可选）
点击输入框左侧的 **#** 按钮，可以选择不同的 AI 模型。
<Screenshot id="ai-step-2" alt="选择模型" />
**可用模型：**
| 模型 | 特点 | 推荐场景 |
|------|------|----------|
| nano-banana | 速度快，效果稳定 | 日常使用 |
| nano-banana-pro | 支持高清/2K/4K | 需要高分辨率 |
### 第 3 步：选择尺寸（可选）
点击尺寸按钮，选择图片比例：
- **1:1** - 正方形，适合头像、社交媒体
- **16:9** - 横向宽屏，适合壁纸、封面
- **9:16** - 竖向，适合手机壁纸、海报
- **4:3** - 传统比例
### 第 4 步：发送生成
点击发送按钮或按 **Enter** 键，开始生成。
<Screenshot id="ai-step-3" alt="准备发送" />
生成通常需要 10-30 秒，完成后图片会自动插入画布。
## 提示词技巧
想要更好的生成效果？试试这些技巧：
### 描述越具体越好
- **一般**："一只猫"
- **更好**："一只毛茸茸的橙色虎斑猫，躺在阳台上晒太阳，背景是蓝天白云"
### 加入风格描述
- "油画风格的..."
- "水彩画效果..."
- "3D 渲染的..."
- "动漫风格..."
- "写实照片..."
### 描述构图
- "特写镜头"
- "俯视角度"
- "全景画面"
- "居中构图"
## 参考图生成
除了文字描述，你还可以上传参考图片，让 AI 参考生成。
1. 点击输入框左侧的 **图片** 图标
2. 选择本地图片或从素材库选择
3. 输入描述，发送生成
## 批量生成
需要生成多张图片？
1. 点击工具栏的 **AI 工具** → **批量生成**
2. 输入多条提示词（每行一条）
3. 选择模型和尺寸
4. 点击开始批量生成
## Agent 模式与 Skill
在输入框中切换 **生成类型 → Agent**，可以使用 Skill 来完成流程图、思维导图、PPT 生成等任务。
### 使用系统 Skill
1. 点击输入框左侧的 **Skill** 下拉框
2. 选择需要的 Skill
3. 输入指令并发送
**系统内置 Skill：**
- **灵感图** - 生成灵感拼贴图并插入画布
- **宫格图** - 生成整齐的九宫格图片墙
- **流程图** - 自动生成 Mermaid 流程图并插入画布
- **思维导图** - 生成 Markdown 思维导图并插入画布
- **SVG 矢量图** - 生成 SVG 图标/Logo 并插入画布
- **PPT 演示** - 生成演示文稿大纲并自动布局
- **产品经理** - 结构化输出需求文档模板
### 自动模式
Skill 选择 **自动** 时，系统会根据你的指令自动选择合适的能力。
### 添加自定义 Skill
1. 在 Skill 下拉框点击 **添加 Skill**
2. 知识库会自动打开到 **Skill** 目录
3. 新建笔记并编写 Skill 指令（角色、输入、输出格式等）
4. 保存后即可在 Skill 下拉框中选择
## 管理生成任务
### 查看进度
点击右下角的 **任务队列** 按钮，可以看到所有生成任务的状态。
### 重试失败任务
如果生成失败，可以在任务队列中点击 **重试** 按钮。
### 查看历史
所有生成的图片会保存在 **素材库** 中，随时可以使用。
## 常见问题
**Q：生成失败怎么办？**
A：可能的原因：
1. 网络连接问题 - 检查网络
2. API 配置错误 - 在设置中检查 API Key
3. 描述包含敏感内容 - 修改描述重试
**Q：生成速度慢？**
A：生成时间取决于：
- 选择的模型
- 图片尺寸
- 当前服务器负载
建议使用 nano-banana 模型获得更快的速度。
**Q：如何提高生成质量？**
A：
1. 使用更详细的描述
2. 指定艺术风格
3. 描述光线和氛围
4. 尝试不同的模型

122
docs/user-manual/content/ai-generation/image-split.mdx Normal file
View File

@@ -0,0 +1,122 @@
---
title: 智能拆分图片
category: ai-generation
order: 3
---
# 智能拆分图片
将一张图片拆分成九宫格，发朋友圈超有格调！Opentu 支持 AI 生成可拆分的图片，一键完成。
## 效果展示
<img src="../../product_showcase/九宫格拆图.gif" alt="九宫格拆图演示" style="max-width: 100%; border-radius: 8px;" />
只需输入描述，AI 会生成一张完整的图片，然后自动拆分成九宫格。
## 如何使用
### 方法一：使用灵感模板
最简单的方式：
1. 新建一个空白画布
2. 在灵感创意板中找到 **九宫格拆图** 模板
3. 点击使用
4. 根据需要修改提示词
5. 点击发送
### 方法二：直接描述
在输入框中描述你想要的图片内容，AI 会理解并生成适合拆分的图片。
**提示词技巧：**
- 描述一个完整的场景或画面
- 避免太多零散的元素
- 适合拆分的通常是风景、人物全身照、艺术画等
**好的描述示例：**
- "一片樱花林，粉色花瓣飘落，蓝天白云背景"
- "城市夜景全景图，霓虹灯闪烁"
- "一只大猫咪正面特写，背景纯色"
## 拆分操作
### 自动拆分
AI 生成图片后，如果检测到适合拆分的图片，会提供拆分选项：
1. 点击图片上的 **拆分** 按钮
2. 选择拆分方式（2x2、3x3 等）
3. 确认后自动生成拆分后的小图
### 手动拆分
对于已有的图片：
1. 选中画布上的图片
2. 右键菜单选择 **拆分图片**
3. 选择拆分网格
## 拆分格式
| 格式 | 数量 | 适用场景 |
|------|------|----------|
| 2x2 | 4 张 | 简单拼图 |
| 3x3 | 9 张 | 朋友圈九宫格 |
| 2x3 | 6 张 | 特殊布局 |
## 保存和使用
### 批量保存
拆分后的图片可以：
1. **全部选中** - 框选所有拆分后的小图
2. **导出** - 按 `Ctrl/Cmd + Shift + E` 导出为图片
3. **保存到本地** - 每张小图单独保存
### 发朋友圈
1. 按顺序保存 9 张图（从左上到右下）
2. 发朋友圈时按相同顺序选择
3. 发布后会呈现完整的拼图效果
:::tip
朋友圈九宫格的顺序是：
```
1 2 3
4 5 6
7 8 9
```
保存时注意按这个顺序命名或选择。
:::
## 最佳实践
### 图片尺寸
- 生成时选择 **1:1** 比例最适合九宫格
- 分辨率越高，拆分后的小图越清晰
### 画面构图
- **居中构图** - 主体在中间，四周有延伸
- **全景构图** - 大场景，元素分布均匀
- **对称构图** - 左右或上下对称的画面
### 避免的情况
- 主体太小，拆分后某些格子会很空
- 文字内容，拆分后可能被切断
- 太多细节集中在一处
## 小贴士
:::tip
九宫格最吸引眼球的位置是中间那张（第5张），重点内容放在画面中心。
:::
:::note
如果对 AI 生成的图片不满意，可以重新生成或调整提示词再试。
:::

90
docs/user-manual/content/ai-generation/inspiration-board.mdx Normal file
View File

@@ -0,0 +1,90 @@
---
title: 灵感创意板
category: ai-generation
order: 2
---
# 灵感创意板
不知道生成什么？灵感创意板提供各种创作模板，点击即可快速开始。
## 什么是灵感创意板？
当画布为空时，AI 输入框上方会自动显示灵感创意板，里面有各种预设的创作模板。
<Screenshot id="inspiration-step-1" alt="灵感创意板" />
每个模板都配有精心设计的提示词，只需点击就能直接使用。
## 如何使用
### 第 1 步：浏览模板
灵感创意板展示多种创作模板：
- **智能拆分宫格图** - 将图片拆分为九宫格
- **艺术风格** - 各种艺术风格的图片
- **实用场景** - 封面、海报、头像等
### 第 2 步：选择模板
点击你感兴趣的模板卡片。
<Screenshot id="inspiration-step-2" alt="选择模板后" />
模板的提示词会自动填充到输入框中。
### 第 3 步：调整发送
你可以：
- **直接发送** - 使用模板默认的提示词
- **修改提示词** - 根据需要调整描述
- **更换模型/尺寸** - 选择合适的设置
## 模板分类
### 智能拆分
适合制作：
- 朋友圈九宫格
- 拼图海报
- 系列图片组
**特点**：输入一段描述，AI 会自动生成可拆分的图片，一键拆成九宫格。
### 艺术创作
适合制作：
- 插画作品
- 概念艺术
- 创意海报
**特点**：预设了各种艺术风格的提示词，如水彩、油画、赛博朋克等。
### 实用场景
适合制作：
- 社交媒体配图
- 产品展示图
- 文章封面
**特点**：针对实际使用场景优化的模板。
## 小贴士
:::tip
灵感创意板会不定期更新新模板，记得常来看看有什么新创意！
:::
:::note
画布上有内容时，灵感创意板会自动隐藏。想再次查看？清空画布或新建项目即可。
:::
## 更多灵感来源
除了灵感创意板，你还可以：
1. **查看素材库** - 浏览之前生成的图片
2. **历史提示词** - 复用之前用过的描述
3. **参考其他作品** - 从网上找灵感，用自己的话描述

174
docs/user-manual/content/ai-generation/video-generation.mdx Normal file
View File

@@ -0,0 +1,174 @@
---
title: AI 生成视频
category: ai-generation
order: 4
---
# AI 生成视频
Opentu 支持多种 AI 视频生成模型，只需输入描述或提供图片，就能生成精彩的视频。
## 支持的模型
| 模型 | 特点 |
|------|------|
| **Veo3** | Google 视频模型，高质量生成 |
| **Veo3 Pro** | 增强版，更好的画质和细节 |
| **Veo3.1** | 支持首尾帧控制 |
| **Veo3.1 Pro** | 多图参考，更精确控制 |
| **Sora-2** | OpenAI 视频模型 |
| **Sora-2 Pro** | 增强版 Sora |
## 文字生成视频
最简单的方式，只需文字描述：
### 第 1 步：打开视频生成
1. 点击输入框旁边的 **#** 按钮
2. 切换到 **视频** 模式
### 第 2 步：输入描述
描述你想要的视频内容，如：
- "一只猫咪在草地上奔跑，阳光明媚"
- "城市街道的延时摄影，车流穿梭"
- "海浪拍打礁石，日落时分"
### 第 3 步：选择模型
点击模型选择器，选择合适的模型。
**建议**：
- 普通使用选 **Veo3** 或 **Sora-2**
- 需要高质量选 **Pro** 版本
### 第 4 步：发送生成
点击发送按钮，开始生成。
:::note
视频生成需要较长时间（通常 1-5 分钟），请耐心等待。生成过程中可以继续其他操作。
:::
## 图片生成视频
用一张图片作为起点，生成动态视频：
### 第 1 步：添加参考图
1. 点击输入框的 **图片** 图标
2. 选择本地图片或从素材库选择
### 第 2 步：描述动态效果
告诉 AI 你希望图片如何动起来：
- "让人物转头微笑"
- "让背景的云朵飘动"
- "镜头缓缓推进"
### 第 3 步：生成
选择支持图生视频的模型，发送生成。
## 首尾帧控制（Veo3.1）
需要更精确控制视频？使用首尾帧功能：
### 什么是首尾帧
- **首帧** - 视频开始的画面
- **尾帧** - 视频结束的画面
AI 会生成从首帧过渡到尾帧的视频。
### 如何使用
1. 选择 **Veo3.1** 或 **Veo3.1 Pro** 模型
2. 上传首帧图片（必须）
3. 上传尾帧图片（可选）
4. 描述过渡效果
5. 发送生成
**示例**：
- 首帧：日出前的天空
- 尾帧：太阳升起后的天空
- 描述："日出过程，光线逐渐变亮"
## 任务管理
### 查看进度
视频生成需要时间，可以在 **任务队列** 中查看进度：
1. 点击右下角的任务图标
2. 找到你的视频生成任务
3. 查看当前进度
### 后台生成
视频在后台生成，你可以：
- 继续其他创作
- 刷新页面也不会中断
- 关闭标签页后任务会继续
### 生成完成
生成完成后：
- 会收到通知
- 视频自动添加到素材库
- 可以插入到画布使用
## 提示词技巧
### 描述动作
- "缓慢移动" / "快速奔跑"
- "镜头推进" / "镜头拉远"
- "旋转" / "飘动" / "闪烁"
### 描述时长和节奏
- "3秒循环动画"
- "慢动作效果"
- "延时摄影风格"
### 描述氛围
- "电影质感"
- "梦幻效果"
- "复古滤镜"
## 常见问题
**Q：生成失败怎么办？**
A：
1. 检查网络连接
2. 检查 API 配置
3. 简化描述后重试
4. 在任务队列中点击"重试"
**Q：视频时长有限制吗？**
A：不同模型有不同限制，一般在 3-10 秒。
**Q：可以生成有声音的视频吗？**
A：部分模型支持，请参考具体模型说明。
**Q：视频可以下载吗？**
A：可以。在素材库中找到视频，右键保存或使用下载按钮。
## 小贴士
:::tip
视频生成比图片更耗时，建议先用图片生成确认效果，满意后再生成视频。
:::
:::tip
如果有特定的画面想要，先用 AI 生成图片，再用图片生成视频，效果更可控。
:::

144
docs/user-manual/content/basics/canvas-navigation.mdx Normal file
View File

@@ -0,0 +1,144 @@
---
title: 画布操作
category: getting-started
order: 1
---
# 画布操作
Opentu 提供无限画布，你可以自由拖动、缩放，拥有无限的创作空间。
<Screenshot id="canvas-tools" />
<p class="screenshot-caption">工具栏中的手形工具和选择工具</p>
## 移动画布
### 方法一：手形工具
1. 按 `H` 键切换到手形工具
2. 在画布上拖动
### 方法二：空格键 + 拖动
按住空格键，然后拖动鼠标。
### 方法三：鼠标中键
按住鼠标中键（滚轮按下）拖动。
## 缩放画布
### 方法一：鼠标滚轮
滚动鼠标滚轮即可缩放：
- 向上滚动 - 放大
- 向下滚动 - 缩小
### 方法二：快捷键
- `Ctrl/Cmd + +` 或 `Ctrl/Cmd + =` - 放大
- `Ctrl/Cmd + -` - 缩小
- `Ctrl/Cmd + 0` - 重置为 100%
### 方法三：视图导航
点击右下角的缩放控件：
- 点击 **+** 放大
- 点击 **-** 缩小
- 点击百分比数字，可以选择预设缩放比例
## 视图导航
<Screenshot id="view-navigation" />
<p class="screenshot-caption">视图导航控件：① 缩小 ② 自适应 ③ 放大</p>
右下角的视图导航提供了多种视图控制功能：
### 缩放控制
显示当前缩放比例，点击可选择：
- 50%、75%、100%、150%、200%
- **自适应** - 让所有内容适应屏幕
### 自适应视图
点击 **自适应** 或按 `Ctrl/Cmd + 0`，会自动调整缩放和位置，让所有内容都显示在屏幕内。
### 小地图
显示画布的整体缩略图，方便在大型画布中定位。
## 选择元素
### 选择单个元素
1. 按 `V` 键切换到选择工具
2. 点击要选择的元素
### 选择多个元素
**方法一**：框选
拖动鼠标画一个选择框，框内的元素都会被选中。
**方法二**：Ctrl/Cmd + 点击
按住 `Ctrl/Cmd` 键，逐个点击要选择的元素。
### 全选
按 `Ctrl/Cmd + A` 选择画布上所有元素。
### 取消选择
点击画布空白处，或按 `Esc` 键。
## 撤销和重做
做错了？没关系：
- **撤销** - `Ctrl/Cmd + Z`
- **重做** - `Ctrl/Cmd + Shift + Z`
:::tip
撤销/重做的历史记录会保存，可以多次撤销。
:::
## 复制和粘贴
### 复制元素
选中元素后：
- `Ctrl/Cmd + C` - 复制
- `Ctrl/Cmd + V` - 粘贴
### 复制到同一位置
- `Ctrl/Cmd + D` - 原地复制一份
### 拖拽复制
按住 `Alt` 键拖动元素，会复制一份新的。
## 删除元素
选中元素后：
- 按 `Delete` 键
- 或按 `Backspace` 键
## 快捷键汇总
| 快捷键 | 功能 |
|--------|------|
| `H` | 手形工具（移动画布） |
| `V` | 选择工具 |
| `空格 + 拖动` | 临时移动画布 |
| `Ctrl/Cmd + Z` | 撤销 |
| `Ctrl/Cmd + Shift + Z` | 重做 |
| `Ctrl/Cmd + A` | 全选 |
| `Ctrl/Cmd + C` | 复制 |
| `Ctrl/Cmd + V` | 粘贴 |
| `Ctrl/Cmd + D` | 原地复制 |
| `Delete` | 删除 |
| 滚轮 | 缩放 |
| `Ctrl/Cmd + 0` | 重置视图 |

179
docs/user-manual/content/basics/insert-content.mdx Normal file
View File

@@ -0,0 +1,179 @@
---
title: 插入内容到画布
category: getting-started
order: 2
---
# 插入内容到画布
学习如何将各种内容添加到画布中，包括图片、文字、形状等。
<Screenshot id="insert-tools" />
<p class="screenshot-caption">工具栏中的插入工具</p>
## 插入图片
### 方法一：快捷键上传
按 `Ctrl/Cmd + U`，打开文件选择器选择图片。
### 方法二：工具栏按钮
点击工具栏的 **图片** 按钮，选择本地图片文件。
### 方法三：拖拽上传
直接将图片文件从电脑拖拽到画布上。
### 方法四：粘贴图片
复制图片后（从网页、截图工具等），在画布上按 `Ctrl/Cmd + V` 粘贴。
### 方法五：从素材库选择
<Screenshot id="insert-from-library" />
<p class="screenshot-caption">点击素材库按钮打开素材库</p>
1. 打开素材库
2. 点击想要的图片
3. 图片自动添加到画布
## 插入 AI 生成的内容
### 图片生成后自动插入
使用 AI 生成图片后，生成的图片会自动插入到画布上：
1. 如果之前有选中的元素 → 插入到选中元素下方
2. 如果没有选中元素 → 插入到画布中间或最下方
### 从任务队列插入
1. 打开任务队列面板
2. 找到已完成的任务
3. 点击 **插入到画布** 按钮
### 从素材库插入
所有 AI 生成的图片都会保存到素材库，可以随时插入。
## 插入文本
### 方法一：文本工具
1. 按 `T` 键或点击文本工具
2. 在画布上点击
3. 开始输入文字
### 方法二：直接粘贴
从其他地方复制文字，在画布上按 `Ctrl/Cmd + V`，文字会自动创建文本框。
### 在形状中添加文字
双击任何形状，即可在其中添加文字。
## 插入形状
### 使用形状工具
1. 点击工具栏的 **形状** 按钮
2. 选择形状类型（矩形、圆形等）
3. 在画布上点击或拖拽创建
### 快捷键创建
| 快捷键 | 形状 |
|--------|------|
| `R` | 矩形 |
| `O` | 椭圆 |
| `A` | 箭头 |
## 插入思维导图
### 方法一：快捷键
按 `M` 键，然后在画布上点击创建。
### 方法二：AI 生成
在输入框描述你的主题，AI 会自动生成思维导图结构。
### 方法三：Markdown 转换
使用工具箱中的 **Markdown 转思维导图** 工具。
## 插入流程图
### 方法一：AI 生成
在输入框描述流程，AI 自动生成流程图。
### 方法二：Mermaid 转换
使用工具箱中的 **Mermaid 转流程图** 工具。
### 方法三：手动绘制
使用形状工具和箭头工具手动绘制。
## 插入位置
新插入的内容会根据以下规则确定位置：
1. **有选中元素时** - 插入到选中元素附近（下方或右侧）
2. **无选中元素时** - 插入到画布可视区域中心
3. **画布有内容时** - 插入到现有内容的下方
:::tip
如果想精确控制插入位置，先用选择工具点击目标位置附近的元素。
:::
## 调整插入后的内容
内容插入后，可以：
### 移动
选中后直接拖动，或用方向键微调。
### 调整大小
拖动选中框的角点或边点。
### 旋转
拖动选中框上方的旋转手柄。
### 删除
选中后按 `Delete` 或 `Backspace` 键。
## 批量操作
### 选择多个元素
- **框选** - 拖动鼠标框选多个元素
- **Ctrl/Cmd + 点击** - 追加选择
### 批量移动
选中多个元素后一起拖动。
### 对齐
选中多个元素后，使用对齐功能整齐排列。
## 小贴士
:::tip
使用 `Ctrl/Cmd + V` 粘贴是最快的插入方式，支持图片和文字。
:::
:::tip
AI 生成的内容会自动插入到合适的位置，不需要手动操作。
:::
:::note
支持的图片格式：PNG、JPG、GIF、WebP、SVG
:::

154
docs/user-manual/content/drawing/flowchart.mdx Normal file
View File

@@ -0,0 +1,154 @@
---
title: 流程图
category: drawing
order: 5
---
# 流程图
流程图是表达流程和逻辑的常用工具，Opentu 支持 AI 生成流程图和手动绘制。
## 效果展示
<img src="../../product_showcase/流程图.gif" alt="流程图演示" style="max-width: 100%; border-radius: 8px;" />
只需用文字描述流程，AI 就能自动生成专业的流程图。
## AI 生成流程图
这是最快捷的方式：
### 方法一：自然语言描述
在底部输入框输入流程描述，如：
- "用户登录流程：输入账号密码 → 验证 → 成功进入首页/失败提示重试"
- "订单处理流程：下单 → 支付 → 发货 → 签收"
AI 会理解你的描述并生成相应的流程图。
### 方法二：Mermaid 语法
如果你熟悉 Mermaid 语法，可以更精确地控制流程图：
1. 点击工具栏的 **工具箱** 图标
2. 选择 **Mermaid 转流程图**
3. 输入 Mermaid 代码
4. 点击生成
**示例代码：**
```mermaid
graph TD
A[开始] --> B{判断条件}
B -->|是| C[执行操作A]
B -->|否| D[执行操作B]
C --> E[结束]
D --> E
```
## 手动绘制流程图
<Screenshot id="flowchart-step-1" />
<p class="screenshot-caption">流程图工具</p>
### 第 1 步：添加形状
<Screenshot id="flowchart-step-2" />
<p class="screenshot-caption">选择流程图形状：① 开始/结束 ② 处理步骤 ③ 判断条件</p>
1. 点击工具栏的形状工具
2. 选择需要的形状：
- **矩形** - 表示操作/步骤
- **菱形** - 表示判断/条件
- **椭圆/圆角矩形** - 表示开始/结束
- **平行四边形** - 表示输入/输出
3. 在画布上点击或拖拽创建
### 第 2 步：添加文字
双击形状，输入说明文字。
### 第 3 步：连接形状
<Screenshot id="flowchart-step-3" />
<p class="screenshot-caption">拖动连接点创建连线，双击编辑文本</p>
1. 按 `A` 键切换到箭头工具
2. 从一个形状拖动到另一个形状
3. 箭头会自动连接两个形状
### 第 4 步：调整布局
拖动形状调整位置，连接线会自动跟随调整。
## 形状含义
| 形状 | 含义 | 使用场景 |
|------|------|----------|
| 圆角矩形 | 开始/结束 | 流程的起点和终点 |
| 矩形 | 处理/操作 | 具体的执行步骤 |
| 菱形 | 判断/决策 | 需要做选择的节点 |
| 平行四边形 | 输入/输出 | 数据的输入或结果输出 |
## 连接线操作
### 添加连接线
1. 选择箭头工具（按 `A` 键）
2. 从起始形状拖到目标形状
### 添加标签
双击连接线，可以添加文字标签（如"是"、"否"）。
### 调整连接点
拖动连接线的端点，可以改变连接位置。
### 折线连接
如果需要拐弯的连接线，选择 **折线箭头** 类型。
## 编辑技巧
### 对齐形状
选中多个形状后，使用对齐功能让它们整齐排列：
- 左对齐 / 右对齐
- 顶部对齐 / 底部对齐
- 水平居中 / 垂直居中
### 等距分布
选中多个形状，使用"等距分布"让间距均匀。
### 复制结构
选中一组形状和连接线，`Ctrl/Cmd + C` 复制，`Ctrl/Cmd + V` 粘贴，可以快速复制相似的结构。
## 快捷键
| 快捷键 | 功能 |
|--------|------|
| `R` | 矩形工具 |
| `O` | 椭圆工具 |
| `A` | 箭头工具 |
| `V` | 选择工具 |
| `双击形状` | 编辑文字 |
| `Delete` | 删除选中项 |
## 小贴士
:::tip
先用 AI 生成基础框架，再手动微调细节，效率最高。
:::
:::tip
流程图太大？选中所有内容，缩小尺寸，或者分成多个子流程图。
:::
:::note
导出为图片时，建议选择 PNG 格式以保持清晰度。
:::

139
docs/user-manual/content/drawing/mindmap.mdx Normal file
View File

@@ -0,0 +1,139 @@
---
title: 思维导图
category: drawing
order: 4
---
# 思维导图
思维导图是整理思路的好工具，Opentu 支持快速创建和编辑思维导图，还可以用 AI 帮你自动生成。
## 效果展示
<img src="../../product_showcase/思维导图.gif" alt="思维导图创建演示" style="max-width: 100%; border-radius: 8px; margin: 16px 0;" />
只需输入主题，AI 就能帮你拓展思路，自动生成完整的思维导图。
## 快速开始
### 方法一：AI 生成思维导图
这是最快的方式：
1. 在底部输入框输入你的主题，如"学习 Python 的路线图"
2. AI 会自动理解并生成思维导图
3. 生成后可以继续编辑调整
### 方法二：手动创建
<Screenshot id="mindmap-toolbar-menu" />
<p class="screenshot-caption">在更多工具中找到思维导图</p>
1. 点击左侧工具栏底部的 **更多工具** 按钮（三个点图标）
2. 在展开的菜单中选择 **思维导图**，或直接按 `M` 键
3. 在画布上点击，创建根节点
4. 输入中心主题
## 添加节点
<Screenshot id="mindmap-step-2" />
<p class="screenshot-caption">节点操作快捷键提示</p>
选中一个节点后：
| 快捷键 | 功能 |
|--------|------|
| `Tab` | 添加子节点（向右展开） |
| `Enter` | 添加同级节点（向下） |
## 编辑节点
### 修改文字
双击节点，进入编辑状态，修改文字内容。
### 移动节点
选中后直接拖动。节点会自动调整与父节点的连接线。
### 删除节点
选中后按 `Delete` 键。
:::note
删除父节点时，所有子节点会一起删除。
:::
## 节点操作
### 展开/折叠
点击节点旁边的 **+/-** 图标，可以展开或折叠子节点。
适合处理复杂的思维导图，让重点更突出。
### 调整层级
- 拖动节点到另一个节点上 → 成为其子节点
- 拖动到空白处 → 成为独立的根节点
### 复制分支
选中节点后：
- `Ctrl/Cmd + C` 复制
- `Ctrl/Cmd + V` 粘贴
会复制整个分支，包括所有子节点。
## Markdown 转思维导图
有现成的文本大纲？可以直接转换：
1. 点击工具栏的 **工具箱** 图标
2. 选择 **Markdown 转思维导图**
3. 粘贴你的 Markdown 内容（使用 `#` 标题和 `-` 列表语法）
4. 点击生成
标题层级会自动转换为节点层级，列表项会成为子节点。
## 样式调整
选中节点后，可以修改：
- **节点颜色** - 给不同分支设置不同颜色
- **文字颜色** - 改变文字颜色
- **边框样式** - 调整边框
:::tip
给重要节点添加不同的颜色，让思维导图结构更清晰！
:::
## 导出
思维导图可以导出为图片：
1. 按 `Ctrl/Cmd + Shift + E`
2. 选择 PNG 或 JPG 格式
3. 所有节点都会包含在导出的图片中
## 快捷键汇总
| 快捷键 | 功能 |
|--------|------|
| `M` | 切换到思维导图工具 |
| `Tab` | 添加子节点 |
| `Enter` | 添加同级节点 |
| `Delete` | 删除节点 |
| `双击` | 编辑节点文字 |
| `Ctrl/Cmd + C` | 复制 |
| `Ctrl/Cmd + V` | 粘贴 |
## 小贴士
:::tip
思维导图的子节点会自动排列，你不需要手动调整位置，专注于内容就好。
:::
:::tip
结合 AI 生成 + 手动编辑，效率最高。先让 AI 生成框架，再手动补充细节。
:::

116
docs/user-manual/content/drawing/pencil-tool.mdx Normal file
View File

@@ -0,0 +1,116 @@
---
title: 画笔工具
category: drawing
order: 1
---
# 画笔工具
画笔是最基础的绘图工具，让你可以在画布上自由绘制线条和图形。
## 快速开始
### 第 1 步：选择画笔
**方法一**：点击工具栏中的画笔图标
**方法二**：按键盘 `P` 键
<Screenshot id="drawing-step-0" alt="工具栏" />
选中后，画笔图标会高亮显示。
<Screenshot id="drawing-step-1" alt="选择画笔" />
### 第 2 步：开始绘制
1. 在画布上按住鼠标左键
2. 拖动鼠标绘制线条
3. 松开鼠标完成绘制
<Screenshot id="drawing-step-2" alt="绘制线条" />
可以连续绘制多条线条。
## 画笔类型
点击画笔图标旁边的小箭头，可以选择不同类型的画笔：
### 毛笔
模拟毛笔效果，笔触有粗细变化，适合艺术创作。
### 钢笔
均匀的线条，适合精确绘制和签名。
### 马克笔
半透明效果，适合标注和高亮。
## 调整设置
选中画笔工具后，工具栏会显示设置选项：
### 颜色
点击颜色块，选择你喜欢的颜色。可以选择预设颜色或自定义。
### 粗细
拖动滑块调整画笔粗细，范围从细到粗。
## 橡皮擦
画错了？用橡皮擦修正：
**方法一**：点击工具栏的橡皮擦图标
**方法二**：按键盘 `E` 键
在需要擦除的区域拖动，线条会被擦除。
## 编辑已绘制的线条
绘制完成后，线条会成为独立的元素，可以进一步编辑：
### 选择线条
1. 按 `V` 键切换到选择工具
2. 点击线条选中它
### 移动线条
选中后直接拖动，或用方向键微调位置。
### 删除线条
选中后按 `Delete` 或 `Backspace` 键删除。
### 复制线条
选中后按 `Ctrl/Cmd + C` 复制，`Ctrl/Cmd + V` 粘贴。
## 快捷键
| 快捷键 | 功能 |
|--------|------|
| `P` | 切换到画笔工具 |
| `E` | 切换到橡皮擦 |
| `Shift + P` | 切换到钢笔工具 |
| `V` | 切换到选择工具 |
| `H` | 切换到手形工具 |
## 小贴士
:::tip
使用触控板或数位板可以获得更好的绘制体验，部分设备支持压感。
:::
:::tip
绘制时按住 `Shift` 键可以画出水平或垂直的直线。
:::
:::note
画笔绘制的内容是矢量图形，放大后不会变模糊。
:::

140
docs/user-manual/content/drawing/shapes.mdx Normal file
View File

@@ -0,0 +1,140 @@
---
title: 形状工具
category: drawing
order: 2
---
# 形状工具
形状工具可以快速创建矩形、圆形、箭头等几何图形。
## 快速开始
### 第 1 步：选择形状工具
点击工具栏中的形状图标。
<Screenshot id="shape-step-1" alt="选择形状" />
### 第 2 步：创建形状
**方法一**：点击画布
在画布上点击，会在该位置创建一个默认大小的形状。
**方法二**：拖拽创建
1. 在画布上按住鼠标
2. 拖动到想要的大小
3. 松开鼠标完成
<Screenshot id="shape-step-2" alt="创建形状" />
按住 `Shift` 键拖拽可以创建正方形或正圆。
## 形状类型
点击形状工具旁边的小箭头，可以选择不同形状：
### 基础形状
- **矩形** (`R` 键) - 最常用的形状
- **圆形/椭圆** (`O` 键) - 圆形和椭圆
- **三角形** - 等边三角形
- **菱形** - 45度旋转的正方形
### 箭头
- **直线箭头** (`A` 键) - 单向箭头
- **双向箭头** - 表示双向关系
- **折线箭头** - 带拐点的箭头
## 编辑形状
### 调整大小
选中形状后，拖动角落或边缘的控制点来调整大小。
**技巧**：
- 按住 `Shift` 保持等比例缩放
- 拖动角点可以同时改变宽高
- 拖动边点只改变单一方向
### 移动位置
选中形状后：
- 直接拖动到新位置
- 或用方向键微调
### 旋转
选中形状后，拖动上方的旋转手柄。
### 修改样式
选中形状后，可以在工具栏中修改：
- **填充颜色** - 形状内部的颜色
- **边框颜色** - 形状轮廓的颜色
- **边框粗细** - 轮廓线的宽度
### 添加文字
双击形状，可以在内部添加文字。文字会自动居中显示。
## 连接形状
### 用箭头连接
1. 选择箭头工具
2. 从一个形状拖到另一个形状
3. 箭头会自动连接两个形状
### 连接点
当你移动形状时，连接的箭头会自动调整位置。
## 组合操作
### 多选
按住 `Ctrl/Cmd` 键点击多个形状，或拖动框选多个形状。
### 组合
选中多个形状后，按 `Ctrl/Cmd + G` 组合成一个整体。
### 取消组合
选中组合后，按 `Ctrl/Cmd + Shift + G` 取消组合。
## 对齐
选中多个形状后，可以使用对齐功能：
- **左对齐** - 所有形状的左边对齐
- **居中对齐** - 所有形状的中心对齐
- **右对齐** - 所有形状的右边对齐
- **等距分布** - 均匀分布间距
## 快捷键
| 快捷键 | 功能 |
|--------|------|
| `R` | 矩形工具 |
| `O` | 椭圆工具 |
| `A` | 箭头工具 |
| `Shift + 拖拽` | 创建正方形/正圆 |
| `Ctrl/Cmd + G` | 组合 |
| `Ctrl/Cmd + Shift + G` | 取消组合 |
| `Ctrl/Cmd + D` | 复制形状 |
## 小贴士
:::tip
双击形状可以直接编辑内部文字，无需切换到文本工具。
:::
:::tip
按住 `Alt` 键拖拽形状可以复制一个新的形状。
:::

143
docs/user-manual/content/drawing/text.mdx Normal file
View File

@@ -0,0 +1,143 @@
---
title: 文本工具
category: drawing
order: 3
---
# 文本工具
文本工具可以在画布上添加文字，用于标注、说明或创作。
## 快速开始
### 第 1 步：选择文本工具
**方法一**：点击工具栏中的文本图标
**方法二**：按键盘 `T` 键
<Screenshot id="text-step-1" alt="选择文本工具" />
### 第 2 步：添加文本
在画布上点击，会创建一个文本框，光标自动进入编辑状态。
<Screenshot id="text-step-2" alt="输入文本" />
直接输入你想要的文字内容。
### 第 3 步：完成编辑
点击画布空白处，或按 `Esc` 键退出编辑。
## 编辑文本
### 进入编辑模式
- **双击**文本框
- 或选中后按 **Enter** 键
### 选择文字
- **双击** - 选中一个词
- **三击** - 选中整行
- **Ctrl/Cmd + A** - 全选
### 文字格式
选中文字后，可以设置格式：
- **粗体** - 点击工具栏的 **B** 按钮
- **斜体** - 点击工具栏的 **I** 按钮
:::note
注意：当前版本暂不支持下划线快捷键（Ctrl/Cmd + U 是添加图片的快捷键）。
:::
## 文本样式
### 字体
从工具栏的字体下拉菜单中选择：
- **系统字体** - 苹方、微软雅黑、黑体等
- **艺术字体** - 站酷系列、马善政书法等
- **代码字体** - 等宽字体，适合代码
### 字号
点击字号选择器，选择合适的大小。也可以直接输入数字。
### 颜色
- **文字颜色** - 改变文字本身的颜色
- **背景颜色** - 给文字添加背景高亮
### 对齐
- **左对齐** - 文字靠左
- **居中** - 文字居中
- **右对齐** - 文字靠右
## 文本框操作
### 移动
选中文本框后：
- 直接拖动到新位置
- 或用方向键微调
### 调整大小
拖动文本框边缘的控制点。文字会自动换行适应新的宽度。
### 旋转
拖动文本框上方的旋转手柄。
### 删除
选中后按 `Delete` 或 `Backspace` 键。
## 从其他地方粘贴文本
你可以从其他应用（如网页、Word）复制文字，然后在 Opentu 中粘贴：
1. 在其他应用中复制文字（Ctrl/Cmd + C）
2. 在 Opentu 画布上按 Ctrl/Cmd + V
3. 文字会自动创建为文本框
:::tip
粘贴的文字会自动换行，不会出现超长的一行。
:::
## 在形状中添加文字
很多形状都支持添加内部文字：
1. 双击形状
2. 输入文字
3. 文字会自动在形状中居中
这对于制作流程图、思维导图非常有用。
## 快捷键
| 快捷键 | 功能 |
|--------|------|
| `T` | 切换到文本工具 |
| `Enter` | 开始编辑 / 换行 |
| `Esc` | 退出编辑 |
| `Ctrl/Cmd + A` | 全选文字 |
| `Ctrl/Cmd + C` | 复制 |
| `Ctrl/Cmd + V` | 粘贴 |
## 小贴士
:::tip
在画布任意位置直接开始打字，会自动创建一个文本框。
:::
:::tip
需要多行文本？按 Enter 键换行即可。
:::

196
docs/user-manual/content/index.mdx Normal file
View File

@@ -0,0 +1,196 @@
---
title: 首页
order: 0
---
# 欢迎使用 Opentu（开图）
**Opentu（开图）** 是一个以浏览器为入口的 AI 应用平台，强化了模型、知识、素材与工具的协作能力。
平台以**画布工作区**为运行底座，用户在同一个画布中发起 AI 生成指令、撰写知识卡、调用插件工具、管理任务队列，并通过多模型路由完成图像、视频、文本等交付。\
这让创作者不用在多个应用间切换，就能在一个开放工作区内完成从灵感到交付的全链路。
所有数据都存储在当前浏览器中，无需额外安装。只要打开浏览器，就能继续未完成的“项目”，因为 Opentu 把画布状态、素材、提示词历史和设置都保存在本地。
:::note
**重要提示：** 您的所有数据（项目、素材、提示词历史）都保存在**当前浏览器**的本地存储中，不会上传到服务器。这意味着：
- ✅ 数据隐私安全，完全由您掌控
- ⚠️ 换浏览器或清除浏览器数据会丢失内容
- 💡 需要迁移数据？使用 **菜单 → 备份恢复** 功能导出后在新浏览器导入
:::
## Opentu 平台概览
Opentu 将“画布工作区”定位为统一的执行与协作界面，围绕它构建以下能力：
- **AI 应用**：在底部 AI 输入栏发起图片、视频、灵感板的生成请求，或通过内置 Agent/Skill 调用多模型能力；
- **知识与素材**：知识库、灵感板、素材库都与画布互联，生成的内容可一键插入工作区并被任务队列追踪；
- **工具与工作流**：命令面板、技能、工具箱、工作流系统贯穿整个平台，支持多步骤执行与任务重试；
- **开放与扩展**：插件架构、API 配置、同步能力让 Opentu 适合作为团队或个人的高频 AI 工作空间。
## 产品展示
### 智能拆分图片
输入描述，AI 生成可拆分的图片，一键拆成九宫格，发朋友圈超方便。
<img src="../product_showcase/九宫格拆图.gif" alt="九宫格拆图" style="max-width: 100%; border-radius: 8px;" />
### 流程图
用自然语言描述流程，AI 自动生成专业流程图。
<img src="../product_showcase/流程图.gif" alt="流程图" style="max-width: 100%; border-radius: 8px;" />
### 思维导图
输入主题，AI 帮你拓展思路，快速生成完整的思维导图。
<img src="../product_showcase/思维导图.gif" alt="思维导图" style="max-width: 100%; border-radius: 8px;" />
## 我能用它做什么？
### AI 创作能力 🔥
- **AI 生成图片** - 支持多种图片生成模型
- nano-banana - 快速生图
- nano-banana-pro - 高质量生图，支持 HD/2K/4K 分辨率
- 支持文本转图片、图片参考生成、批量生成
- **AI 生成视频** - 支持多种视频生成模型
- Veo3 / Veo3 Pro - 高质量视频生成
- Veo3.1 / Veo3.1 Pro - 支持首尾帧控制，多图参考
- Sora-2 / Sora-2 Pro - OpenAI 视频模型
- 支持图生视频、进度追踪、任务管理
- **模型自由切换** - 在生成对话框中即时切换不同的 AI 模型
- **任务队列管理** - 异步任务处理，支持批量生成、任务重试、历史记录、媒体缓存
### 效率工具
- **知识库** - 目录 + 标签管理，支持笔记检索与导入导出
- **Skill/Agent** - 面向场景的技能选择与自定义工作流
- **命令面板** - 快速搜索并执行常用操作（Cmd+K）
### 白板与可视化
- **思维导图** - 快速整理思路，支持 Markdown 转换
- **流程图** - 绘制流程图，支持 Mermaid 语法
- **自由画笔** - 手绘涂鸦，多种画笔可选
- **形状工具** - 矩形、圆形、箭头等基础形状
- **图片插入** - 支持插入和编辑图片元素
### 编辑与交互
- **丰富的编辑功能** - 撤销、重做、复制、粘贴、多选等
- **无限画布** - 自由缩放、滚动、移动
- **自动保存** - 本地浏览器自动保存，数据不丢失
- **多格式导出** - 支持 PNG、JSON(`.drawnix`) 等格式导出
### 体验与生态
- **完全免费 + 开源** - MIT 许可证，可商用
- **主题模式** - 支持亮色/暗色主题切换
- **移动端适配** - 完美支持移动设备使用
## 立即开始
访问 [opentu.ai](https://opentu.ai) 开始使用，无需注册账号。
体验新功能？试试 [pr.opentu.ai](https://pr.opentu.ai)
## 快速入门
### 1. 生成图片
在底部输入框输入描述（如"一只可爱的猫咪"），点击发送。
### 2. 绘制思维导图
点击工具栏的思维导图图标，或按 `M` 键，开始创建。
### 3. 自由绘画
按 `P` 键切换到画笔，在画布上自由绘制。
## 界面介绍
<Screenshot id="ai-step-0" alt="主界面" />
- **顶部工具栏** - 各种绘图工具和编辑功能
- **底部输入框** - AI 创作入口，输入描述生成图片/视频
- **右下角导航** - 缩放、重置视图等操作
- **无限画布** - 可自由拖动、缩放的创作空间
## 常用快捷键
| 快捷键 | 功能 |
|--------|------|
| `H` | 手形工具（拖动画布） |
| `V` | 选择工具 |
| `P` | 画笔工具 |
| `T` | 文本工具 |
| `M` | 思维导图 |
| `R` | 矩形工具 |
| `O` | 椭圆工具 |
| `Ctrl/Cmd + Z` | 撤销 |
| `Ctrl/Cmd + Shift + Z` | 重做 |
| `Ctrl/Cmd + S` | 保存文件 |
| `Ctrl/Cmd + Shift + E` | 导出图片 |
| 鼠标滚轮 | 缩放画布 |
## 数据存储说明
您的数据存储在浏览器本地，包括：
| 数据类型 | 存储位置 | 说明 |
|----------|----------|------|
| 项目文件 | IndexedDB | 画布内容和结构 |
| 素材库 | Cache Storage | 上传和生成的图片视频 |
| 提示词历史 | IndexedDB | 使用过的 AI 提示词 |
| 设置 | LocalStorage | API 配置等 |
**数据迁移方法：**
1. 在原浏览器打开 **菜单 → 备份恢复**
2. 勾选需要迁移的内容，点击 **导出**
3. 在新浏览器打开 Opentu，**导入** 刚才的 ZIP 文件
## 获取帮助
### 加入用户交流群
扫码加入交流群，与其他用户交流使用心得，反馈问题和建议：
<img src="https://tuziai.oss-cn-shenzhen.aliyuncs.com/aitu/AiTu.png" alt="用户反馈群二维码" style="max-width: 200px; border-radius: 8px;" />
也可以点击应用右侧工具栏的 **用户反馈群** 按钮查看二维码。
### 问题排查
遇到问题时，可以使用 **调试面板** 帮助定位：
| 环境 | 调试面板地址 |
|------|-------------|
| 正式环境 | [https://opentu.ai/sw-debug.html](https://opentu.ai/sw-debug.html) |
| 体验环境 | [https://pr.opentu.ai/sw-debug.html](https://pr.opentu.ai/sw-debug.html) |
调试面板可以：
- 查看 Service Worker 状态和日志
- 导出诊断日志（发给技术支持）
- 备份和恢复应用数据
- 清除缓存解决异常问题
:::tip
如需技术支持，请在调试面板中点击"导出日志"，将日志文件发送给开发者。
:::
### 其他方式
- 📖 阅读本手册的详细教程
- 🐛 在 [GitHub Issues](https://github.com/ljquan/aitu/issues) 提交问题
- 💬 参与 [GitHub Discussions](https://github.com/ljquan/aitu/discussions) 讨论
---
*爱创作，图未来。*