用网页设计的思路来Prompting - Cursor团队公布自己Prompt设计技巧
最近大火的AI编程软件当属Cursor了，其背后的团队Anysphere刚公布了自己在内部使用的prompt技巧，核心观点可以总结为：prompt设计应该被视为一个专业的、系统化的过程，类似于网页设计，需要专门的工具和方法论支持：
- “我认为prompting就像是与一个时间有限的人交流。虽然特定于LLM的技巧确实有帮助(尤其是思维链)，但我发现提高性能的最佳方法之一就是提供极其清晰和高质量的指令，这与清晰简洁的沟通有助于更好地和人沟通是一样的道理”
- “我所做的大多数prompting都是参数化的：有许多输入变量，需要动态地调整prompt以适应这些变量。因此将prompting描述为’为动态输入做清晰沟通’是最准确的” ；
这样来说，网页设计和prompt从概念上就很类似了：
- 都需要清晰的沟通；
- 都需要响应动态内容，不同于写作;
- 都需要适应不同的大小：网页设计适应屏幕尺寸，prompting适应上下文窗口；
甚至从开发者偏好上也很相似：
- 两者都需要查看实际渲染结果：如果不查看所有输入变量填充后的prompt渲染输出,很难写出好的prompt；
- 可组合组件在两个领域都很有用：在网页设计中我们经常创建可重用的组件，如导航栏、按钮、表单等；从Prompting角度来说，我们同样可以创建各种的prompt片段供重复使用；
- 声明式方法优于命令式方法：命令式编程指告诉计算机”如何”做某事的步骤；而声明式编程指描述”什么”需要被做，而不指定具体步骤；
- 有时需要追求”像素级完美”；
以上这些思考启发作者创建了Priompt：一个类似React的prompt设计库！
- Priompt是priority（优先级）+ prompt（提示）的组合词，是一个基于JSX的提示库。它使用优先级来决定在上下文窗口中包含什么内容，使得prompt的结构更加清晰和模块化；
- 下图展示了如何使用JSX语法定义一个名为DoableAsTaskPrompt的函数组件，这个组件包含了系统消息、负面例子和用户消息等多个部分；
- 还显示了如何处理动态内容，例如使用props.lastAIMessage来引用之前的消息；
此外，repo还自带了一个交互式的预览界面，如下图所示，允许开发者实时查看和测试他们的prompts：
- 允许用户输入不同的消息并立即看到AI的响应，例如可以在每个请求中记录进入组件的序列化props。然后当看到意外行为时就能在预览中查看到确切的prompt并实时优化，这使得迭代变得更容易；
- 而且预览界面包括token计数、渲染时间等技术细节信息，对于构建实际要商用的AI一用很有帮助；
- 界面顶部显示了多个不同的prompt组件（如taskPrompt, stateBasedEngine01Prompt等，甚至还有cursorTutorPrompt），说明Priompt支持创建多个可重用的prompt模块；
个人总结和感触：
- 工具的重要性：Priompt通过结构化的编写方式和即时预览功能，能大幅提升prompt设计的效率；
- 模块化思维：将prompts视为可重用的组件，而不是单一的文本块；
- 跨学科融合：将成熟的web开发的理念和实践（如JSX、组件化）应用到AI prompt设计中；