摘要：这篇文章将带你走进一个AI翻译应用的制作过程，从零开始，一步步教你如何利用低代码平台和大模型搭建一个实用的翻译工具。无论你是技术小白还是有一定开发经验的开发者，这篇文章都能帮你快速上手，掌握AI应用开发的核心步骤。
这篇文章将带你走进一个AI翻译应用的制作过程，从零开始，一步步教你如何利用低代码平台和大模型搭建一个实用的翻译工具。无论你是技术小白还是有一定开发经验的开发者，这篇文章都能帮你快速上手，掌握AI应用开发的核心步骤。
背景
学习了提示词、文生图、图生视频、生表情包等AI玩法，现在开始进入智能体的学习与搭建啦。【AI】新手2分钟构建自己的第一条Coze智能体（直接感受过程和结果）
于是乎，带来了我的第一个智能体应用——AI翻译应用。
一起来看看是怎么一步步做出来的吧~
效果
先来看个效果，我输入了内容，然后选择翻译为英语或者日文，最终生成我要的翻译结果。
工具
扣子：「业务逻辑配置」和「应用界面搭建」。
业务逻辑配置：大模型
应用界面搭建：拖拉拽低代码开发
实践步骤
三大步骤，n小步骤：
完成目标业务的「业务逻辑配置」完成目标业务的「应用界面搭建」最后将界面与业务逻辑连接具体的配置涉及到较多细节点，我们一个个来看。
进入扣子空间，点击「创建」，选择「低代码搭建」。
使用空白应用，给本次要做的应用起个名字，我们就叫「AI翻译」。
首先搭建AI翻译的工作流，配置的位置如图所示。
AI翻译的工作流程只需要用到三个节点，包括「开始节点、大模型节点、结束节点」，因此我们可以先把大模型节点选取到页面。
现在开始，我们依次来配置三个节点的参数吧。
先对「开始节点」配置，添加其输入变量，content和language，作为后续用户输入的两个必要参数：
content 为需要翻译的内容。language 为需要翻译的目标语言。将「开始节点」和「大模型节点」连接上（图中的1），然后对「大模型节点」进行逐个参数配置。首先我们选择一个大模型（图中的2），此处我使用了默认的模型（如下图）。接着配置输入参数（图中的3），匹配「开始节点」的content和language。
我们在「大模型节点」输入以下系统提示词，将大模型的身份进行定义，和翻译的要求给到它，以让其翻译的时候符合要求。
上面写完了系统提示词，下面写入用户提示词。
用户提示词是用户与AI模型进行交流时，所输入的指令、问题或请求。
由于不同用户提供的翻译内容，以及需要翻译的目标语言不同，所以需要将翻译内容和目标语言使用变量来指代，这样就可以在运行时替换成真实的用户需求。
「将用户输入的内容{{content}}翻译成目标语言{{language}}。」中的{{content}}和{{language}}为变量。
比如内容是“今天天气真不错”，目标语言是“英语”，那么用户提示词就是：将用户输入的内容{{今天天气真不错}}翻译成目标语言{{英语}}。
最后我们将「大模型节点」的输出配置下，我们需要的是一串文本，因此输出格式配置文本，变量名output。
把「大模型节点」与「结束节点」连接，然后配置“返回文本”，具体包括输出变量使用大模型的输出output，回答内容引用{{output}}，并使用流式输出。
好啦，咱们开始试运行一下吧。在content和language分别输入以下内容，看翻译出来啦，说明我们这条流程是没有问题的，接下来要去配置用户的界面了。
这一步试运行非常重要！！！否则界面和业务流连接出错，排查问题都很难。将流程跑通，若后续出问题，就可以排除流程侧了，将查问题的复杂度降低。这个和测试中的单元测试有相同之处。
打个比方： 想象你在组装一辆汽车。
单元就是一个个独立的零部件，比如发动机、轮胎、方向盘、刹车片。
单元测试就是在把发动机装上车之前，单独测试它能否正常启动、运转；在把轮胎装上之前，单独检查它的气压、磨损情况。
输入内容
翻译出来英语
翻译出来日文
从业务逻辑tab切换到用户界面tab，我们选择「桌面网页」，就可以了。
这里具体的组件配置我就不细说了，核心要注意如下部分：
界面需要分为「翻译内容输入区」和 「翻译结果区」「翻译内容输入区」的组件是表单、文本输入框、选择器和按钮「翻译结果区」的组件是markdown此处主要配置的就是选择器、按钮、markdown，另外的组件仅是占位符和标签需要修改下，没有功能上的配置。
选择器：选择器用来选择目标语言，我们这里配置英语和日语。
注意：选项值也需要是英语和日语，不要写1和2
按钮：接着对「开始翻译」按钮进行配置，主要目的是通过按钮接收「请输入翻译内容」和「目标语言」的值，然后传给刚才创建的工作流，最终完成翻译结果的输出。在流程中只要用到了{{content}}和{{language}}的地方，均会拿到输入框（请输入翻译内容）和选择器（目标语言）的值。
markdown：「开始翻译」按钮触发工作流拿到的返回结果怎么展示呢，这里我们就需要给markdown组件配置内容了，其内容就是刚才这条工作流的出参，也就是图中的data数据。
点击预览，我们就可以通过用户界面测试结果啦，看来，结果不错。
对于没有接触过流程编排，以及界面和流程如何交互的同学来说，以上的配置会觉得有些不理解，但对研发出生的同学来说，就很简单了。
我自己也是不会代码的，我总结下在这个AI翻译中，需要注意的几点：
在流程设计中，我们需要严格处理好每个节点的输入和输出，如此才能保证这条流程可以顺利地进行下去。流程设计完成后，我们要对其进行试运行，一方面保证结果是我们想要的，另一方面如果后续和界面连接出现问题，则比较容易排查（这部分上述也已经提到过）。本次界面上的「开始翻译」按钮是核心，它起到了连接用户输入内容、流程运行的枢纽作用，用户通过点击按钮，将界面上用户输入的翻译内容和选择的目标语言传入流程。我们使用这种低代码的时候，特别要注意「触发–输入–处理 –输出–获取」这个逻辑，这是低代码配置上非常核心的一个逻辑思路，有助于我们编排自己的业务场景逻辑和排查问题。这次制作的AI翻译应用还是简单的，不过这是很好的智能体入门方式，当我们建立了大致的手感，后续就可以上有点难度的啦。
本文由人人都是产品经理作者【知果日记】，【知果日记】，原创/授权 发布于人人都是产品经理，未经许可，禁止转载。
题图来自Unsplash，基于 CC0 协议。
来源：人人都是产品经理一点号
