---
name: ARTEMIS 控制台
colors:
  canvas: "#f8f9fa"
  surface: "#ffffff"
  text: "#1e293b"
  text-strong: "#0f172a"
  text-secondary: "#475569"
  text-muted: "#64748b"
  text-control: "#334155"
  border: "#e2e8f0"
  border-control: "#dbe3ec"
  primary: "#1a73e8"
  primary-hover: "#1557b0"
  primary-soft: "#eff6ff"
  exploration-action: "#4f46e5"
  exploration-soft: "#eef2ff"
  focus: "#a5b4fc"
  success: "#047857"
  success-soft: "#ecfdf5"
  warning: "#92400e"
  warning-soft: "#fffbeb"
  error: "#b91c1c"
  error-soft: "#fef2f2"
rounded:
  compact: 8px
  control: 10px
  card: 16px
  composer: 22px
spacing:
  tight: 4px
  icon: 6px
  small: 8px
  group: 12px
  section: 16px
  workspace: 24px
components:
  model-selector:
    backgroundColor: "{colors.surface}"
    textColor: "{colors.text-control}"
    rounded: "{rounded.control}"
  demonstration-control:
    height: 36px
  exploration-composer:
    backgroundColor: "{colors.surface}"
    rounded: "{rounded.composer}"
---

# ARTEMIS 设计与交互约定

## Overview

ARTEMIS 面向使用自然语言执行、探索和复跑测试的人。当前产品包含 Flash、Pro、探索三种入口，按需调用安卓设备和电脑插件，提供批次、精选任务、历史、报告及证据。用户应能看懂当前在做什么、何时需要回答、哪些结果已有证据。

本文记录主程序的职责边界及 `apps/showcase_ui` 的现有视觉与交互规则，不提出新的主题改版。远程 SDK 的协议边界见[局部设计](packages/artemis-client/DESIGN.md)；独立插件仓库维护适配器设计和构建规则。阶段性进度见[开发快照](docs/development-handoff.md)，发行状态见[2.1.0 说明](docs/releases/2.1.0.md)。

## System architecture

| 层 | 职责与源码入口 |
| --- | --- |
| 网页、MCP、远程 SDK | 请求建模、交互与结果读取。`apps/showcase_ui`、`mcp_server`、`packages/artemis-client` 共同使用后台服务；MCP 和薄 SDK 不另启完整后台 |
| HTTP 与业务服务 | `apps/admin_console` 管理配置、统一队列、批次、收藏、历史、人工复验和导出；`TaskQueueService` 及现有资源锁负责执行准入与互斥 |
| 任务与模型 | `artemis/agents`、`artemis/runtime` 执行 Flash/Pro；`artemis/exploration` 管理交流、预算、示范与用例版本；`artemis/llm`、`artemis/services/llm.py` 统一 Responses 请求 |
| 插件与证据 | `artemis/plugins` 管理安装、会话、版本固定、来源、截图、录像和附件；插件执行工具动作，宿主管理任务生命周期和最终验收 |
| 配置与交付 | `artemis/config`、两份 `artemis.jsonc` 和环境配置提供默认值；`scripts` 负责启动、镜像、独立升级和源码打包 |

请求重试、业务执行与最终验收分别处理。提交使用稳定标识；创建批次或探索草稿不自动执行，查询不产生设备动作。执行准入和恢复遵守现有资源锁，任务固定所用插件版本，不能通过另建队列绕开互斥。

最终验收有独立总预算，按请求超时、重试和剩余任务时间协调，保留取证结果；完整有效的结构化结论才更新正式裁定。`completed`、工具成功、探索通过、用例提炼和复跑通过各自表达自己的状态。

Flash 的最终 AI 判定与分析独立配置，默认关闭；首页功能配置和 MCP 共用保存的全局设置。任务开始时固定设置，尚未开始的任务使用最新值；批量、精选及提炼用例的 Flash 复跑同样遵循。关闭时跳过最终 Checker，保留正常执行、步骤、截图、报告和人工复验；结果为“执行完成 · 未做 AI 判定”，不标记“AI确认”或测试通过。Pro 与主动探索的验收规则保持不变。

