spot_img
HomeDivi主题使用教程会话设计简介(和 3 个杰出示例)

会话设计简介(和 3 个杰出示例)

现在几乎每个人都有自己的网站,所以如果你想让自己的网站脱颖而出,就必须在设计时发挥你的一流水平。 人们想要根据他们的特定需求量身定制的网站,并让他们觉得自己很重要(确实如此!)。 如果你不能提供那种经验,你可能无法在大联盟中竞争。

对话式设计就是创建为每个用户量身定制并预测他们需求的网站。 在本文中,我们将为您提供会话式网页设计的简要速成课程,并讨论一些示例。

让我们谈谈吧!

会话设计简介

当谈到会话式网页设计时,有一个重要的区别。 当人们谈论这个概念时,他们大多指的是超个性化。 例如,当您登录您的 Facebook 帐户时,该平台会询问您的想法/感受,并通过名字称呼您:

Facebook 时间线。

谷歌SEO优化服务

这是对话式设计的一个例子。 另一方面,当人们谈论对话式用户界面 (UI) 时,他们指的是文本驱动的体验,例如聊天机器人和 Slack。

无论如何,会话设计这个术语涵盖了很多领域。 然而,它们都有一个共同点,那就是为用户提供更加个性化的体验。 这就是为什么这是一件好事:

  • 它可以帮助您建立信任。 对话式设计可以帮助用户感到宾至如归,这反过来可能会激发信任并带来更多转化。
  • 您可以充分利用收集到的数据。 如今,大多数网站都会从用户那里收集一些个人信息。 通过会话设计,您可以将这些数据用于实际用途。

至于哪些网站可以从采用对话式设计中受益,这取决于您为访问者提供的互动程度。 如果您的用户需要以某种方式与您的网站进行交互,那么您应该考虑研究对话式设计以提供更加个性化的体验。

在下一节中,我们将向您展示一些对话式 Web 设计和 UI 的示例。 我们将讨论他们的正确做法以及如何在您自己的网站上应用他们的方法。

3 个使用对话式设计的网站示例

对话式设计是一个广阔的领域,因此您可以通过多种方式在您的网站上实现它。 在本节中,我们将探讨三个示例,每个示例都使用不同的方法来实现个性化和对话式 UI。

WordPress divi主题

1. Buzzworthy 工作室

Buzzworthy Studio 的网站具有出色的联系表单体验,可提供高度个性化的体验。 登陆联系页面后,您可以单击 开始一个项目 呼吁采取行动:

开始一个新项目。

然后,该页面会询问您想要从事哪种项目:

选择您要启动的项目类型。

例如,如果我们点击 营销 选项,我们可以从中选择 搜索引擎优化, PPC 活动, 或两者:

开展营销活动。

做出选择后,该网站会为您提供粗略的预算和时间表,具体时间因预算而异:

项目的粗略预算和时间表。

就联系页面而言,这种体验是我们遇到过的最吸引人的体验之一。 通过在给你预算之前问几个问题,你会觉得在雇用他们之前你是在和自由职业者交谈。

此外,它们还包括一个简单的表格,您可以在其中添加他们可能想知道的任何详细信息,然后再制定更全面的项目提案:

H10的年终大促

一个快速表格,询问有关您的项目的更多详细信息。

会话设计和联系页面是天作之合,特别是对于投资组合页面。 您面临的最大挑战之一是让潜在客户感到放心,并为他们量身定制您的页面,这是实现此目标的好方法。

如果您想尝试创建更具交互性的客户入职体验,一种很好的方法是使用 Typeform。 前一段时间,我们谈到了如何使用该平台创建时尚的调查,但您也可以使用它向潜在客户提问,类似于这个例子。

2.陆地机器人

对于我们的第二个示例,我们将探索对话式 UI。 Landbot 等平台以非常直白的方式处理对话设计的概念,因为它们完全围绕文本交互构建。

Landbot 可能不像我们之前的例子那样出名,但这并不意味着他们没有一些有趣的东西。 简而言之,此服务使您能够创建基于聊天机器人的登录页面。 我们之前已经讨论过如何为 WordPress 设置 Facebook 支持的聊天机器人,但这个平台更容易上手。

