---

在 Blue，我們始終尋找讓客戶生活更輕鬆的方法。我們有每個功能的詳細文檔、YouTube 視頻、提示與技巧和各種支持渠道。

我們一直密切關注 AI（人工智能）的發展，因為我們非常關注項目管理自動化。我們還推出了如AI 自動分類和AI 摘要等功能，以使我們的數千名客戶的工作更輕鬆。

有一件事是明確的：AI 將持續存在，並將對大多數行業產生不可思議的影響，項目管理也不例外。因此，我們問自己如何進一步利用 AI 來幫助客戶的整個生命周期，從發現、售前、上線到持續的問題。

答案非常明確：我們需要一個基於我們文檔訓練的 AI 聊天機器人。

面對現實：每個組織可能都應該擁有一個聊天機器人。它們是客戶獲得即時答案的絕佳方式，無需翻閱密密麻麻的文檔或網站。聊天機器人在現代營銷網站中的重要性不容小覷。

對於軟件公司來說，不能將營銷網站視為一個獨立的“事物”——它是你產品的一部分。這是因為它符合典型的客戶生命周期：

• 認知（發現）：這是潛在客戶首次偶然發現你們出色產品的地方。你的聊天機器人可以成為他們友好的指南，立即指向關鍵功能和好處。
• 考慮（教育）：現在他們好奇，想要了解更多。你的聊天機器人成為他們的個人導師，根據他們的具體需求和問題提供量身定制的信息。
• 購買/轉換：這是關鍵時刻——當潛在客戶決定下單並成為客戶時。你的聊天機器人可以平滑任何最後的障礙，回答那些“我在購買前”的問題，甚至可能提供一個優惠來促成交易。
• 上線：他們已經購買了，接下來怎麼辦？你的聊天機器人轉變為一個有用的助手，指導新用戶完成設置，教他們如何使用，確保他們不會在你產品的奇妙世界中迷失。
• 留存：讓客戶滿意是遊戲的名稱。你的聊天機器人全天候待命，隨時準備排除問題，提供提示和技巧，確保你的客戶感受到關愛。
• 擴展：是時候升級了！你的聊天機器人可以巧妙地建議新功能、升級或交叉銷售，這些都與客戶已經使用你產品的方式相符。這就像擁有一位非常聰明、但不會強迫推銷的銷售人員隨時待命。
• 倡導：滿意的客戶成為你最大的支持者。你的聊天機器人可以鼓勵滿意的用戶傳播消息、留下評論或參加推薦計劃。這就像在你的產品中內建了一個宣傳機器！

建設與購買的決策

一旦我們決定實施 AI 聊天機器人，下一個大問題是：建設還是購買？作為一個專注於我們核心產品的小團隊，我們通常更喜歡“作為服務”的解決方案或流行的開源平台。畢竟，我們不是為了每個技術堆棧的每個部分重新發明輪子。
因此，我們捲起袖子，深入市場，尋找付費和開源的 AI 聊天機器人解決方案。

我們的要求很簡單，但不可妥協：

• 無品牌體驗：這個聊天機器人不僅僅是一個可有可無的小部件；它將出現在我們的營銷網站上，最終也會在我們的產品中。我們不想在我們自己的數字資產中廣告其他人的品牌。
• 優秀的用戶體驗：對於許多潛在客戶來說，這個聊天機器人可能是他們與 Blue 的第一次接觸。它為他們對我們公司的認知定下基調。面對現實：如果我們無法在網站上做好一個合適的聊天機器人，我們怎麼能指望客戶信任我們處理他們的關鍵項目和流程呢？
• 合理的成本：考慮到龐大的用戶基礎和將聊天機器人整合到我們核心產品中的計劃，我們需要一個不會隨著使用量的增加而讓我們破產的解決方案。理想情況下，我們希望有一個BYOK（自帶密鑰）選項。這將允許我們使用自己的 OpenAI 或其他 AI 服務密鑰，支付直接的變量成本，而不是向實際運行模型的第三方供應商加價。
• 兼容 OpenAI 助手 API：如果我們要選擇開源軟件，我們不想麻煩地管理文檔攝取、索引、向量數據庫等管道。我們希望使用OpenAI 助手 API，這將抽象掉所有背後的複雜性。老實說——這做得非常好。
• 可擴展性：我們希望在多個地方使用這個聊天機器人，每年可能有數萬名用戶。我們預期會有顯著的使用量，並且不希望被鎖定在一個無法隨著我們需求擴展的解決方案中。

