“Ant Design X 登場，AI 設(shè)計新助力?！?在 B 端產(chǎn)品設(shè)計領(lǐng)域，Ant Design X 的推出帶來新變化。它將如何影響 B 端設(shè)計師的工作？又為 AI 產(chǎn)品設(shè)計提供了哪些新思路？

最近，沉寂了許久的 Ant Design 迎來了全新的產(chǎn)品：Ant Design X

那這次的更新會和 Ant Design 5.0 的更新有什么不同？對于 B 端設(shè)計師又會造成哪些影響？為什么我說這又是一次“參考書”級別的更新～ 讓我們來一起看看～

一、什么是 Ant Design X

我相信最近一年，已經(jīng)有非常多的 B 端設(shè)計師開始負責(zé) B 端產(chǎn)品的 AI 化迭代。

比如 小鵝通增加了 AI 助手、騰訊云增加了 AI 智能客服，每一個產(chǎn)品都在想與 AI 領(lǐng)域的結(jié)合，進而尋求新的增長點。

作為小團隊可能會把它當(dāng)做是一個簡單的需求，而對于大的設(shè)計團隊而言，我們需要考慮如何拆解 AI 的產(chǎn)品功能，以便于我們能夠快速給到大量的產(chǎn)品進行復(fù)用，因此 AI Design X 就誕生了。

據(jù)在阿里內(nèi)部的同學(xué)透露，在阿里團隊內(nèi)部就需要輸出大量產(chǎn)品的 AI 模塊迭代，因此孵化了諸多像：數(shù)據(jù)分析、信息搜索、智能客服 等多個 AI 功能。既然制作了如此多的功能，不如慢下來將設(shè)計當(dāng)中的理論體系進行沉淀，因此就有了 ADX 的出現(xiàn)。

我們再來看其官網(wǎng)，整體風(fēng)格延續(xù)的 Ant Design 的設(shè)計調(diào)性，這部分我還是非常喜歡。

二、Ant Design X 有什么？

首先在 ADX 當(dāng)中，里面包含了：設(shè)計范式、對應(yīng)組件、界面演示。

在我看來如果你對 B 端與 AI 產(chǎn)品的結(jié)合思路不夠清晰，那一定要看設(shè)計范式～ 因為它是對整個 AI 產(chǎn)品內(nèi)容進行全面的拆解。

對于組件和界面演示，我們就是在設(shè)計過程當(dāng)中有對應(yīng)問題，可以通過它來獲取解決方案。

由于整個范式內(nèi)容過多，我將其重要部分加以整理，帶領(lǐng)同學(xué)們快速學(xué)習(xí)一遍。（當(dāng)然也建議大家看完過后去到 Ant Design X 再進行細致閱讀）

RICH 設(shè)計范式

在系統(tǒng)當(dāng)中，Ant Design X 提出了 RICH，也就是 意圖、角色、會話、界面。

意圖，其實就是目的

在用戶使用 AI 工具時，通常都都會有自己的想法，比如 想搜索一個設(shè)計知識點、查看對應(yīng)的數(shù)據(jù)報表、獲取幫助中心內(nèi)容。

對于整個意圖而言，主要分為：清晰/模糊、任務(wù)/咨詢，我們通過用戶對于意圖的分類，進而采取不同的設(shè)計界面。

比如現(xiàn)在我有清晰的目的就是想讓 AI 幫助我修改文檔當(dāng)中的一段文字，而這種時候我們通常會采取內(nèi)嵌式的方式進行實現(xiàn)。這就是意識所帶來的差別。

角色，則是 AI 所扮演的角色類型。

因為不同的產(chǎn)品在接入 AI 時，它的需求就會有所不同。

比如在幫助中心，AI 需要更強的親和力；在 BI 的數(shù)據(jù)分析模塊，則需要你更為專業(yè)。因此我們會給 AI 賦予更為表面的的外在形象，更為深入的內(nèi)在性格。

對于形象部分，我們需要創(chuàng)造更為真實一致的 AI 角色。比如形象的部分，我們可以 外貌、服飾、動作 等內(nèi)容構(gòu)建一致角色形象；

對于性格部分，我們需要“說出”與角色相符的語言語氣，這樣才能使你的 AI 產(chǎn)品更具生動的表達。

由于很多 B 端系統(tǒng)會在很多地方接入 AI，因此在形象的部分 B 端產(chǎn)品會更傾向使用科技、概念的視覺形象。

會話，也就是與 AI 的對話設(shè)計。

在系統(tǒng)當(dāng)中，AI 的所有內(nèi)容都需要通過對話的形式進行交互，因此我們在設(shè)計時就需要梳理整體的交互狀態(tài)。

同時對于 AI 來說它所生成的內(nèi)容取決于用戶所提供的文本量，所以對話當(dāng)中就會包含有：開始、追問、提示、確認、錯誤、結(jié)束 等不同狀態(tài)。

對于每一種狀態(tài)，在文檔當(dāng)中都會給出清晰的解析，這是我們在日常設(shè)計當(dāng)中可以重點關(guān)注的內(nèi)容。

最后則是界面，對于目前整體的界面模式進行歸類。

主要包含：內(nèi)嵌式（Do）、助手式（Do+Chat）、獨立式（Chat）三種界面類型。在交互的模式上給我們規(guī)定了 AI 產(chǎn)品的使用場景。

同時將使用 AI 產(chǎn)品的用戶旅程劃分為 4 個階段：喚醒、表達、確認、反饋，在此基礎(chǔ)上，我們就會使用不同的組件來進行階段的設(shè)計。

組件這部分大家可以訪問官網(wǎng)自行查看～ https://ant-design-x.antgroup.com/

三、如何使用 Ant Design X ？

這時候很多同學(xué)會有疑問，那我們現(xiàn)在能用 ADX 直接進行 AI 產(chǎn)品的產(chǎn)出嗎？

我仔細查看了一下，覺得目前還是不行。

一方面是目前整體設(shè)計資源并沒有完全開源，我們?nèi)ピL問目前的資源依舊不能下載，因此沒辦法基于它進行設(shè)計；同時針對這種才面世不久的設(shè)計系統(tǒng)，我們可以稍加等待，因為前期一定是不夠成熟的，等著后續(xù)產(chǎn)品逐漸完善過后，有足夠多的人實驗了沒有問題再接入也不遲。

所以我會認為，目前它是我們設(shè)計師最容易上手的 AI 學(xué)習(xí)手冊，它能夠幫助我們快速的了解 AI 產(chǎn)品當(dāng)中的各種問題，你要做的就是在這些類型當(dāng)中進行選擇，內(nèi)容的解析是真心不錯～

那除了 Ant Design X 還有哪些與 AI 相關(guān)的內(nèi)容呢？這些再給大家推薦幾個不錯資源：

AWS 的 Cloudscape 設(shè)計系統(tǒng)，提供了較多的 AI 設(shè)計模式，我們也可以進行嘗試。https://cloudscape.design/patterns/

IBM 的 Carbon 設(shè)計系統(tǒng)，也提供了 AI 模式的拆解，大家也可以進行學(xué)習(xí)查看。https://carbondesignsystem.com/guidelines/carbon-for-ai/#ai-chat

在我看來，未來還會有更多的 AI 產(chǎn)品，更復(fù)雜的 AI 規(guī)范，我們作為設(shè)計師我們更應(yīng)該提前了解，為自己爭取更多發(fā)展新機會。