如今，領(lǐng)先的品牌、企業(yè)和組織不僅僅是在為一個(gè)平臺(tái)設(shè)計(jì)體驗(yàn)揩抡，而是在為許多平臺(tái)設(shè)計(jì)體驗(yàn)。隨著數(shù)字產(chǎn)品從網(wǎng)站到移動(dòng)應(yīng)用再到智能手表等眾多平臺(tái)的激增镀琉，人們?cè)絹碓叫枰环N集中峦嗤、可擴(kuò)展的方法來快速創(chuàng)建令人愉悅的客戶體驗(yàn)，同時(shí)還能保持一致的品牌形象屋摔。設(shè)計(jì)系統(tǒng)的出現(xiàn)強(qiáng)調(diào)了品牌的一致性烁设、工作流程的效率以及產(chǎn)品團(tuán)隊(duì)內(nèi)部更順暢地協(xié)作等共同目標(biāo)。隨著全渠道數(shù)字格局的建立，產(chǎn)品發(fā)布時(shí)間變得至關(guān)重要装黑，因此產(chǎn)品團(tuán)隊(duì)現(xiàn)在需要更快的設(shè)計(jì)迭代和更高效的工作流程以跟上不斷提升的產(chǎn)品內(nèi)容速度副瀑。

借助 Adobe XD，產(chǎn)品設(shè)計(jì)團(tuán)隊(duì)可以為設(shè)計(jì)系統(tǒng)創(chuàng)建資源和可重復(fù)使用的組件的共享庫恋谭，并在設(shè)計(jì)項(xiàng)目中使用它們糠睡。通過云文檔，鏈接資源和文檔歷史記錄等功能疚颊，你和你的團(tuán)隊(duì)可以在協(xié)作平臺(tái)上協(xié)作和共享設(shè)計(jì)狈孔，查看實(shí)時(shí)更新的文檔，從而實(shí)現(xiàn)快速迭代材义。

但是均抽，設(shè)計(jì)系統(tǒng)的工作流程并不總是以 XD 開始和結(jié)束。幸運(yùn)的是其掂，XD 的生態(tài)系統(tǒng)每天都在增長(zhǎng)油挥，新插件不斷涌現(xiàn)，可以幫助你更好地創(chuàng)建款熬、實(shí)施和管理你的設(shè)計(jì)系統(tǒng)喘漏。以下是一些普遍受歡迎的插件資源，可以幫助你創(chuàng)建設(shè)計(jì)系統(tǒng)文檔站點(diǎn)华烟、共享品牌準(zhǔn)則和資源、促進(jìn)設(shè)計(jì)人員與開發(fā)人員之間更好的協(xié)作持灰，以及提取 Design Tokens 以用于XD設(shè)計(jì)中盔夜。

Zeroheight

Zeroheight 是一款在線協(xié)作編輯器，可幫助你使用XD中創(chuàng)建的資源和組件為設(shè)計(jì)系統(tǒng)創(chuàng)建和維護(hù)一個(gè)漂亮的文檔網(wǎng)站堤魁。該款插件專為由設(shè)計(jì)師喂链、文案和開發(fā)人員組成的產(chǎn)品團(tuán)隊(duì)而設(shè)計(jì)，是設(shè)計(jì)文檔的單一信息源（single source of truth）妥泉。該插件可輕松上傳和組織 XD 的組件和樣式椭微，以使你的文檔在 zeroheight 網(wǎng)站上保持最新。借助該插件盲链，你可以在短短幾個(gè)小時(shí)內(nèi)建立一個(gè)設(shè)計(jì)系統(tǒng)的文檔站點(diǎn)蝇率。Adobe XD 網(wǎng)站上發(fā)布的 Zeroheight Walkthrough 這篇文章向你展示了該插件的具體使用方法。

使用 zeroheight 插件將一個(gè)按鈕組件從 Adobe XD 上傳到文檔站點(diǎn)

Frontify

Frontify 是一個(gè)用戶友好的全品牌管理平臺(tái)刽沾，使客戶能夠最大化其品牌的一致性本慕、效率和參與度。使用 Frontify 插件侧漓，可以將 Frontify 中始終保持最新的數(shù)字品牌資源直接鏈接到Adobe XD锅尘，從而可以無縫訪問顏色、字體排版布蔗、圖標(biāo)藤违、圖像和徽標(biāo)等設(shè)計(jì)元素和組件浪腐。

