手把手教你第一个AI应用开发流程-掌握IDE使用

99 阅读2分钟

基础知识

AI应用能做什么 图片描述

图片描述 图片描述

开发流程 图片描述

实操步骤

图片描述

创建AI应用项目

第1步:打开扣子开发平台(www.coze.cn/studio)

图片描述

第2步:工作空间 - 项目开发 - +项目

图片描述

第3步:创建应用

图片描述

图片描述

图片描述

第4步:如果想改应用的名字,点击铅笔图标即可。

图片描述

图片描述

编排业务逻辑

第1步:资源 - 工作流 - + 创建工作流

图片描述

图片描述

第2步:添加“大模型” && 配置“大模型”节点

图片描述

图片描述

第3步:配置“开始”节点

图片描述

第4步:连接“结束”节点 && 配置“结束”节点

图片描述

图片描述

第5步:填写“大模型”的系统提示词

# 角色
你是一个专业的翻译官,能够准确地将用户输入的内容翻译成目标语言,不进行随意扩写。

## 技能
### 技能 1:翻译文本
当用户提供一段文本时,迅速将其翻译成目标语言。
确保翻译的准确性和流畅性。

## 限制:
只进行翻译工作,不回答与翻译无关的问题。
严格按照用户要求的目标语言进行翻译,不得擅自更改。

图片描述

图片描述

第6步:试运行

图片描述

图片描述

设计用户界面

第1步:IDE界面 - 用户界面

图片描述

第2步:桌面网页 - 开始搭建

图片描述

第3步:拖动左侧 组件 - 布局组件 - 容器

图片描述

第4步:点击白框,内边框原20,改成10.

图片描述

这里只是演示,内边框依旧使用20.

第5步:再拖一个容器

图片描述

宽度 - 填充容器

图片描述

自动变成宽度100%

图片描述

第6步:修改第一个容器的高度

图片描述

第7步:拖动一个容器,到DIV2容器

图片描述

图片描述

第8步:拖动Text,至DIV1容器

图片描述

也可以自定义字体

图片描述

第9步:输入组件 - 表单,拖到左边的DIV层

图片描述

删掉不需要的元素

图片描述

第10步:点击表单

图片描述

图片描述

第11步:点击按钮,设置属性

图片描述

图片描述

第12步:单击第一行文本框,设置其属性

图片描述

第13步:单击第二行下拉列表,设置属性

图片描述

录入英语、日语、上海话。选项值与选项名称一致。

第14步:展示组件 - Markdown,拖到右边DIV容器

图片描述

图片描述

图片描述

图片描述

第15步:预览 图片描述

图片描述

第16步:单击左边容器

图片描述

点击填充右边的减号,会变成透明

第17步:单击右边容器,也去掉填充

图片描述

第18步:点击“开始翻译”按钮,右边点击 状态 - 点击效果

图片描述

第19步:给按钮绑定事件

图片描述

图片描述

测试应用

第1步:预览

图片描述

第2步:输入文字"你是谁?",单击“开始翻译".

图片描述

发布应用

第1步:发布

图片描述