SuperAPI AI 工具集

prompt-input

前端与建站

查看项目

更新于 10-16 05:25

技能介绍

Prompt Input 是一种面向 AI 提示的增强型文本输入模式,用于帮助团队以可靠方式收集结构化提示、后续指令和可选附件,同时避免让输入区显得过于沉重。它最适用于需要聊天式输入体验的场景。与相邻模式相比,该模式的目标是在减少操作摩擦的同时,不隐藏用户持续操作所需的状态、规则或恢复路径。

用途

该模式用于收集结构化提示、后续指令和可选附件,适用于聊天式输入体验、AI 工作台提示,以及带附件或模式的结构化提示。

何时避免使用

当标准非 AI 工作流更清晰、更可靠时,应避免添加 AI 专属 UI。除非用户确实能从中受益,否则不要暴露高级控件。不要仅靠精致的视觉效果掩盖模型的不确定性。

实现流程

在复制示例前,先确认该模式与问题和约束相匹配。从 references/pattern.md 中的结构和示例开始,然后选择最小的可行变体。在叠加视觉打磨之前,先应用可访问性、性能和交互护栏。使用测试指南验证键盘、屏幕阅读器、响应式和失败场景下的行为。

可访问性护栏

键盘交互:验证提示输入可以仅用键盘完成;当模式打开、更新或显示额外 UI 时,保持焦点顺序合乎逻辑;保留在高倍缩放下仍可读的可见焦点状态。

屏幕阅读器支持:优先使用语义元素,仅在语义不足时添加 ARIA;在正确位置以正确的礼貌级别播报错误、加载或完成等状态变化;在有用时用 aria-describedby 或结构化标题连接标签、提示和状态文本。

视觉可访问性:不要仅依赖颜色来传达严重程度、完成或选择状态。

性能护栏

将网络延迟、token 使用量和长响应的客户端渲染作为整体预算,而不是彼此独立的关注点。当能改善首次价值时间时,可流式或分块输出内容,但要稳定布局,避免阅读时抖动。跟踪长提示、模型切换和重试等昂贵状态,以便基于证据调优体验。

常见错误

隐藏系统状态:用户无法判断模型是在等待、流式输出、重试还是已完成。修复方式是暴露清晰的请求生命周期状态,并将其保持在受影响内容附近可见。

把失败当作标准表单错误:AI 失败包括安全拦截、上下文限制、模型可用性和部分输出,而不仅仅是请求失败。修复方式是区分失败模式,并为每种模式提供匹配的恢复操作。

忽略 token 和延迟预算:当响应变慢、变短或变贵且没有解释时,体验会显得不可预测。修复方式是从一开始就把 token、延迟和提供商约束设计进界面。

相关模式

https://uxpatterns.dev/patterns/ai-intelligence/ai-suggestions https://uxpatterns.dev/patterns/forms/text-field https://uxpatterns.dev/patterns/forms/textarea

完整实现细节、示例和测试说明见 references/pattern.md。模式页面:https://uxpatterns.dev/patterns/ai-intelligence/prompt-input