Hostinger AI Builder 智能体模式提示词编写教程
在 Hostinger AI Builder 智能体模式下构建 Web 应用时，编写清晰、详细的提示词才能获得准确、高质量的结果。模糊或不完整的提示词可能导致不相关或不正确的结果，而具体的指令则能帮助 AI 理解你的需求。
Hostinger AI Builder 智能体模式的提示词编写技巧
从保持简洁到反复迭代和完善输入，以下这些提示技巧可以帮助你使用 Hostinger AI Builder 高效创建 Web 应用。
1. 清晰且具体
清晰且具体意味着以精确、详细的方式编写提示词，尽量不留歧义空间。明确定义任务、期望的结果和背景。
Hostinger AI Builder 提出的一些澄清问题可能会显示可点击的答案选项，而不需要你输入文字，让你可以选择单个选项、选择多个选项或自己填写答案。在提供此类选项时善加利用，有助于保持提示词的一致性并减少歧义。
通过使用具体而详细的提示词，你可以帮助 Hostinger AI Builder 理解你的确切需求，减少迭代次数，并确保该 AI 工具生成符合你需求的结果。
好的提示词示例：
创建一个 AI 驱动的食谱推荐工具，让用户输入现有食材并获取个性化的食谱推荐。显示食谱详情，包括烹饪时间、难度级别和分步说明。使用干净现代的 UI，带有柔和色调的背景、浅色的点缀色以及高质量的美食图片。
**为什么？**这个提示词对内容、结构和设计元素给出了清晰的说明，因此 Hostinger AI Builder 可以生成与用户愿景高度契合的网页。
不好的提示词示例：
创建一个食谱工具。
**为什么？**这个提示词太模糊，缺少关于你需要什么样的食谱工具、其用途、功能、内容和设计偏好的关键细节。它确实会给你一个食谱工具，但会与你实际需要的相去甚远，需要大量修改工作。
编写清晰具体提示词的最佳实践
- 概述用户交互和导航流程——描述用户应如何在应用中导航以及与其功能进行交互。
- 指定设计和美学偏好——提供视觉方面的细节，以便 Hostinger AI Builder 能够使设计与你的品牌标识或个人风格保持一致。
阅读我们的指南，熟悉 Hostinger AI Builder 的界面和关键功能。
2. 拆解复杂想法
在使用 Hostinger AI Builder 时，你可能希望在 Web 应用中包含多个功能。将复杂的想法拆解为更小、更易于管理的任务会带来更好的结果。
这种方法被称为分解式提示词技巧，可帮助 Hostinger AI Builder 专注于具体指令，而不会被过多的细节所淹没。隔离任务也更容易发现和纠正特定部分的错误。
好的提示词示例：
创建一个电影评论提交表单，让用户以 1 到 5 星的等级为电影评分，并撰写最多 500 字的文字评论。
设计一个电影数据库页面，展示电影标题、海报、类型、上映日期和平均用户评分，并支持按评分和上映日期排序。
实现搜索功能，让用户可以按标题、类型或演员查找电影，并提供自动补全建议。
**为什么？**通过为每个功能编写具体的提示词，开发过程变得更加专注，从而产出一个功能完善、易于使用的电影评论 Web 应用。
不好的提示词示例：
创建一个包含用户账户、电影列表、评论提交和搜索功能的综合性电影评论网站。
**为什么？**这个提示词太宽泛，缺少对每个功能的详细说明。因此，AI 可能会产生不完整或不一致的结果，增加出错风险。
拆解复杂想法的最佳实践
- 根据依赖关系确定任务优先级——识别哪些功能依赖于其他功能，并据此规划你的开发顺序。
- 为每个功能设定明确目标——定义具体目标和预期结果，使每个组件都能按预期运行。
3. 只从核心功能开始
这是对上一个技巧的延伸：在添加额外功能之前，先专注于核心功能总是一个好主意。这样做可以帮助 Hostinger AI Builder 理解你的当前需求，在整合补充元素之前打下坚实的基础。
先处理好核心功能还能确保你高效利用时间和消息限额，避免在初始阶段给你和工具带来不必要的复杂性。
好的提示词示例：
开发一个社交媒体平台，让用户创建个人资料并分享带文字说明的照片。包含基本功能，如用户注册、个人资料自定义，以及显示所关注用户动态的照片信息流。
**为什么？**这个提示词专注于平台的基本方面，为 Hostinger AI Builder 提供了清晰且可执行的范围。
不好的提示词示例：
创建一个社交媒体平台，包含用户资料、私信功能、照片分享、直播、电商市场板块、博客板块、虚拟现实集成和 AI 驱动的内容推荐。
**为什么？**这个提示词一次性给 Hostinger AI Builder 塞入了太多功能，缺乏对核心功能的专注。因此，它可能生成不完整或重点不突出的输出。
从核心功能开始的最佳实践
- 定义 Web 应用的目的——通过明确应用要解决的问题或带来的价值，清楚地说明它的设计用途。
- 彻底测试核心功能——在添加更多功能之前，全面测试 Web 应用的主要功能并解决所有问题。
4. 加入约束条件和偏好
除了描述你期望 Hostinger AI Builder 做什么，说明它不应该做什么也有助于生成更高质量的输出。
加入约束条件有助于使你的提示词更具体、更少歧义。
好的提示词示例：
创建一个简单、基础的待办事项 Web 应用。以下是需要考虑的限制：
不要包含用户身份验证。
避免使用花哨的过渡效果或动画。
仅使用 HTML、CSS 和 JavaScript，不要引入任何框架或库。
**为什么？**添加限制条件使 Hostinger AI Builder 能够从你的应用中排除不需要的技术或功能，使输出更符合你的期望规格，并帮助节省时间。
不好的提示词示例：
创建一个简单、基础的待办事项 Web 应用。
**为什么？**这个提示词缺少关于应用规格的细节和清晰度，导致输出过于通用，可能不符合你的需求。
5. 上传图片、PDF 文件或 HTML 文件，以准确展示你想要的内容
Hostinger AI Builder 允许你上传图片来指导 AI 生成 Web 应用。你可以在创建项目之前随初始提示词一起附加文件，也可以稍后在编辑器聊天中上传。无论哪种方式，该文件都会在整个网站生成过程中被保留并生效。
如果你有希望 Hostinger AI Builder 遵循的草图、线框图、配色方案或设计参考，这个功能尤其有用。你可以提供视觉参考，而不是用文字描述所有内容，从而使输出更加精确。
只需点击提示词输入框中的上传文件按钮，选择要使用的图片，并编写描述你希望 AI 做什么的提示词即可。
你还可以上传生成输出的截图来优化设计。如果某些元素看起来不符合你的期望，可以尝试从右侧预览窗格截取屏幕截图，并高亮标出你想要更改的部分。Hostinger AI Builder 会据此进行调整。
请注意，尽管此功能允许你以现有网站作为灵感，但我们强烈建议不要公然抄袭受版权保护的设计，因为这可能导致法律问题。相反，可以让 Hostinger AI Builder 创建一个功能相似但布局独特、原创的 Web 应用，例如这样：
你好，我想创建一个类似于 IMDb 的 Web 应用，让用户可以搜索电影、评分并阅读评论。平台的截图已附上。我希望你将这张图片作为灵感，尤其是在添加功能和决定按钮位置时。不过，请使用独特的布局、配色方案和设计。”
上传 PDF 生成网站
Hostinger AI Builder 现在支持上传 PDF——你可以上传一个 PDF，Hostinger AI Builder 将使用其内容为你构建一个网站。
使用方法：
- 在 Hostinger AI Builder 的提示词输入框中，点击上传文件按钮。
- 选择你的 PDF（例如商业宣传册、产品目录或包含网站内容的文档）。
- 添加提示词，描述你希望 Hostinger AI Builder 基于该文件构建什么。
- Hostinger AI Builder 将读取 PDF 内容并据此生成网站。
示例提示词：“使用此 PDF 为我的企业创建一个专业的网站。包括服务、联系方式以及文档中的其他相关信息。”
此功能与现有的图片上传功能并存——你仍然可以上传草图、线框图或截图来指导设计。如果你需要 Web 应用为用户生成可下载的 PDF，请参阅如何创建可打印且格式良好的 PDF。
上传 HTML 文件生成网站
Hostinger AI Builder 支持上传 HTML 文件。将 HTML 文件与提示词一起附加，Hostinger AI Builder 会读取该文件并基于它生成网站。
示例提示词：“使用此 HTML 文件为我所在的社区教会创建一个网站，并遵循其设计。”
6. 让工具修复问题
在生成 Web 应用时，你偶尔可能会遇到错误。因此，如果你在试用后改变主意，我们提供30 天退款保证。
好消息是，Hostinger AI Builder 内置了调试功能，可根据你的提示词检测并修复问题。发生错误时，工具不会在右侧窗格中显示 Web 应用预览，而是会显示错误消息以及受影响的代码行。
你可以复制错误消息和高亮的代码，将其粘贴到提示词输入框中，并让 Hostinger AI Builder 分析并纠正它，就像这样：
你好，我的 Web 应用遇到一个错误。你能分析这段代码并修复问题吗？
[插入受影响的代码行]
如果出现其他错误，请重复此过程——复制错误，让工具识别并修复它——直到你的 Web 应用按预期运行。
7. 选择并编辑特定元素
“选择并编辑”工具（定向编辑）允许你每次只针对一个特定元素请求更改。
首先，点击提示词输入框下方的箭头，即“选择并编辑”按钮：
预览对话框中高亮显示带闪光图标的“选择元素”按钮
然后，点击你想要更改的元素：
最后，编写一条提示词来描述你想要的更改：
编写高质量提示词的高级技巧
除了基本技巧外，在为 Hostinger AI Builder 编写提示词时，还可以考虑以下高级技巧，以进一步提升输出质量和准确性：
在提示词中使用步骤
虽然我们建议将复杂的想法拆解为多个提示词，但你可能更愿意将相关任务保留在单个提示词中。
如果是这种情况，请尝试将提示词格式化为分步说明，而不是一段文字。使用步骤有助于 Hostinger AI Builder 按时间顺序遵循你的指令，从而产生更连贯、更一致的结果。
此外，结构化的提示词也更便于根据需要进行审查和完善。
好的提示词示例：
在我的应用中创建一个用于登录和注册的页面。以下是你要做的事情：
创建一个专用页面供用户登录或注册。
添加用户名、电子邮箱地址和密码表单。
将这些表单连接到相应的数据库表。
插入一个用于登录或注册的操作按钮。
添加一个超链接，让没有账户的用户从登录页面切换到注册页面。
如果输入的数据无效，则显示错误消息。
**为什么？**这个提示词有清晰的流程和主题划分，按时间顺序描述了 Hostinger AI Builder 应创建的内容。
不好的提示词示例：
在我的应用中创建一个用于登录和注册的页面。在这里，添加用户名、电子邮箱地址和密码的表单，这些表单连接到相应的数据库表。添加两个用于登录/注册的按钮以及针对没有账户的用户的重定向。如果输入的数据无效，则添加错误提示。
**为什么？**这个提示词没有清楚地分离各个任务，难以遵循。Hostinger AI Builder 可能会遗漏一些指令并给出不完整的输出。
包含技术术语
如果你熟悉 Web 开发或设计，可以考虑在提示词中加入技术术语。例如，你可以使用 flexbox、lazyloading（延迟加载）和极简设计等术语。
添加技术术语可以让你的提示词更高效、更具体，最大程度地减少歧义。这也能确保 AI 输出更贴近你的应用需求。
好的提示词示例：
改变我的 Web 应用的整体设计，采用仅使用二维元素和单色调色板的扁平化设计。
**为什么？**这个提示词包含技术术语以及对要添加到应用中的内容的详细描述。这让 Hostinger AI Builder 更容易理解你的需求。
不好的提示词示例：
改变我的 Web 应用的设计。我希望它非常简单、基础，无论是配色还是设计上。
让我的 Web 应用仅在用户查看时才加载图片。
**为什么？**Hostinger AI Builder 可能会误解这些提示词，因为它们比较模糊。例如，简单、基础的设计并不总是意味着扁平化设计。
持续学习
要全面了解有效的提示词技巧，你可以查看《提示词工程指南：从新手到专家》教程！
管理积分并避免达到消息限额
与其他 Web 开发 AI 工具一样，Hostinger AI Builder 有特定的积分限额，因此高效管理积分非常重要。
使用 Hostinger AI Builder 时的一个常见错误是在构建 Web 应用上消耗过多积分。理想情况下，你应该为集成外部服务和故障排除等任务保留一些积分。
虽然积分限额每月重置，而且你可以升级到更高级的套餐以获得更多积分，但妥善管理积分可以让你的开发更高效。
以下是 Hostinger AI Builder 智能体模式的提示词策略，可帮助你高效地充分利用积分：
- 编写详细清晰的提示词，避免在开发后期重复基本要点。
- 提交前仔细检查提示词，以免浪费积分来完成初始指令。
- 在第一次输出的基础上构建，每次迭代只针对开发的一个具体方面。例如，先专注于视觉元素，然后再转向功能。
- 每次迭代输出时，遵循初始提示词结构：描述后续输入的目标、规格和你的期望。
- 结构化你的提示词，以便持续提供有效的输入。
请注意，无论你的提示词多么高效，Web 应用的复杂性始终是决定你将使用多少积分的最大因素。
Hostinger AI Builder 智能体模式提示词常见问题
我可以构建哪些类型的 Web 应用？
Hostinger AI Builder 允许你构建几乎任何类型的应用，从连接随机玩家的在线跳棋游戏，到记录工作时长的复杂时间跟踪平台。但是，由于 AI 的局限性，你无法构建企业级应用，例如财务或薪资工具。
我的提示词应该有多详细？
你的提示词越详细，Hostinger AI Builder 给出的输出就越好。理想情况下，你应该清楚地解释任务、期望的结果、背景和应用需求。最好先从一个涵盖项目基本方面的较宽泛的提示词开始，然后逐步完善细节。
如果输出不符合预期，我该怎么办？
AI 工具给出不理想的初始输出是很正常的。在这种情况下，请提供后续提示词来完善结果，使其更符合你的期望。每次只完善应用的一个方面，直到获得理想的结果，然后