對話式設計簡介（和 3 個傑出的例子）

現在幾乎每個人都有一個網站，所以如果你想讓你的網站脫穎而出，你必須在設計時帶來你的 A-game。 人們希望網站能夠滿足他們的特定需求，並使他們覺得自己很重要（他們確實如此！）。 如果您不能提供這種經驗，您可能無法在大聯盟中競爭。

對話式設計就是創建為每個用戶量身定制並預測他們需求的網站。 在本文中，我們將為您提供一個簡短的會話式網頁設計速成課程，並討論一些示例。

讓我們談談！

對話式設計導論

在對話式網頁設計方面，有一個重要的區別。 當人們談論這個概念時，他們主要指的是超個性化。 例如，當您登錄 Facebook 帳戶時，該平台會詢問您的想法/感受並通過姓名提及您：

這是對話式設計的一個例子。 另一方面，當人們談論對話式用戶界面 (UI) 時，他們指的是文本驅動的體驗，例如聊天機器人和 Slack。

無論如何，會話設計這個術語涵蓋了很多領域。 然而，它們都有一個共同點，即為用戶提供更加個性化的體驗。 這就是為什麼這是一件好事：

• 它可以幫助您建立信任。 對話式設計可以幫助用戶感到受歡迎，這反過來又可以激發信任並帶來更多轉化。
• 您可以充分利用收集的數據。 如今，大多數網站都會從用戶那裡收集一些個人信息。 通過對話式設計，您可以將這些數據用於實際用途。

至於哪些網站可以從採用對話式設計中受益，這取決於您為訪問者提供的互動水平。 如果您的用戶需要以某種方式與您的網站進行交互，那麼您應該考慮研究對話式設計以提供更個性化的體驗。

在下一節中，我們將向您展示一些對話式網頁設計和 UI 的示例。 我們將討論他們的正確做法以及如何在自己的網站上應用他們的方法。

3 個使用對話式設計的網站示例

對話式設計是一個廣闊的領域，因此您可以通過多種方式在您的網站上實現它。 在本節中，我們將探討三個示例，每個示例都使用不同的方法來實現個性化和對話式 UI。

1. 嗡嗡工作室

Buzzworthy Studio 的網站具有出色的聯繫表單體驗，可提供高度個性化的體驗。 進入聯繫頁面後，您可以點擊START A PROJECT號召性用語：

然後，頁面會詢問您想從事的項目類型：

例如，如果我們點擊Marketing選項，我們可以從SEO 、 PPC Campaigns或兩者中進行選擇：

做出選擇後，該網站會為您提供粗略的預算和時間表，具體取決於它：

就聯繫頁面而言，這種體驗是我們遇到的最吸引人的體驗之一。 在給你預算之前問幾個問題，會讓你覺得在僱傭他們之前你正在與自由職業者進行對話。

此外，它們還包括一個簡單的表格，您可以在其中添加他們在製定更全面的項目提案之前可能想知道的任何詳細信息：

對話設計和聯繫頁面是天作之合，特別是對於投資組合頁面。 您面臨的最大挑戰之一是讓潛在客戶感到放心，為他們量身定制您的頁面是實現這一目標的好方法。

如果您想嘗試創建更具交互性的客戶入職體驗，一種很好的方法是使用 Typeform。 不久前，我們討論瞭如何使用該平台創建時尚的調查，但您也可以使用它向潛在客戶提出問題，類似於此示例。

2.陸地機器人

對於我們的第二個示例，我們將探索對話式 UI。 Landbot 等平台以非常字面的方式處理對話設計的概念，因為它們完全圍繞文本交互構建。

Landbot 可能不像我們之前的例子那麼出名，但這並不意味著他們沒有什麼有趣的東西。 簡而言之，此服務使您能夠創建基於聊天機器人的登錄頁面。 我們之前已經討論過如何為 WordPress 設置由 Facebook 驅動的聊天機器人，但這個平台更容易上手。

該網站本身是對話式 UI 的大師班。 這一切都圍繞著一個單一的聊天而構建，它使用了一個乾淨、現代的設計：

在對話的每個階段，您都可以選擇如何回复聊天機器人。 由於您使用的是預先確定的選項，因此聊天機器人更容易編程。 這也是一個很好的例子，說明對話式 UI 不需要無聊。

您應該從 Landbot 的對話設計方法中吸取兩個突出的要點。 首先，如果你想在你的網站中包含對話式 UI，你需要讓它們引人注目。 玩轉顏色、字體，甚至是用戶在打字時看到的小動畫，以創造引人注目的內容：

其次，對話式 UI 非常適合推動轉化。 例如，聊天機器人使您能夠通過提供強大的號召性用語 (CTA) 來引導用戶採取您希望他們採取的行動：

實現這些類型的功能可能需要一些技術知識，但結果非常值得付出努力。 您可以隨時嘗試創建自己的 Landbot 聊天機器人，並使用它來將用戶引導到您的網站，反之亦然。

3. 科迪

對於我們的最後一個示例，讓我們看一下另一個會話 UI。 Cody 展示了來自 Chop Chop 機構的一個簡單聊天機器人。 他們的業務是圍繞創建聊天機器人而建立的，因此他們想炫耀自己的能力是理所當然的。

與 Landbot 示例不同，Cody 不太適合公開營銷。 相反，它試圖讓您感覺像是在與朋友交談，同時向您提供重要信息。 例如，Cody 會問你是否不介意網站使用 cookie，這是對通知的一個重大轉折：

這裡的對話 UI 非常簡單。 背景乾淨，文字氣泡非常低調。 這是您可以看到添加到任何專業網站的聊天機器人類型，而不會帶走其內容。

這裡的關鍵要點是對話式 UI 不需要只專注於營銷，有很多方法可以為聊天機器人添加一些天賦。 例如，你可以給它一個面孔和一個名字，讓它感覺獨特和個性化。 同樣，您可以優化您使用的語言，讓對話感覺更隨意，而不是像在向 Google 提問。

結論

在網頁設計方面，您可以訂閱很多思想流派。 有材料設計、流體形狀、手繪元素等等。 然而，對話式網頁設計不僅僅是一種趨勢。 如果您可以提供為每個訪問者量身定制的獨特體驗，那麼您將擁有很少有網站可以匹敵的優勢。

讓我們再看一些我們最喜歡的對話式設計示例：

1. Buzzworthy Studio：通過個性化，您甚至可以讓聯繫表格變得更有趣。
2. Landbot：提供了一個引人注目的對話 UI 示例。
3. Cody：這個簡單的聊天機器人在讓你覺得你是在和一個真人而不是機器說話方面做得很好。

您認為在網站上實施對話式設計的最佳方式是什麼？ 在下面的評論部分與我們分享您的想法！

Art Alex / shutterstock.com 的文章圖片縮略圖