商業 AI 聊天機器人

我們審查的那些通常比開源解決方案具有更好的用戶體驗——不幸的是，這通常是情況。也許有一天可以單獨討論為什麼許多開源解決方案忽視或輕視用戶體驗的重要性。

我們將在這裡提供一個列表，以防你在尋找一些可靠的商業產品：

• Chatbase: Chatbase 允許你建立一個基於你的知識庫訓練的自定義 AI 聊天機器人，並將其添加到你的網站或通過他們的 API 進行互動。它提供可靠的答案、潛在客戶生成、高級分析和連接多個數據源的能力。對我們來說，這感覺像是市場上最精緻的商業產品之一。
• DocsBot AI: DocsBot AI 創建基於你的文檔和內容的自定義 ChatGPT 機器人，用於支持、售前、研究等。它提供可嵌入的小部件，方便將聊天機器人添加到你的網站，自動回覆支持票據的能力，以及強大的 API 進行集成。
• CustomGPT.ai: CustomGPT.ai 通過攝取你的業務數據，包括網站內容、幫助台、知識庫、文檔等，創建個人聊天機器人體驗。它允許潛在客戶提問並根據你的內容獲得即時答案，而無需搜索。有趣的是，他們還聲稱在 RAG（檢索增強生成）基準測試中超越了 OpenAI！
• OpenAssistantGPT：這是一個有趣的商業產品，因為它也是開源軟件。它似乎還處於早期階段，定價也不太現實（每月 $27 的無限消息對他們來說商業上永遠無法運行）。

我們還查看了InterCom Fin，這是他們客戶支持軟件的一部分。這意味著要從HelpScout 切換過來，而我們自 Blue 開始就一直在使用它。這可能是可行的，但 InterCom Fin 的定價非常瘋狂，根本不在考慮之內。

而這實際上是許多商業產品的問題。InterCom Fin 每處理一個客戶支持請求收取 $0.99，而 ChatBase 每月收取 $399，提供 40,000 條消息。這幾乎是每年 $5,000 用於一個簡單的聊天小部件。

考慮到 AI 推理的價格正在瘋狂下降。OpenAI 大幅降低了價格：

• 原始的 GPT-4（8k 上下文）的價格為每 1K 提示令牌 $0.03。
• GPT-4 Turbo（128k 上下文）的價格為每 1K 提示令牌 $0.01，比原始 GPT-4 降低了 50%。
• GPT-4o 模型的價格為每 1K 令牌 $0.005，這比 GPT-4 Turbo 的價格進一步降低了 50%。

這是成本的 83% 降低，我們不期望這會保持不變。

考慮到我們正在尋找一個可擴展的解決方案，每年將有數萬名用戶使用，並且消息量相當可觀，直接去源頭支付 API 成本是有意義的，而不是使用一個商業版本來加價。

開源 AI 聊天機器人

如前所述，我們審查的開源選項在“優秀的用戶體驗”要求方面大多令人失望。

我們查看了：

• Deepchat：這是一個與框架無關的 AI 服務聊天組件，連接到各種 AI API，包括 OpenAI。它還具有用戶可以下載直接在瀏覽器中運行的 AI 模型的能力。我們玩過這個並使其運行，但實施的 OpenAI 助手 API 感覺相當不穩定，存在幾個問題。然而，這是一個非常有前途的項目，他們的遊樂場做得非常好。
• OpenAssistantGPT：從開源的角度再次查看這個，這將需要我們啟動相當多的基礎設施，而這正是我們不想做的，因為我們希望儘可能依賴 OpenAI 的助手 API。

