渐进式披露：少即是多的AI人机交互设计推荐

2026-06-15阅读 0热度 0

人工智能

渐进式披露：如何运用“少即是多”原则优化AI产品的人机交互体验

在AI产品设计领域，用户输入的质量直接决定了输出结果的可靠性。本文将分享HagiCode项目中落地的一套渐进式披露交互方案——通过分步引导、智能补全与即时反馈，将用户模糊简短的输入转化为结构清晰的技术提案，显著提升人机协作效率。

问题背景

AI产品的设计者常面临一个典型场景：用户满怀期待输入一行需求，AI返回的结果却南辕北辙。并非AI能力不足，而是用户提供的信息过于单薄——毕竟，机器无法凭空揣测人心。

这一问题在HagiCode的开发过程中尤为突出。HagiCode作为一款AI驱动的代码助手，用户通过自然语言描述需求，AI生成技术提案与会话。然而实际使用中，用户输入存在几类通病：

输入质量参差不齐：部分用户仅输入“优化登录”、“修复bug”等寥寥几个字，缺少上下文支撑。
技术术语不统一：同一概念在不同人口中表述各异，如“前端”“FE”“UI层”混用。
结构化信息缺失：项目背景、仓库范围、影响范围等关键字段常被忽略。
需求重复出现：同类请求反复提交，每次都需要从零开始解释。

这些问题的后果直接反映在用户体验上：AI理解偏差导致提案质量不稳，用户抱怨“这AI不行”。其实AI也需要足够的信息输入才能准确输出——人与人的沟通尚需时间磨合，何况机器？

为了解决上述痛点，团队决定引入“渐进式披露”设计理念重构人机交互流程。这一决策带来的提升远超预期。

关于HagiCode

本文分享的方案源于HagiCode项目中的工程实践。HagiCode是一个开源AI代码助手，通过自然语言交互协助开发者完成代码编写、技术提案生成、代码审查等任务。这套渐进式披露方案经历了多次迭代与优化。如果它能给你带来启发，说明我们的工程实践确有价值——那么HagiCode本身也值得你关注。

什么是渐进式披露

“渐进式披露”（Progressive Disclosure）源自人机交互（HCI）领域的设计原则，核心理念很简单：避免一次性向用户展示所有信息与选项，而是根据用户的操作进程与需求，逐步揭示必要的内容。

这一原则天然适配AI产品，因为AI交互本身就是渐进式的——用户提供一点信息，AI理解一点，再补充一点，进而理解更多。就像人与人之间的对话，需要循序渐进，不可能一见面就全盘托出。

在HagiCode场景中，我们从四个维度实施渐进式披露：

1. 描述优化机制：让AI辅助用户理清表达

当用户输入简短描述时，系统不会直接让AI尝试理解，而是先触发“描述优化”流程。该流程的核心是“结构化输出”——将用户的自由文本转化为标准格式。如同将散落的珍珠串成项链，清晰有序。

优化后的描述必须包含以下标准章节：

背景：问题背景与上下文。
分析：技术分析与思考过程。
解决：解决方案与实施步骤。
实践：实际代码示例与注意事项。

同时自动生成一个Markdown表格，展示目标仓库、路径、编辑权限等信息，便于AI后续操作。清晰的目录总能提升检索效率。

以下是核心代码实现：

// ProposalDescriptionMemoryService.cs 核心方法
public async Task OptimizeDescriptionAsync(
    string title,
    string description,
    string locale = "zh-CN",
    DescriptionOptimizationMemoryContext? memoryContext = null,
    CancellationToken cancellationToken = default)
{
    // 构建查询参数
    var queryContext = BuildQueryContext(title, description);

    // 检索历史上下文
    var memoryContext = await RetrieveHistoricalContextAsync(queryContext, cancellationToken);

    // 生成结构化提示词
    var prompt = await BuildOptimizationPromptAsync(
        title,
        description,
        memoryContext,
        cancellationToken);

    // 调用 AI 执行优化
    return await _aiService.CompleteAsync(prompt, cancellationToken);
}

该流程的关键在于“记忆注入”——将项目惯例、相似案例、负面模式等历史上下文注入提示词，使AI在优化时能参考过往经验。前车之鉴，后事之师。

注意事项：

确保当前输入优先于历史记忆，避免用户显式指定的信息被覆盖。
HagIndex引用必须作为事实来源，不得被历史案例篡改。
低置信度的纠错建议不应作为强约束注入。

2. 语音输入能力：说话比打字更自然

除文本输入外，系统还支持语音输入。这对于描述复杂需求尤为实用——打字可能需要几分钟，而说话只需几十秒，毕竟语速远超打字速度。

语音输入的设计核心在于“状态管理”，用户必须清晰感知当前系统状态。我们定义了以下状态：

空闲：系统就绪，可开始录制。
等待上游：正在连接后端服务。
录制中：正在录制用户语音。
处理中：正在将语音转换为文本。
错误：发生错误，需要用户介入。

前端状态模型示例：

interface VoiceInputState {
  status: 'idle' | 'waiting-upstream' | 'recording' | 'processing' | 'error';
  duration: number;
  error?: string;
  deletedSet: Set; // 已删除结果的指纹集合
}

