2026/4/6 5:53:25
网站建设
项目流程
深圳市营销型网站建设,建设厅网站上怎么实名认证,茂名网站建设咨询,旅游网站静态模版下载AI对话机器人的应用已经非常广泛#xff0c;从你日常使用的手机助手到企业复杂的客服系统#xff0c;背后都有它的身影。所以今天就教大家在Axure里制作Ai对话机器人的原型模版#xff0c;制作完成后#xff0c;只需要在中继器表格里输入问题和答案#xff0c;预览时就可以…AI对话机器人的应用已经非常广泛从你日常使用的手机助手到企业复杂的客服系统背后都有它的身影。所以今天就教大家在Axure里制作Ai对话机器人的原型模版制作完成后只需要在中继器表格里输入问题和答案预览时就可以实现自动回复。具体效果你们可以观看下面的视频或打开原型预览地址亲自体验【原型效果】1、在输入框里输入问题后自动搜索问题列表如果找到答案机器人自动回复如果找不到答案也会回复引导话术。2、机器人回复时会模拟打字输入效果逐字回复。3、问题和答案可以在中继器表格里添加或修改。【原型预览含下载地址】https://axhub.im/ax10/bcf9d9e5357143b7/#c1【制作教程】本原型模版主要分成底部背景、欢迎区域、问题列表、对话区域输入区域1.底部背景底部背景用矩形和线段制作如下图所示摆放2.欢迎区域欢迎区域包括图标和文字默认未提问时显示。3.问题列表问题列表用中继器制作中继器里摆放矩形和文本标签矩形用于显示文字文本标签用于记录答案默认不显示。中继器表格里包含两列wenti列对应问题daan列对应答案如果是Axure10或以上的版本我们点击表格里的连接元件选择中继器里的矩形和文本标签就可以将问题设置到矩形将答案设置到文本标签如果是Axure9或以下的版本就要在中继器每项加载时通过设置文本的交互将wenti列和答案列的值设置到对应的元件里。4.对话区域对话区域我们用中继器来制作中继器里需要有两个颜色不同的矩形蓝色矩形对应我输入的内容灰色矩形对应机器人的回答中继器表格里添加两列who列用来确认是谁说的话我们定义如果who列的值等于我那该行内容就是我说的如果who列的值不等于我那就是机器人说的。Text列对应具体说的内容。中继器表格里默认为空如果你想默认展示以前的聊天记录也可以在中继器表格里填写。在中继器每项加载时我们需要判断每一行是谁说的如果who列的值等于我就是我说的所以显示蓝色矩形隐藏灰色矩形如果who列的值不等于我就是机器人说的我们就显示灰色矩形隐藏蓝色矩形。然后我们把中继器text列的值都设置到灰色和蓝色的矩形里我们在中继器每项加载时用设置文本的交互将text列的值都设置到两个矩形里即可。因为矩形不会自适应宽度和高度所以这里我们要先定一个宽度的最大值案例里是850如果矩形的宽度小于850时我们设置矩形高度不变宽度和文字的宽度一样如果宽度大于850时我们设置矩形宽度为850设置高度为文本宽度为850是的高度。怎么做自适应文本的尺寸这里我们需要动态面板和锚链接滚动的交互来获取。具体可以参考我之前的视频教程《自适应文本的输入框》里面有详细讲解怎么自适应文本的宽度学习后举一反三得出自适应的高度。设置矩形的宽度是需要注意蓝色矩形我的对话的锚点是在右侧灰色矩形机器人的对话的锚点是在左侧。最后考虑到对话内容较多时会超过指定的区域所以可以把中继器转为动态面板并调出垂直滚动条。5.输入区域输入区域包括矩形、多行输入框按钮如下图所示摆放。发送按钮按下时我们要先判断文本内容是否为空如果为空就不操作如果不为空再进行操作。首先我们要先把欢迎区域的文字图标组合隐藏然后把输入框的内容添加到对话记录的中继器里。考虑到内容较多时我们先把最新的内容显示出来所以我们需要动态面板的滚动条滚动到最下方这里我们需要在对话记录的动态面板内添加一个默认隐藏的元件作为锚点。然后用移动的交互移动到对话记录中继器的底部最后用滚动到元件的交互让动态面板的滚动条滚动到底部元件的位置。问题问完后我们要自动回复答案我们首先对问题列表的中继器进行筛选筛选出符合条件的答案这里是通过简单判断判断中继器表格里wenti列是否包含有输入框里的文本值。如果有筛选结果就是中继器筛选后的条数不等于0我们就用设置文本的交互将问题的答案就是在中继器里文本标签的值记录下来如果等于0就是没有筛选结果就是没有找到答案用设置文本的交互记录默认的话术案例中是对不起目前没有找到该问题相关的知识点您可以提问右侧问题列表相关的问题或者在中继器里的添加对应的问题这样我们记录下了要回答的内容后用移出筛选的交互将问题列表还原并且触发将记录的文本逐字显示。文本逐字显示其实就是通过文本提取函数将文本值逐一提取先提取第一个然后是第二个……如此循环直到最后一个字为止这里如果不明白的话可以参考我之前出的视频教程《动态文字——输入效果》这里的区别要在先把第一个字的文本用添加行的交互添加到对话的中继器里然后再进入循环依次将23456……直到末尾的字通过循环判断的方式添加上去。完成之后我们要用移动的交互将动态面板内的锚点元件移动到中继器表格的下方然后用滚动到元件的交互让动态面板的滚动条滚动到最下方锚点的位置。这样我们就完成了AI对话机器人的原型模板了后续使用也是很方便问题和答案在中继器表格中填写即可即可自动生成的交互效果。以上就是本期教程的全部内容感谢您的阅读我们下期见。