建立我們自己的聊天機器人

因此，在無法找到符合我們所有要求的解決方案後，我們決定建立自己的 AI 聊天機器人，能夠與 OpenAI 助手 API 進行接口。最終，這變得相對輕鬆！

我們的網站使用Nuxt3、Vue3（這與 Blue 平台使用的框架相同）和TailwindUI。

第一步是在 Nuxt3 中創建一個可以“與” OpenAI 助手 API 進行“對話”的 API（應用程序編程接口）。這是必要的，因為我們不想在前端做所有事情，這樣會將我們的 OpenAI API 密鑰暴露給全世界，存在濫用的潛在風險。

我們的後端 API 作為用戶瀏覽器與 OpenAI 之間的安全中介。它的功能如下：

• 對話管理：它為每個對話創建和管理“線程”。把線程想像成一個獨特的聊天會話，記住你所說的一切。
• 消息處理：當你發送消息時，我們的 API 將其添加到正確的線程中，並請求 OpenAI 的助手撰寫回應。
• 智能等待：我們的 API 每秒檢查一次 OpenAI，以查看你的回應是否準備好，而不是讓你盯著加載屏幕。這就像有一位服務員在不打擾廚師的情況下隨時關注你的訂單。
• 安全第一：通過在服務器上處理所有這些，我們確保你的數據和我們的 API 密鑰安全無虞。

然後是前端和用戶體驗。如前所述，這是至關重要的，因為我們不會有第二次機會來留下第一印象！

在設計我們的聊天機器人時，我們對用戶體驗進行了細緻的關注，確保每次互動都流暢、直觀，並體現 Blue 對質量的承諾。聊天機器人界面以一個簡單、優雅的 Blue 圓形開始，使用HeroIcons 作為我們的圖標（我們在整個 Blue 網站中使用）作為我們聊天機器人的開啟小部件。這一設計選擇確保了視覺的一致性和即時的品牌識別。

我們理解，有時用戶可能需要額外的支持或更深入的信息。因此，我們在聊天機器人界面中包含了方便的鏈接。支持的電子郵件鏈接隨時可用，允許用戶直接聯繫我們的團隊以獲取更多個性化的幫助。此外，我們還整合了一個文檔鏈接，為那些想深入了解 Blue 產品的人提供更全面的資源。

用戶體驗進一步通過打開聊天機器人窗口時的優雅淡入和淡出動畫得以增強。這些微妙的動畫為界面增添了一絲精緻感，使互動感覺更加動態和引人入勝。我們還實施了一個打字指示器，這是一個小但至關重要的功能，讓用戶知道聊天機器人正在處理他們的查詢並撰寫回應。這一視覺提示有助於管理用戶期望，並保持積極的交流感。

認識到某些對話可能需要更多的屏幕空間，我們添加了在更大窗口中打開對話的能力。這一功能對於較長的交流或查看詳細信息特別有用，讓用戶可以靈活調整聊天機器人以滿足他們的需求。

在幕後，我們實施了一些智能處理來優化聊天機器人的回應。我們的系統自動解析 AI 的回覆，刪除對我們內部文檔的引用，確保所呈現的信息乾淨、相關，並專注於解決用戶的查詢。
為了增強可讀性並允許更細緻的交流，我們使用 'marked' 庫整合了 markdown 支持。這一功能使我們的 AI 能夠提供豐富格式的文本，包括粗體和斜體強調、結構化列表，甚至在必要時提供代碼片段。這就像是收到一份格式良好、量身定制的小文檔來回答你的問題。

最後但同樣重要的是，我們在實施中優先考慮安全性。使用 DOMPurify 庫，我們對從 markdown 解析生成的 HTML 進行了清理。這一關鍵步驟確保任何潛在的有害腳本或代碼在內容顯示給你之前被剔除。這是我們保證你收到的有用信息不僅具備資訊性，還能安全消費的方式。