示范来源保存在元数据中，贯穿分析、提问、规划、执行、验收和用例生成。补充网址不会隐式把电脑示范改到安卓；用户明确改端或提出跨端步骤时按其要求执行。证据必须对应真实来源、窗口、采集时间与操作。

录像使用用户选择的范围。人工示范的窗口模式跟随前台窗口，仅保留一路，无有效窗口时保留缺口；普通录屏在只读验收前停止。恢复操作再追加片段，时间映射以实际录像为准，不借用另一来源或时间的画面。

收藏保存独立模板与执行配置，用例复跑固定版本；删除原任务不破坏已保存模板。历史与导出的有效结论合并人工复验，不能用新裁定改写旧证据。

普通任务新安装默认 `gpt-6-luna / high`，探索单独使用 `gpt-6.1-sol / high`，保留已有配置。上下文参照上限 300k、默认历史压缩预算 80k，均不表示整条任务累计 token 限额。优化稳定前缀时保留关键文件回执、路径、校验和来源；费用收益依实际网关用量及计价判断。

## Colors

整体使用浅灰画布、白色内容面和深色正文。首页主要操作使用蓝色，探索发送及相关主操作保留现有靛色；绿色、琥珀色、红色用于结果与需要处理的状态。新控件复用所在区域的语义色。

| 用途 | 值与来源 |
| --- | --- |
| 画布 / 正文 | `#f8f9fa` / `#1e293b`，来自[全局样式](apps/showcase_ui/src/styles.scss) |
| 首页操作 / 悬停 | `#1a73e8` / `#1557b0`，来自[首页样式](apps/showcase_ui/src/app/pages/home/home.component.scss) |
| 探索操作 / 浅色状态面 | `#4f46e5` / `#eef2ff`，来自[探索面板](apps/showcase_ui/src/app/components/exploration-panel/exploration-panel.component.scss) |
| 正文层级 / 边框 | 强调 `#0f172a`、次级 `#475569`、辅助 `#64748b`；常规边框 `#e2e8f0` |
| 成功、等待、错误 | 深色状态文字配对应浅色面；同时给出文字、图标或说明，结论不只依靠颜色 |

加载、空状态、断开、未验证与失败使用明确文案。执行完成可以有完成标识，测试裁定仍需独立展示；不能让绿色完成态替代测试通过结论。

## Typography

沿用全局字体栈：`Google Sans`、`Google Sans Text`、`Inter`、系统无衬线字体；中文使用系统可用字形。代码、路径及请求诊断使用现有等宽样式，保留换行与复制能力。

`Inter`、`Outfit`、`Roboto` 及 `Material Symbols Outlined` 使用随源码分发的[本地字体](apps/showcase_ui/public/fonts/README.md)，构建和显示不依赖 Google Fonts。图标保留完整字形及 `FILL`、`GRAD`、`opsz`、`wght` 可变轴，不用文字代替缺失图标。

模型控件正文为 13px，探索输入正文为 14px，用例标题为 18px；辅助信息依现有组件使用 11–12px。保留字号、字重、留白形成的层次，不通过大段加粗堆叠状态。Markdown、表格、长链接和中文长标题应换行，不撑破容器。

图标沿用 Material Symbols Outlined，常规全局尺寸 20px；组件局部按原有尺寸调整。图标与相邻文字垂直居中，独立图标按钮提供可访问名称。

## Layout

