内容
在2000年代中期，虚拟代理和客户服务聊天机器人获得了很多赞誉，即使它们之间不是很对话，在引擎盖下它们仅由与Web服务器的数据交换组成。
如今，即使存在大量“弱人工智能”的例子（包括Siri，Alexa，网络搜索引擎，自动翻译器和面部识别），而其他主题（如响应式网络设计）也成为人们关注的焦点，但聊天机器人仍在引起轰动。 。在大公司的大量投资下，仍然有很多机会可以破解未来的对话界面。
- 如何设计聊天机器人体验
有时他们的声誉很差，但是聊天机器人可能很有用。他们不需要感觉像是标准Web表单的基本替代者，用户可以在其中填写输入字段并等待验证-他们可以提供对话体验。
从本质上讲，我们是在增强用户体验，使其感觉更自然，例如与专家或朋友交谈，而不是通过网络浏览器点击或移动手势。目的是通过提供富有同情心的情境响应，使该技术直接嵌入人们的生活中。
观看下面的视频或继续阅读，以发现基于服务设计实践中真实的项目接收应用程序设计和构建聊天机器人的实用方法。
01.设定个性
由于此做法为全球110,000多名成员提供服务，因此目标是提供一个快速，便捷和自然的界面，内部利益相关者可以通过该界面来请求有效的数字服务，而不必填写令人困惑的表格。
第一步是建立聊天机器人的个性，因为这将代表服务设计团队对其利益相关者的声音。我们以Aarron Walter在设计角色方面的开创性工作为基础。这极大地帮助了我们的团队开发了该机器人的个性特征，从而确定了问候，错误和用户反馈的信息。
这是一个微妙的阶段，因为它会影响组织的看法。为了确保我们拥有尽可能多的信息，我们立即建立了利益相关者研讨会，以在与机器人互动时确定适当的个性，颜色，版式，图像和用户流量。
在获得所有必要的批准（包括寻求法律顾问）之后，我们着手将过时的申请表转换为一系列来回的问题，这些问题模仿了利益相关者与我们的设计服务团队的代表之间的对话。
02.使用RiveScript
我们知道我们不想在处理部分深入了解AI标记语言-我们只需要足够的经验就可以开始体验。
RiveScript是一个简单的聊天机器人API，很容易学习，满足我们的需求。几天之内，我们就掌握了从机器人接收项目请求的逻辑，并用足够的业务逻辑对其进行了解析，以对其进行验证和分类，以便可以通过JSON REST服务将其发送到适当的内部项目任务队列。
为了使这个基本的聊天机器人正常工作，请转到RiveScript存储库，对其进行克隆并安装所有标准的Node依赖项。在回购中，您还可以尝试使用各种示例片段添加的交互。
接下来，运行web-client文件夹，该文件夹通过运行基本的Grunt服务器将机器人变成网页。此时，您可以增强体验以适合您的需求。
03.产生机器人的大脑
下一步是生成我们机器人的“大脑”。这是在带有.RIVE扩展名的文件中指定的，并且值得庆幸的是，RiveScript已经带有基本的交互功能（例如，诸如“您叫什么名字？”，“您几岁？”和“您叫什么名字”之类的问题）最喜欢的颜色？'）。
当您使用正确的Node命令启动Web客户端应用程序时，指示HTML文件加载这些内容.RIVE 文件。
接下来，我们需要生成聊天机器人大脑中用于处理项目请求的部分。我们的主要目标是将选择项目任务的入学问题转换为常规对话。
因此，例如：
- 您好，我们能为您提供什么帮助？
- 太好了，我们需要多久开始？
- 您能给我一下您的预算吗？
- 告诉我更多有关您的项目的信息...
- 您是怎么知道我们的？
典型的可访问Web表单如下所示：
形式为action =“”> fieldset>图例>请求类型：/ legend>输入id =“ option-one” type =“ radio” name =“ request-type” value =“ option-one”>标签为=“ option-一个“>选项1 /标签> br>输入id =” option-two“ type =” radio“ name =” request-type“ value =” option-two“>标签，用于=” option-two“> option 2 / label> br>输入id =“ option-three” type =“ radio” name =“ request-type” value =“ option-three”> label for =“ option-three”> option 3 / label> br> / fieldset >字段集>图例>时间轴：/传奇>输入id =“一个月” type =“ radio”名称=“ request-timeline” value =“一个月”>标签为=“一个月”> 1个月/ label> br>输入id =“一个三个月” type =“ radio” name =“请求时间轴” value =“一个三个月”>标签为=“一个月”> 1-3个月/ label> br>输入id =“ four-plus-months” type =“ radio” name =“ request-timeline” value =“ four-plus-months”> label for =“ four-plus-months”> 4+个月/ label> br> / fieldset> br>标签，用于=“ request-budget”>预算信息/标签> br> textarea id =“ request-budget” name =“ request-budget-text” rows =“ 10” cols = “ 30”> / textarea> br>标签为=“ request-description”>项目描述/标签> br> textarea id =“ request-description” name =“ request-description-text” rows =“ 10” cols =“ 30”> / textarea > br> label for =“ request-reference”>参考/标签> br> textarea id =“ request-reference” name =“ request-reference- text” rows =“ 10” cols =“ 30”> / textarea> br >输入type =“ submit” value =“ Submit”> / form>
对于网络表单，我们非常熟悉某些模式：单击“提交”按钮，所有表单数据都发送到另一个页面，在该页面中处理请求，然后很可能会弹出一个厚脸皮的“谢谢您”页面。
使用聊天机器人，我们可以进行提交请求的交互，并使请求更有意义。
04.设计声音
要将这种形式转换为RiveScript的chatbot网络客户端中提供的对话式用户界面，我们需要将信息体系结构从严格的转变为流畅的。或字段标签转换为UI字符串。
让我们考虑一些可访问的字段标签及其相关的问题音：
- 要求： 我们能帮你什么吗？没有把握？你介意我问几个问题吗？
- 时间线： 我们需要多久才能开始？
- 预算信息： 您能给我一下您的预算吗？
- 项目介绍： 好的，您能告诉我要解决的问题的摘要吗？
- 参考： 还有，谁把你推荐给我们的？
接下来，我们需要遵循RiveScript易于学习的双向对话的处理逻辑，将Web表单的代码转换为AI脚本：
- 我们能帮你什么吗？ + *％我们将如何提供帮助-设置area = varSure，您介意我问几个问题吗？ + *％您肯定会介意我问几个问题-我需要多久才能开始此请求？ + *％我需要多久开始此请求-设置when = var可以让我大致了解一下您的预算吗？ + *％您能否大致了解一下您的预算-设置budget = varOK，能否告诉我要解决的问题，受影响的组件和环境的摘要或总体说明？ + *％好的，您能告诉我要解决的问题的摘要，受影响的组件和环境或总体说明-设置project = varAlso，谁将您推荐给我们？ + *％还将您引荐给我们的人-设置referal = vargreat，这就是我到目前为止所得到的： n需要的服务：获取区域> n需要启动：获取时间> n粗略的预算：获取预算> n关于您的项目：获取项目> n推荐人：获取引荐> n并会尽快与您取得联系我今天还能为您提供其他帮助吗？调用>获取获取区域>获取时间>获取预算>获取项目>获取推荐> / call>
05.要求提交
与将标准格式变量发送到另一个页面或服务进行处理相反，聊天机器人可以立即在聊天窗口（或口头）中验证并提交用户输入的信息，这意味着用户还可以轻松地重新访问以前输入的值。
我们需要将通过JSON REST API在chatbot UI中输入的用户请求发送到外部项目任务服务器。
在RiveScript-js中，我们可以自由使用 XMLHttpRequest 对象几乎同时提交请求，因为数据是由用户输入的：
>对象摄取javascript var http = new XMLHttpRequest（）; var a = rs.getUservar（rs.currentUser（），“ areas”）; var b = rs.getUservar（rs.currentUser（），“ when”）； var c = rs.getUservar（rs.currentUser（），“预算”）； var d = rs.getUservar（rs.currentUser（），“ project”）; var e = rs.getUservar（rs.currentUser（），“ referral”）; var url =“ http：// localhost：3000 / send”; var params =“ areas =” + a +“＆when =” + b +“＆budget =” + c +“＆pro ject =” + d +“＆referal =” + e; console.log（params）; http.open（“ POST”，url，true）; http.setRequestHeader（“ Content-type”，“ application / x- www-form-urlencoded”）; http.setRequestHeader（“ Connection”，“ close”）; http.onreadystatechange = function（）{//状态更改时调用一个函数。 if（http.readyState == 4 && http.status == 200）{alert（http.responseText）; }} http.send（params）;目的
06.不要害怕聊天机器人
不久，当前与计算机进行交互以获取信息的方式将被基于聊天机器人等基于AI的技术所采用，其中人们只需发出简单的语音命令，就像我们在Amazon Echo和Google Home等技术中所看到的那样。
网页设计社区不必担心–我们所有人都应该拥抱这项新技术的附加值。
它可能会为其所服务的公司改变游戏规则，提供完全可扩展的客户服务并改善客户智能。
本文最初发表于网络杂志，这是面向网页设计师和开发人员的全球最畅销杂志。 在这里订阅.
