作品十五：智能写作助手

​

这个项目支持多种写作模式， 比如文章续写 、内容改写 、文案生成 、邮件撰写等 ，帮作者梳理设定、推演剧情、检查前后文一致性，甚至参与更复杂的创作流程。​

​

​

​

​

🔷

技术栈和聊天助手类似，使用 React + TypeScript + Vite ，配合 Tailwind CSS 。核心还是调用智谱 AI API ，数据用 LocalStorage 保存。​

​

开发步骤​

1）设计提示词模板​

开发的第一步是设计提示词模板 。在开始写代码之前，先设计好不同写作任务的提示词 。创建一个prompts.md 文件，定义各种写作模式的提示词​

​

代码块​

Markdown

# 写作助手提示词模板​

​

## 文章续写​

请继续写下面的文章，保持风格一致， 内容连贯： [用户输入的内容]​

## 内容改写​

请改写下面的内容，使其更加流畅 、专业： [用户输入的内容]​

## 内容扩展​

请扩展下面的内容，增加更多细节和例子： [用户输入的内容]​

## 内容总结​

请总结下面的内容，提取核心要点： [用户输入的内容]​

## 邮件撰写​

请写一封[正式/友好]的邮件，主题是： [主题]​

## 文案生成​

请为[产品名称]写一段[风格]风格的营销文案​

​

提示词是 AI 应用的核心 ，好的提示词能让 AI 生成更好的结果 。一个好的提示词通常包含 3 个要素：​

​

🔷

•

明确的任务描述 ​

​

​

​

举个例子 ，如果你想让 AI 写一篇文章，不要只说“帮我写一篇文章”，而要说清楚主题 、读者对象 、字数要求 、包含哪些内容 。比如：​

​

代码块​

Plain Text

请写一篇关于 AI 编程的科普文章，面向零基础读者，通俗易懂， 多举例子 ，字数 800-1000 字，要包含什么是 AI 编程 、为什么要学 、如何入门 。​

​

这样 AI 才知道应该怎么写。​

如果是改写内容，要告诉 AI 这段内容的背景 。比如：​

​

这是一篇技术博客的开头段落，请改写得更吸引人， 同时保持专业性。​

​

这样 AI 才知道应该往什么方向改。​

指定输出格式也很重要 。如果你想让 AI 总结文章，可以明确要求：​

​

代码块​

Plain Text

请总结这篇文章，输出格式：​

1. 核心观点（ 3-5 条）​

2. 关键数据（ 如果有）​

3. 结论（ 一句话）​

​

这样生成的结果更规范，更符合你的需求。​

有时候，给 AI 一些示例效果会更好 。比如让 AI 写营销文案，你可以先给几个示例，让它参考风格 。这种方法叫 Few-shot Learning ，在很多场景下都很有效。​

2） 写需求文档​

设计好提示词模板后，就可以写需求文档了。创建 PRD.md 文件：​

​

代码块​

Markdown

# 智能写作助手 PRD​

​

## 核心功能​

1. 左右分栏布局，左侧输入 ，右侧显示生成结果​

2. 支持 6 种写作模式：续写 、改写 、扩展 、总结 、邮件 、文案​

3. 可以调整创意度（ temperature）和输出长度​

4. 生成的内容要流式显示​

5. 有"优化提示词"按钮，AI 帮用户优化描述​

6. 保存生成历史​

​

## 界面要求​

- 顶部：大标题​

- 输入区：大文本框（ 多行）​

- 参数区：尺寸选择 、风格选择​

- 按钮区：优化提示词 、生成内容​

- 展示区：显示生成的内容 + 复制按钮​

- 侧边栏：历史记录​

​

3）和 AI 对话开发​

有了文档，就可以和 AI 对话开发了。第一步，创建基础界面：​

​

代码块​

Plain Text

请根据 PRD.md 创建智能写作助手的界面：​

1. 左右分栏布局​

2. 左侧：模式选择下拉框 + 输入文本框 + 生成按钮​

3. 右侧：显示生成的内容​

4. 使用 Tailwind CSS，界面要美观​

​

第二步，实现提示词模板：​

​

代码块​

Plain Text

创建 promptTemplates.ts 文件，根据 prompts.md 中的模板，实现 6 种写作模式的提示词函数 。每个函数接收用户输入 ，返回完整的提示词。​

​

这样就把提示词逻辑封装好了，不同的写作模式用不同的提示词。第三步，实现生成功能：​

​

代码块​

Plain Text

实现内容生成功能：​

1. 用户选择模式，输入内容，点击生成​

2. 根据选择的模式，生成对应的提示词​

3. 调用智谱 AI API，使用流式输出​

4. 在右侧实时显示生成的内容​

5. 支持 Markdown 渲染​

​

第四步，添加参数调整：​

​

代码块​

Plain Text

添加高级设置面板：​

1. 创意度滑块（ temperature: 0-1）​

2. 输出长度滑块（ max_tokens: 100-2000）​

3. 这些参数要传递给 API 调用​

4. 可以折叠/展开高级设置​

​

​

🎈

temperature 值会影响输出的创意程度。​

•

0-0.3 比较保守，适合事实性内容​

•

0.4-0.7 比较平衡，适合大多数场景​

•

0.8-1.0 很有创意，适合创意写作。​

​

第五步，添加历史记录：​

​

代码块​

Plain Text

实现历史记录功能：​

1. 每次生成后，保存到 LocalStorage​

2. 保存内容：提示词 、生成结果 、生成时间​

3. 左侧显示历史记录列表​

4. 点击历史记录可以查看之前的内容​

5. 支持删除历史记录​

​

提示词优化技巧​

如果你不确定提示词是否够好，可以让 AI 帮你优化 。比如你可以这样问：​

​

我想让 AI 帮我改写文章，让文章更专业 。​

我现在的提示词是："请改写这段话"。请帮我优化这个提示词，让 AI 生成更好的结果。​

​

AI 会给你一个更详细 、更有效的提示词， 比如：​

​

代码块​

Plain Text

这是一篇技术博客的开头段落，请改写得更吸引人， 同时保持专业性 。要求：​

1. 用更生动的语言​

2.保持技术准确性​

3.字数控制在 200 字左右​

​

扩展思路​

基础版完成后，可以继续扩展功能 。​

比如添加更多写作模板，支持论文 、报告 、小说等不同类型的写作；​

支持自定义提示词模板，让用户可以创建自己的模板；​

添加多语言翻译功能，一键翻译成其他语言； ​

实现批量生成，一次生成多个版本供选择；​

添加文本对比功能，对比不同版本的差异。​

​