未來發展

所以這只是個開始，我們有一些令人興奮的計劃在這一功能的路線圖上。

我們即將推出的功能之一是實時流式響應的能力。不久後，你將看到聊天機器人的回覆一個字符一個字符地出現，使對話感覺更加自然和動態。這就像看著 AI 思考，創造一種更具吸引力和互動性的體驗，讓你在每一步都保持了解。

對於我們尊貴的 Blue 用戶，我們正在開發個性化功能。聊天機器人將識別你何時登錄，根據你的帳戶信息、使用歷史和偏好量身定制回應。想像一下，一個不僅回答你的問題，還理解你在 Blue 生態系統中具體上下文的聊天機器人，提供更相關和個性化的幫助。

我們理解你可能正在處理多個項目或有各種查詢。因此，我們正在開發保持與聊天機器人進行多個不同對話線程的能力。這一功能將允許你無縫切換不同主題，而不會失去上下文——就像在瀏覽器中打開多個標籤一樣。

為了讓你的互動更加高效，我們正在創建一個功能，根據你當前的對話提供建議的後續問題。這將幫助你更深入地探索主題，發現你可能沒有想到的相關信息，使每次聊天會話更加全面和有價值。

我們還對創建一套專門的 AI 助手感到興奮，每個助手都針對特定需求量身定制。無論你是想回答售前問題、設置新項目，還是排除高級功能的故障，你都能選擇最符合你當前需求的助手。這就像擁有一支 Blue 專家的團隊隨時在你指尖，每個人專注於我們平台的不同方面。

最後，我們正在努力讓你能夠直接向聊天中上傳截圖。AI 將分析圖像並根據其所見提供解釋或故障排除步驟。這一功能將使你在使用 Blue 遇到具體問題時獲得幫助變得前所未有的簡單，架起視覺信息與文本幫助之間的橋樑。

結論

我們希望這次對我們 AI 聊天機器人開發過程的深入探討能為你提供一些有價值的見解，了解我們在 Blue 的產品開發思維。我們從識別聊天機器人的需求到建立自己的解決方案的旅程展示了我們如何進行決策和創新。

在 Blue，我們仔細權衡建設與購買的選擇，始終關注什麼最能服務我們的用戶並與我們的長期目標保持一致。在這種情況下，我們發現市場上存在一個顯著的缺口，尋求一個具有成本效益且視覺吸引力的聊天機器人，以滿足我們的具體需求。雖然我們通常主張利用現有解決方案而不是重新發明輪子，但有時最好的前進道路是創建一個量身定制的解決方案。

我們決定建立自己的聊天機器人並不是輕率的決定。這是徹底市場調查、清晰了解我們需求的結果，以及對為我們的用戶提供最佳體驗的承諾。通過內部開發，我們能夠創建一個不僅滿足我們當前需求的解決方案，還為未來的增強和集成奠定基礎。

這個項目體現了我們在 Blue 的方法：當為我們的產品和用戶做出正確選擇時，我們不怕捲起袖子從頭開始建設。正是這種願意付出額外努力的精神，使我們能夠提供真正滿足客戶需求的創新解決方案。
我們對我們的 AI 聊天機器人的未來以及它將為潛在和現有的 Blue 用戶帶來的價值感到興奮。隨著我們不斷完善和擴展其功能，我們將繼續致力於推動項目管理和客戶互動的可能性邊界。

感謝你加入我們的開發過程之旅。我們希望這能讓你窺見我們在 Blue 每個方面所採取的深思熟慮、以用戶為中心的方法。請繼續關注更多更新，因為我們將繼續發展和增強我們的平台，以更好地服務你。

如果你有興趣，可以在這裡找到此項目的源代碼鏈接：

• ChatWidget：這是一個驅動聊天小部件的 Vue 組件。
• Chat API：這是聊天組件與 OpenAI 助手 API 之間的中介。