即時遇見人工智慧：我們如何使用遊戲來展示我們的新庫，現已開放！

我們很高興地宣布，我們正在開源用於創建互動式體驗的程式碼，該體驗在重大技術活動中為3,000 多名用戶同步數據，展示了我們新發布的實時庫的強大功能和可擴展性。

多人無限工藝

其中一個關鍵部分是製作基於《Infinite Craft》的多人遊戲《超人》。遊戲包括結合不同的元素來創造新的元素，培養創造力。

使用者將從基本元素開始：「火」、「水」、「土」、「風」、「咖啡」、「JavaScript」和「開發者」。將「Fire」和「JavaScript」組合後，人工智慧會分析組合併建立「Firebase」。

因為這些活動會聚集大量人員（有時 3500 人），所以我們無法在每個人之間同步每個新元素。這主要是因為遊戲玩法不好玩；相反，這會令人困惑和有壓力。到這些事件結束時，將添加多達 16k 個元素。你能想像如何在手機螢幕上顯示 16k 個非結構化元素嗎？

我們採取了不同的方法，將其變成了一場比賽。每個人都會玩單一實例，但如果他們發現了第一個發現（意味著之前沒有人嘗試過這種組合），則會向用戶添加新積分，並且活動中的每個人都會收到推播通知。積分越多，最終獲得大獎的機會就越大。

新增即時

我們使用 @superviz/realtime 套件建立了 Next.js 項目，該套件提供了基於發布者/訂閱者 (PubSub) 設計模式的 WebSocket 基礎設施。這允許應用程式的不同實例之間進行有效的事件驅動通訊。

為此，我們創建了兩個不同的頻道：預設頻道和遊戲頻道。預設通道是整個體驗的通信，它會告訴用戶激活是否已獎勵積分，並且會在系統的其他部分之間同步（主要是同步用戶資料）。我們有一個專門的遊戲頻道，它會通知每個正在監聽 new.element 事件的人。

當有人組合兩個元素時，它會向我們的 API 發送請求。 API 將分析使用者是否有效以及元素組合是否已存在於我們的資料庫中。如果這兩個條件都不滿足，它將向 OpenAI 發送創建元素的提示。在返回結果之前，我們會更新資料庫並發布幾個事件。

在遊戲的前端，我們將監聽 new.event 並使用 toast 新增推播通知。像這樣：

但是應用程式的魔法發生在儀表板上，並且調度了其他事件。

有趣的儀表板

在我們的展位上，我們有一台巨大的電視來顯示儀表板。它的設計既資訊豐富又引人入勝，顯示玩家活動和發現的即時更新。它是每個參與者活動的視覺表示。不僅讓參與者了解自己的分數，還促進了整個活動的友好競爭和興奮。

儀表板的靈感來自流行的多人遊戲 Agar.io。就像 Agar.io 中的玩家透過消耗較小的細胞來成長一樣，我們的儀表板將每個參與者表示為一個動態實體，隨著他們獲得積分而擴展。

設計理念圍繞著創建即時數據的視覺吸引力和直觀表示。每個參與者都被描繪成一個圓形實體，同心圓環向外擴展以指示他們的分數和參與程度。這種有機的、類似細胞的可視化不僅使數據易於一目了然地解釋，而且還為活動體驗添加了遊戲化元素。 我們也會為那些離線的用戶增加透明度，以展示我們最近發布的狀態功能。

幕後花絮

為了實現這一點，此頁面將監聽每個事件，這就足夠了！這是該頁面訂閱的監聽事件列表：

讓我們分解這些儀表板監聽的事件，並探索每個事件如何有助於創建動態的即時體驗：

啟動事件：儀表板偵聽activation.start和activation.complete事件，這些事件在啟動開始時會新增進度環，並在啟動完成時新增完整環。這些戒指是根據該人參與激活的順序添加的，提供他們在活動過程中的即時視覺故事。

activation.game.update 事件負責展示遊戲的即時進度。它更新玩家的分數，透過在儀表板上展開實體周圍的環來直觀地表示分數。

遊戲更新： 它從遊戲頻道訂閱 new.element 事件，這將顯示創建的新元素的 Toast 通知。此功能將人們聚集在螢幕周圍，以查看其他人即時創建的內容，從而營造一種社區意識和共享興奮感。

我們看到了美麗元素的創造，如「即時通訊」、「網路套接字」、「協作環境」、「遠端工作」和有趣的元素如「星際咖啡」！

出席事件：代碼訂閱各種與出席相關的事件，這些事件在維護參與者活動的最新表示方面發揮著至關重要的作用。這些活動包括：

• Presence.leave：當參與者離線時觸發，導致他們在儀表板上的表示變成半透明。
• Presence.joined-room：presence.joined-room：當參與者上線時觸發。對於新參與者，一個新的單元格將進入螢幕。對於返回的參與者來說，它將恢復他們現有牢房的亮度。這種效果可以讓參與者和組織者輕鬆發現目前活躍在活動中的人員。

這種即時更新為所有參與者創造了動態、引人入勝的體驗，展示了即時庫在處理多個同時發生的事件和更新方面的強大功能和多功能性。

黑客馬拉松 AI 與即時技術的結合

我們最近舉辦了超級黑客馬拉松 2.0，挑戰是：人工智慧遇到即時挑戰，透過將人工智慧與即時通訊技術相結合來突破創新的界限。

參與者可以自由地創造任何他們能想像到的東西，就像我們的超級！ （但是我們不能通過這個項目參加我們自己的黑客馬拉松？）

黑客馬拉松看到了令人印象深刻的項目，這些項目利用了我們的實時庫以及各種人工智慧技術。參與者所展現的創造力和創新確實令人驚嘆。如果您對獲獎項目感到好奇，並想了解他們如何將人工智慧與即時功能相結合，我們邀請您閱讀有關黑客馬拉松獲獎者的詳細部落格文章。它是一個很好的靈感來源，展示了我們的即時庫與 AI 結合使用時的潛力。

經過多次請求，它是開源的

人們對我們遊戲的巨大熱情並沒有隨著活動的結束而結束。參與者渴望繼續玩遊戲，不受限制地探索，人們理所當然地沉迷於遊戲玩法。我們清楚地聽到了您的要求！

現在我們的新即時庫已正式發布，我們很高興地宣布我們正在將該專案的程式碼開源！這不僅可以讓您繼續玩遊戲，還可以更好地了解幕後的所有工作原理。

您可以在我們的 GitHub 頁面上找到該儲存庫。我們鼓勵您克隆它、進行試驗，甚至貢獻您自己的改進或變體。

快樂編碼和製作！

以上是即時遇見人工智慧：我們如何使用遊戲來展示我們的新庫，現已開放！的詳細內容。更多資訊請關注PHP中文網其他相關文章！