thendcn/ai-team-skills/gemini-agent

Gemini Agent - AI 团队 UI 设计专家

将 UI 设计和前端开发任务委派给 Gemini，由 Claude Code 编排和审查。

gemini CLI 已不再支持个人账号登录（报 IneligibleTierError），脚本改为调用 Antigravity CLI agy。

默认模型为 gemini-3.8-flash-high（Gemini 3.8 Flash，high 档），可用 agy models 查看可选模型，用 --model 覆盖。

用法

/gemini-agent <UI 设计描述>
/design-ui <UI 设计描述>

也可由 Claude Code 在分析任务后自动委派（当任务涉及 UI/设计/组件/页面/布局/样式时）。

执行步骤

1. 判断当前平台：检查运行环境是 Linux/macOS 还是 Windows

• Linux/macOS → 使用 gemini-run.sh
• Windows → 使用 gemini-run.ps1（必须通过 powershell.exe -ExecutionPolicy Bypass -File 调用）

1. 准备 prompt 文件：将 UI 设计描述写入临时文件（推荐使用 -f / -File 参数）
2. 执行脚本：调用对应平台的包装脚本
3. 检查生成的文件：通过 git status 或 ls 查看 Gemini 生成了哪些文件
4. 记下 SESSION_ID：脚本结束时在 stderr 打印 SESSION_ID: <id>，需要修改时用 --resume / -Resume 续聊

执行方式

推荐：使用 `-f` 文件模式传递 prompt（避免 shell 转义问题）

Linux / macOS (Bash)：

bash ~/.claude/skills/gemini-agent/scripts/gemini-run.sh -f /tmp/gemini-prompt.txt -d <工作目录>
 
# 续聊之前的会话（审查不通过后接着改）
bash ~/.claude/skills/gemini-agent/scripts/gemini-run.sh --resume <SESSION_ID> -f /tmp/gemini-fix.txt -d <工作目录>
 
# 只读审查（plan 模式，不会修改文件）
bash ~/.claude/skills/gemini-agent/scripts/gemini-run.sh -m plan -f /tmp/review-prompt.txt -d <工作目录> -o /tmp/review.txt

Windows（必须使用 powershell.exe 调用 .ps1 脚本）：

powershell.exe -ExecutionPolicy Bypass -File ~/.claude/skills/gemini-agent/scripts/gemini-run.ps1 -File /tmp/gemini-prompt.txt -Dir <工作目录>

Windows 注意事项：

• Prompt 文件必须是 UTF-8 编码（无 BOM）
• 脚本已自动处理 npm/pnpm 安装的 .ps1 包装脚本兼容性问题

脚本参数

gemini-run.sh / gemini-run.ps1 [OPTIONS] [prompt...]
 
Bash:                                PowerShell:
  -m, --mode <yolo|plan>               -Mode <yolo|plan>    (默认 yolo；plan 为只读)
  --model <model>                      -Model <model>
  -d, --dir <directory>                -Dir <directory>
  -t, --timeout <seconds>              -Timeout <seconds>   (默认 600s)
  -f, --file <file>                    -File <file>
  -o, --output <file>                  -Output <file>       (默认输出到 stdout)
      --resume <session_id>            -Resume <session_id>

plan 审查模式：prompt 里要写明「评审意见直接写在回复里，不要写计划文件」，否则 agy 可能只回复一个计划文件链接。

Prompt 构建指南

将用户需求转化为 Gemini 友好的 prompt 时，遵循以下结构：

1. 角色设定 - 在 prompt 开头设定角色，例如：「你是一个顶级 UI 设计师和前端开发专家，擅长创建高品质、现代化的用户界面。」
2. 任务描述 - 清晰描述要生成的 UI
3. 技术栈 - 明确框架（React/Vue/HTML）和样式方案（Tailwind/CSS）
4. 代码规范 - 语义化 HTML、可访问性、响应式、TypeScript
5. 设计风格 - 视觉要求（现代简洁、间距圆角、微交互）
6. 输出要求 - 直接生成代码，写入指定文件路径

关键：prompt 中应写清楚视觉细节要求，包括精细的视觉层次、配色方案、动画细节等。

参考 references/prompt-templates.md 获取完整模板。

输出处理

Gemini 生成的文件直接写入工作目录。Claude Code 应：

1. 检查 Gemini 生成了哪些文件（通过 git status 或 ls）
2. 读取并审查生成的代码质量
3. 必要时进行微调和修正

流水线集成

作为流水线第一步（设计阶段）时：

1. Claude 分析需求，构建 UI 设计 prompt
2. 调用 gemini-run.sh（或 Windows 上的 gemini-run.ps1）生成 UI 代码
3. Claude 读取生成的文件，提取关键设计信息
4. 将 UI 设计上下文传递给下一步（codex-agent 实现业务逻辑）

输出约定

• 生成的文件应在工作目录的合理位置（如 src/components/, src/pages/）
• 文件命名遵循项目约定（PascalCase for React, kebab-case for Vue）

与 gemini-ui 的关系

gemini-agent 是 gemini-ui 的增强版：

• gemini-ui: 简单快速的 UI 生成，直接调用 gemini CLI
• gemini-agent: 完整的包装脚本、错误处理、超时控制、流水线支持

两者共存，简单任务可用 gemini-ui，复杂任务或流水线模式用 gemini-agent。

任务路由

当用户请求包含以下关键词时，应路由到 gemini-agent：

• 设计、UI、组件、页面、布局、样式、美化、前端、界面、视觉