從 Frontify 導(dǎo)入品牌資源到 Adobe XD 的畫布

Zeplin

Zeplin 是產(chǎn)品團(tuán)隊(duì)的協(xié)作空間，你可以在其中共享顿乒、組織和協(xié)同設(shè)計(jì)议街，同時(shí)該插件還考慮到了針對(duì)開發(fā)人員的使用。

Zeplin 中的樣式指南讓你可以對(duì)設(shè)計(jì)系統(tǒng)的顏色淆游、文本樣式和組件進(jìn)行集中式管理傍睹。有了Zeplin 3.0，開發(fā)人員可以在界面右側(cè)的代碼庫中直接查看UI組件犹菱，同時(shí)還提供了直達(dá)設(shè)計(jì)文檔的鏈接拾稳，提高整個(gè)團(tuán)隊(duì)的協(xié)作效率。

將一個(gè) Adobe XD 畫布導(dǎo)出到 Zeplin

Toolabs

Toolabs DSM插件是一個(gè)狀態(tài)化的設(shè)計(jì)系統(tǒng)管理器腊脱，可以讓你將 Design Tokens 鏈接到 Adobe XD 文檔中的設(shè)計(jì)元素访得。只需創(chuàng)建 Design Tokens，定義設(shè)計(jì)系統(tǒng)的不同顯示狀態(tài)（例如顏色主題陕凹、多語言和版本等）悍抑，然后再通過定義顯示狀態(tài)的不同變體來使設(shè)計(jì)主題化，而無需復(fù)制多個(gè)畫板來展示不同樣式的設(shè)計(jì)樣稿杜耙。

在 Adobe XD 中將 Design Tokens 鏈接到設(shè)計(jì)元素

Superposition

Superposition 是一個(gè)免費(fèi)的桌面應(yīng)用程序搜骡，可用于從網(wǎng)站中提取所有的 design tokens，并將它們直接應(yīng)用到 Adobe XD 的設(shè)計(jì)中佑女。你只需輸入網(wǎng)站的網(wǎng)址即可提取顏色记靡、排版、間距等团驱。首先安裝支持 Adobe XD 的 Superposition 插件摸吠，然后直接從插件面板中的 Superposition 內(nèi)部使用 design tokens。選擇任意對(duì)象便會(huì)顯示適用其的 design tokens嚎花，單擊這些 design tokens 即可應(yīng)用到你選擇的對(duì)象上寸痢。使用該插件可以讓你的網(wǎng)站或應(yīng)用程序的不同部分甚至跨項(xiàng)目達(dá)到一致的體驗(yàn)。

從網(wǎng)站提取 design tokens 并將它們應(yīng)用到 Adobe XD 的對(duì)象上

總結(jié)

對(duì)于希望擴(kuò)展工作流程以適應(yīng)更廣泛的數(shù)字平臺(tái)和渠道的產(chǎn)品團(tuán)隊(duì)而言紊选，設(shè)計(jì)系統(tǒng)至關(guān)重要啼止。借助上述插件，你可以輕松地使用 XD 來創(chuàng)建設(shè)計(jì)系統(tǒng)兵罢，以在整個(gè)團(tuán)隊(duì)中建立高效的工作流程和品牌一致性族壳。

在 Adobe XD 的插件管理器中你可以看到一組被推薦的名為「Kickstart Design System Collection」的插件集合，其中包含了幾款適合創(chuàng)建設(shè)計(jì)系統(tǒng)的插件趣些，不妨試試看仿荆。

Adobe XD的插件集合：Kickstart a Design System

英文原文：https://theblog.adobe.com/5-xd-plugins-for-design-systems/
原文作者：Minson Chen
編譯作者：微博/公眾號(hào)@設(shè)計(jì)吐司

以上譯文僅代表原作者觀點(diǎn)。如需轉(zhuǎn)載請(qǐng)遵循CC版權(quán)協(xié)議正確標(biāo)明出處。