大模型智能体之Coze猜灯谜

yange大约 8 分钟大模型智能体大模型智能体

1. 猜灯谜

1.1 案例介绍和界面设计

前言

定义

本节我们来实现一个猜灯谜的智能体，这个智能体的功能是：

生成灯谜（展示数据和画面）
猜灯谜（用户交互）

0. 创建一个应用，应用名称：元宵猜灯谜

1. 使用AI生图，完成背景图片的设计

2. 使用容器，图片，文字等组件，完成界面设计（这里不用绑定属性，等工作流设计完成后，再补充）

3. 各个组件的属性设置和事件设置，等工作流设计完成后，再补充,这里先分析逻辑 👈

1. 提交按钮：在生成灯谜工作流正在工作的时候禁用，在猜测灯谜工作流工作的时候启用 ; 点击时触发 表单组件提交事件，以及主持人回答区域隐藏。

2. 查看答案按钮：点击时触发将生成灯谜工作流输入的灯谜设置到用户输入框，显示答案

3. 下一题按钮：点击时触发并且生成灯谜工作流开始工作，设置用户输入框为空，主持人回答区域v ，图片区域要有个加载显示。

用户输入框：生成灯谜工作流开始工作，设置用户输入框为空并禁用。
主持人回答区域：猜测灯谜工作流开始工作，设置主持人回答区域显示。

1.2 生成灯谜的工作流

前言

定义

各位同学，上面我们已经完成了界面设计，下面我们开始设计工作流。

猜灯谜智能体功能分2块： 👇

生成灯谜（展示数据和画面）
猜灯谜（用户交互）

因此，需要创建2个工作流： 👇

生成灯谜工作流（generate_lamp_riddle）
猜灯谜工作流(guess_lamp_riddle)

1. 生成灯谜工作流

工作流定义完，记得测试，然后上线哦！！

1. 开始节点

当点击下一题的按钮是，触发这个节点，因此这个节点不需要输入的变量，直接触发执行。

2. 代码节点

既然是猜灯谜，因此需要提前准备一些灯谜数据，因此我们需要一个代码节点，来生成灯谜数据。
这里利用代码，将灯谜数据转成：文字，和文字的长度（提示用户几个字），如：车水马龙。

核心代码 👇

import { random } from "lodash";

async function main({ params }: Args): Promise<Output> {
    const data = [
        "小孩哥",
        "搞抽象",
        "偷感",
        "恭喜发财",
        "躺平",
        "画蛇添足",
        "寿比南山",
        "福如东海",
        "车水马龙",
        "松弛感",
        "显眼包",
        "扣子",
        "守株待兔",
        "井底之蛙",
        "鸡飞狗跳",
        "亡羊补牢",
        "杯弓蛇影",
        "草船借箭",
        "叶公好龙",
        "望梅止渴",
        "愚公移山",
        "指鹿为马",
        "刻舟求剑",
        "掩耳盗铃",
        "鹬蚌相争",
        "狐假虎威",
        "囫囵吞枣",
        "滥竽充数",
        "破釜沉舟",
        "塞翁失马",
        "南辕北辙",
        "画龙点睛",
        "百花齐放",
        "一帆风顺",
        "龙飞凤舞",
        "水滴石穿",
        "卧虎藏龙",
        "风花雪月",
        "天马行空",
        "一箭双雕",
        "四海为家",
        "百发百中",
        "千军万马",
        "一日千里",
        "百年好合",
        "五湖四海",
        "八仙过海",
        "九牛一毛",
        "十全十美",
        "百闻不如一见",
        "画饼充饥",
        "万里长城",
        "一叶知秋",
        "五彩缤纷",
        "六神无主",
        "八面玲珑",
        "九霄云外",
        "十年磨剑",
        "百尺竿头",
        "千钧一发",
        "万象更新",
        "一石二鸟",
        "单身狗",
        "六亲不认",
        "七情六欲",
        "八方来财",
        "九死一生",
        "十万火急",
        "百炼成钢",
        "千山万水",
        "万事如意",
        "一诺千金",
        "五花八门",
        "佛系",
        "七嘴八舌",
        "八面威风",
        "百战百胜",
        "千秋万代",
        "万古长青",
        "一见钟情",
        "五谷丰登",
        "七窍玲珑",
        "八仙过海",
        "九霄云外",
        "百年树人",
        "千秋万代",
        "万水千山",
        "五光十色",
        "三羊开泰",
        "对牛弹琴",
        "八面玲珑",
        "九死一生",
        "锦上添花",
        "一箭双雕",
        "如鱼得水",
        "画龙点睛",
        "望梅止渴",
        "叶公好龙",
        "守株待兔",
        "金蛇狂舞",
        "鸡鸣狗盗",
        "狼心狗肺",
        "马不停蹄",
        "风声鹤唳",
        "鹤立鸡群",
        "牛刀小试",
        "虎背熊腰",
        "鱼贯而入",
        "龙飞凤舞",
        "鸡毛蒜皮",
        "牛头马面",
        "画蛇添足",
        "龙凤呈祥",
        "燕雀安知鸿鹄之志",
        "鸟语花香",
        "狼烟四起",
        "马首是瞻",
        "鱼龙混杂",
        "兔子不吃窝边草",
        "狮子搏兔",
        "狗尾续貂",
        "牛鬼蛇神",
        "虎视眈眈",
        "鱼米之乡",
        "龙潭虎穴",
        "鸡犬升天",
        "牛郎织女",
        "鸡飞蛋打",
        "狼子野心",
        "鱼水之欢",
        "龙吟虎啸",
        "鸡犬相闻",
        "牛头不对马嘴",
        "虎口余生",
        "一鸣惊人",
        "四面楚歌",
        "三心二意",
        "顺手牵羊",
        "金玉满堂",
        "春暖花开",
        "落地生根",
        "左右为难",
        "东山再起",
        "胸有成竹",
        "纸上谈兵",
        "风雨同舟",
        "风调雨顺",
        "披荆斩棘",
        "望子成龙",
        "雨过天晴",
        "花好月圆",
        "独树一帜",
        "梅开二度",
        "满载而归",
        "三顾茅庐",
        "拔苗助长",
        "班门弄斧",
        "白日做梦",
        "不计前嫌",
        "出人头地",
        "垂帘听政",
        "大海捞针",
        "得不偿失",
        "道听途说",
        "对症下药",
        "分道扬镳",
        "开卷有益",
        "口若悬河",
        "力挽狂澜",
        "人山人海",
        "金碧辉煌",
        "画龙点睛"
    ];
    const word = data[random(0,data.length-1)]; // 随机获取一个词语
    let word_length = word.length;   // 获取词语的长度
    const ret = { // 返回的数据
        "word":  word,
        "length": word.length
    };
    return ret;
}