- 首页负责创建任务与访问精选模板；工作区主区域展示当前任务的交流、执行步骤和结果，底部输入框始终服务当前任务。
- 编辑、模型设置和复跑参数按需展开，默认保持任务时间线可读。精选卡片在收起状态下等高，长标题、不同状态和展开内容不会遮挡操作入口。
- 通常以 4、6、8、12、16、24px 组织内部间距；沿用组件现有网格和断点。子容器允许收缩，长内容使用 `min-width: 0` 及合适换行。
- 探索面板在 600px 以下收紧外边距并允许操作换行；模型选择控件宽度跟随容器。窄屏仍可辨认状态、选择来源和发送指导。
- 列表后台刷新保留滚动、选择和折叠状态；首次加载与静默更新分开，避免周期性加载提示挤动内容。实时连接复用现有页面可见性管理。

## Elevation

卡片使用细边框和克制的阴影区分区域。首页现有玻璃效果、渐变和按钮悬停保留在原有区域，正文、报告、表单和选项保持清晰背景及文字对比。

探索输入区沿用 `0 6px 24px #0f172a08` 的阴影；焦点反馈沿用所在控件的轮廓和浅色描边。全局 CDK overlay 层级为 1200，新增弹层先使用既有 overlay 机制，不任意叠加更大的层级。

## Shapes

模型输入与选择框圆角 10px；紧凑控件常用 8px，内容卡片按组件使用 12–16px，探索输入区为 22px。保留现有徽标、标签与胶囊形控件的局部形状；这些值不要求把全部历史控件改成同一圆角。

## Components

| 组件或状态 | 必须维持的交互与尺寸 | 实现依据 |
| --- | --- | --- |
| 模型选择 | 预设选择加自定义输入；主模型、兜底和精选任务复用同一组件。最小高度 40px、内边距 10px 12px、圆角 10px，保留焦点与禁用态 | [model-selector](apps/showcase_ui/src/app/components/model-selector/model-selector.component.ts) |
| 人工示范控件 | 来源标签与控件水平对齐，选择框及开始按钮均为 36px 高、垂直居中；窄屏可换行。准备、录制、分析分别显示 | [exploration-panel](apps/showcase_ui/src/app/components/exploration-panel/exploration-panel.component.scss) |
| 探索建议 | 推荐内容为用户口吻的可编辑回复；点击只填草稿，用户发送后才继续任务 | [探索组件](apps/showcase_ui/src/app/components/exploration-panel/exploration-panel.component.ts) |
| 历史标题与星标 | 星标只占标题，第二行状态与编号正常左对齐；状态徽标沿用 20px 高及统一内边距 | [task-history](apps/showcase_ui/src/app/components/task-history/task-history.component.ts) |
| 验收状态 | 展示准备证据、核对、生成与校验等阶段及可用的耗时、预算、重试诊断；未完成的流式文字不变为正式通过标签 | [agent-stream](apps/showcase_ui/src/app/components/agent-stream/agent-stream.component.html) |
| 截图、录像与文件 | 显示真实来源和缺口；按时间定位并保留跳转前的播放/暂停状态，文件成功以真实保存回执为准 | [工作区说明](docs/automation-workspace.md) |
| 保存和错误反馈 | 配置加载、保存、空值、失败与密钥已配置状态有明确提示；空密钥保留已有值，连接测试与保存分开 | [模型配置](apps/showcase_ui/src/app/components/model-settings/model-settings.component.ts) |

这些规则对应已接受的现有行为。改动后结合实际层叠样式、渲染尺寸和相关状态检查，不能只核对一处声明。

## Do's and Don'ts

- 复用现有组件、API 类型、中文文案和状态语义。新增状态先说明它与执行、验收或人工操作的关系。
- 保持实际来源与证据一致，缺失时说明原因；不使用手机画面替代电脑操作，也不把工具成功当作业务通过。
- 保留可见焦点、禁用反馈和减少动画偏好；录制红点表示实际录制，等待或执行中使用各自文案。
- 源码已更新而页面仍旧时，先核对服务目录、构建与缓存；不通过反复增加样式覆盖掩盖旧构建问题。
- 视觉变化验证代表性宽度、长标题、加载、等待回答、错误与展开状态；文档格式检查不等于渲染验证。开发检查按[前端指南](apps/showcase_ui/AGENTS.md)执行。