该网站本身就是对话式 UI 的大师班。 这一切都是围绕一个聊天构建的,它使用了一个干净、现代的设计:

Landbot.io 的主页。

在对话的每个阶段,您都可以选择如何回复聊天机器人。 由于您使用的是预先确定的选项,因此聊天机器人的编程要容易得多。 这也是一个很好的例子,说明对话式 UI 无需无聊。

您应该从 Landbot 的对话设计方法中吸取两个突出的观点。 首先,如果你想在你的网站中包含对话式用户界面,你需要让它们引人注目。 尝试使用颜色、字体,甚至是用户在您键入时看到的小动画,以创建引人注目的内容:

Landbot.io 聊天。

高质量外链购买

其次,对话式 UI 可以很好地推动转化。 例如,聊天机器人使您能够通过发出强烈的号召性用语 (CTA) 来引导用户采取您希望他们采取的行动:

通过聊天机器人交付的几个 CTA 示例。

实施这些类型的功能可能需要一些技术知识,但结果非常值得付出努力。 您始终可以尝试创建自己的 Landbot 聊天机器人,并使用它来将用户引导至您的网站,反之亦然。

3.科迪

对于我们的最后一个示例,让我们看一下另一个对话式 UI。 Cody 展示了来自 Chop Chop 机构的简单聊天机器人。 他们的业务建立在创建聊天机器人的基础上,因此他们想炫耀自己的能力是理所当然的。

与 Landbot 示例不同,Cody 不太适合公开营销。 相反,它试图让您感觉自己正在与朋友交谈,同时为您提供重要信息。 例如,Cody 会问您是否不介意该站点使用 cookie,这是对通知的一个很大的扭曲:

JasperAI 10000字免费额度试用

运行中的 Cody 聊天机器人。

这里的对话式 UI 非常简单。 背景很干净,文字气泡很低调。 这是您可以在不删除其内容的情况下添加到任何专业网站的聊天机器人类型。

这里的关键要点是对话式 UI 不需要只专注于营销,您可以通过多种方式为聊天机器人增添一些魅力。 例如,您可以给它一个面孔和一个名字,让它感觉独特和个性化。 同样,您可以优化您使用的语言,让对话感觉更随意,而不像您在向 Google 提问。

结论

在网页设计方面,您可以订阅很多思想流派。 有材料设计、流体形状、手绘元素等等。 然而,会话式网页设计不仅仅是一种趋势。 如果您可以为每位访问者提供独特的体验,那么您将拥有其他网站无法比拟的优势。

让我们再看看一些我们最喜欢的会话设计示例:

  1. Buzzworthy 工作室: 通过个性化,您甚至可以让联系表变得更有趣。
  2. 陆地机器人: 提供一个引人注目的对话式 UI 示例。
  3. 科迪: 这个简单的聊天机器人可以很好地让您感觉自己是在与真人而不是机器交谈。

同样值得注意的是,创建一个对话式网站不仅仅是关于 设计. 你的网页 复制 也很重要。 要了解更多信息,请查看我们关于如何保持对话式写作风格的指南。

您认为在网站上实施会话设计的最佳方式是什么? 在下面的评论部分与我们分享您的想法!

Art Alex / shutterstock.com 的文章图片缩略图

5分钟生成10篇英文软文article forge软件试用
siteground

【WordPress花园提醒您】如果想购买国外正版WordPress主题和插件,您需要一张VISA信用卡才能支付,这里我们推荐光大银行信用卡!赶快免费申请,别耽误了买插件哦!

guangda
WordPress花园官方账号
WordPress花园隶致力于为广大跨境电商和独立站爱好者提供优质的WordPress教程、Woocommerce教程、Facebook、Twitter、tiktok、Instagram教程和谷歌SEO教程等资料和对应的建站推广服务。关注‘哟派出海’公众号了解最新资讯。粉丝福利:Shopline免费独立站建设14天优惠 商务合作: [email protected]
RELATED ARTICLES