3. 大模型节点

猜灯谜案例，需要图和对应的描述，这里需要大模型来生成图和描述

提示词如下：👇

你是一个擅长设计看图猜灯谜的作家，可以根据用户输入的词语生成趣味性极强的看图猜灯谜。

创作一幅能让人联想到这个词的隐喻图画。要求:
1. 画面要富有想象力和寓意，多使用象征性的元素
2. 需要通过巧妙的视觉元素引导观者思考，增加一些细节来引导思考方向
3. 画面要简洁清晰,避免过于复杂
4. 画面的描述请输出到 img_des 中
5. 用国风漫画的风格进行生成

生成一句提示，来引导用户猜谜，要求：
1. 提示要简短，一定不要出现该词语中的任何字
2. 可以提示用户词语中个别字的含义或
3. 也可以提示用户这个词语的含义
4. 提示输出到 hint

示例-1：
用户输入的词语：偷感
img_des: 一个小偷在画面中来回踱步，脸上漏出窃喜的表情，国风漫画
hint: 一种隐秘而刺激的心理体验，仿佛在禁忌边缘游走

示例-2：
用户输入的词语：鸡同鸭讲
img_des：一只鸡和一只鸭在对话，漏出疑惑的表情，国风漫画
hint: 喔喔喔，嘎嘎嘎，沟通无果为哪般？打一俗语。

4. 图像生成节点

考虑到成本，建议用通用模型生图和尺寸（512*512)，生成背景图片

5. 结束节点

1.3 猜测灯谜的工作流

前言

定义

接下来，完成猜灯谜工作流(guess_lamp_riddle)的定义 👇

工作流定义完，记得测试，然后上线哦！！

1. 开始节点

选择器节点

2.1 文本处理

2.1.1 文本处理2

2.2 大模型节点

你是一个看图猜灯谜的主持人，负责主持一个看图猜灯谜的节目，用户会来猜你的灯谜。

1. 如果用户没猜对，请告诉用户回答错误，并调侃用户，但一定不要出现谜底！
2. 如果用户的答案有字和谜底一样，那么请告诉用户，并进行一定程度的引导
3. 结合用户的回答稍微提示一下谜底的词语方向，但一定不要出现谜底！

2.2.1 文本处理2

3. 变量聚合节点

4. 结束节点

至此，猜灯谜工作流定义完毕，记得测试，然后上线哦！！，然后需要配置到页面中，再测试！

1.4 配置界面并测试

前言

定义

截止到现在，我们已经完成了猜灯谜工作流和测试工作流的定义，接下来，我们需要配置界面并测试 👇

1.4.1 配置界面

1. 配置下一题 按钮，调用工作流

2. 配置图片和描述

3. 答案和提示区

4. 查看答案按钮

1.4.2 测试

点击，右上角的预览，可以看到效果，点击下一题，进行测试。