// 开始录制时的状态转换
const handleVoiceInputStart = async () => {
  // 先进入等待状态，显示加载动画
  setState({ status: 'waiting-upstream' });

  // 等待后端就绪确认
  const isReady = await waitForBackendReady();
  if (!isReady) {
    setState({ status: 'error', error: '后端服务未就绪' });
    return;
  }

  // 开始录制
  setState({ status: 'recording', startTime: Date.now() });
};

// 处理识别结果
const handleRecognitionResult = (result: RecognitionResult) => {
  const fingerprint = normalizeFingerprint(result.text);

  // 检查是否已被删除
  if (state.deletedSet.has(fingerprint)) {
    return; // 跳过已删除内容
  }

  // 合并结果到文本框
  appendResult(result);
};

这里有一个细节：利用“指纹集合”管理删除同步。当语音识别返回多条结果时，用户可能删除其中一部分。将已删除内容的指纹存储起来，后续相同内容出现时自动跳过。这就像记住自己不喜欢的菜品，下次点单时自动规避——没有人希望被同一个问题困扰两次。

3. 提示词管理系统：将AI的“思维模型”外置

HagiCode配备了一套灵活的提示词管理系统，所有提示词以文件形式存储：

prompts/
├── metadata/
│   ├── optimize-description.zh-CN.json
│   └── optimize-description.en-US.json
└── templates/
    ├── optimize-description.zh-CN.hbs
    └── optimize-description.en-US.hbs

每个提示词由两部分构成：

元数据文件（.json）：定义提示词的场景、版本、参数等信息。
模板文件（.hbs）：使用Handlebars语法的实际提示词内容。

元数据文件格式如下：

{
  "scenario": "optimize-description",
  "locale": "zh-CN",
  "version": "1.0.0",
  "syntax": "handlebars",
  "syntaxVersion": "1.0",
  "parameters": [
    {
      "name": "title",
      "type": "string",
      "required": true,
      "description": "提案标题"
    },
    {
      "name": "description",
      "type": "string",
      "required": true,
      "description": "原始描述"
    }
  ],
  "author": "HagiCode Team",
  "description": "优化用户输入的技术提案描述",
  "lastModified": "2026-04-05",
  "tags": ["optimization", "nlp"]
}

模板文件采用Handlebars语法，支持参数动态注入：

你是一个技术提案专家。


根据以下信息生成结构化的技术提案描述。



{{title}}
{{description}}
{{#if memoryContext}}

{{memoryContext}}

{{/if}}



## 背景
[描述问题背景和上下文，包括项目信息、仓库范围等]

## 分析
[技术分析和思考过程，说明为什么需要这个改动]

## 解决
[解决方案和实施步骤，列出关键代码位置]

## 实践
[实际代码示例和注意事项]

这种设计带来多项优势：

提示词可像代码一样进行版本管理。
支持多语言，根据用户偏好自动切换。
参数化设计，可动态注入上下文。
启动时进行完备性验证，避免运行时异常。

大脑中的知识若不及时外化，遗忘便是必然——与其事后懊悔，不如从一开始就做好记录。

4. 渐进式向导：将复杂任务拆解为小步骤

对于复杂任务（如首次安装配置），我们采用多步骤向导设计。每个步骤只请求必要信息，并附带清晰的进度指示。正如生活常理：一口吃不成胖子，步步为营反而更稳妥。

向导的状态模型：

interface WizardState {
  currentStep: number;           // 0-3，对应4个步骤
  steps: WizardStep[];
  canGoNext: boolean;
  canGoBack: boolean;
  isLoading: boolean;
  error: string | null;
}

interface WizardStep {
  id: number;
  title: string;
  description: string;
  completed: boolean;
}

// 步骤导航逻辑
const goToNextStep = () => {
  if (wizardState.currentStep < wizardState.steps.length - 1) {
    // 验证当前步骤的输入
    if (validateCurrentStep()) {
      wizardState.currentStep++;
      wizardState.steps[wizardState.currentStep - 1].completed = true;
    }
  }
};

const goToPreviousStep = () => {
  if (wizardState.currentStep > 0) {
    wizardState.currentStep--;
  }
};

每个步骤都配有独立的验证逻辑，已完成步骤带有清晰的视觉标记。取消操作会弹出确认对话框，防止误操作导致进度丢失。走错路可以回头，但若将路彻底拆毁，便再无挽回余地。

核心经验总结

回顾HagiCode中渐进式披露的实践，可以提炼出以下关键原则：

分步引导：把复杂任务拆成小步，每步只请求必要信息。
智能补全：利用历史上下文与项目知识自动补全信息。
即时反馈：每个操作都有清晰的视觉反馈与状态提示。
容错机制：允许用户撤销、重置，避免错误造成不可逆损失。
输入多样化：支持文本、语音等多种输入方式。

这套方案在HagiCode中的实际效果：用户输入的平均长度从不足20字提升至结构化的200-300字，AI生成的提案质量显著提高，用户满意度随之上升。

原因并不复杂——你提供的信息越多，AI理解越准确，返回的结果自然越好。这一点与人际沟通并无二致。

如果你正在打造AI相关产品，希望这些经验能为你带来启发。请记住：用户并非不想提供信息，而是你还未问对问题。渐进式披露的核心，正是在合适的时机以合适的方式提问——而那个时机与方式，需要耐心去摸索。

参考资料

HagiCode项目地址：github.com/HagiCode-org/site
HagiCode官网：hagicode.com
渐进式披露设计原则：Wikipedia - Progressive Disclosure
Handlebars模板引擎：handlebarsjs.com