原文鏈接:The Simplest How-To Guide for Sharing a Design System with Your Team
原文作者:Jon Moore
很多團隊都在構建Design System,所以我回答了很多這樣的問題:
Hey Jon,我和我的團隊如何構建新的Design System?
Woah,很高興能聽到你們的問題,接下來我們一起來完成:
1.下載這款插件,brand.ai(https://assets.brand.ai/plugin/sketch/uxpt)
2.注冊并登錄
3.進入“text”的tab,然后點擊“Add Type Styles”。選中全部然后添加。
你的設計團隊可以使用所有的這些文本樣式。
4.進入“Styles”的tab,點擊“Add Shared Styles”。選中全部,然后添加。
你的設計團隊也可以使用所有的圖層樣式了。
5.進入“Component”的tab然后添加symbols
在Sketch的symbol頁面選中你的組件面板(buttons,inputs,nav bars等等),在插件的窗口中點擊“Add Layers”,給它們一個命名。這里有一個15秒的GIF展示:
如果你使用System,像是UX Power Tools,有“helper symbols”,不需要選擇這些支持的symbols(顏色或者文本symbols)。這些都是可以自動上傳!只會上傳最新的構建組建symbols。
7.上傳其他的材料(logos,icons,和圖片...如果你需要的話)
這些tabs來幫助你完善組織。如果你想讓預定義的頁面(網格,登錄等)可以被其他設計師引用,你也可以上傳整個面板。
8.邀請團隊成員
一起來討論吧。(邀請你的其他成員加入)
9.完成啦~去給自己買根辣條吧。(看起來很像是不是?然而原文不是辣條,haha~)
FAQs
它真的這么快速構建嗎?
是的。
我的Symbols有嵌套symbols,并且會覆蓋檢查面板。我可以上傳這些嗎?它們會有用嗎?
Sketch允許你覆蓋嵌套symbols(像是icon)和其他有相同外型的symbols。當你上傳你的symbols到庫中時,Brand.ai首先會上傳所有直接嵌套的symbols到你添加的組件中,然后上傳所有其他匹配外型的嵌套symbols。
為什么它這么酷?
其他的共享設計庫只會看起來在一個層次,當添加組件和symbols的時候。但是Brand.ai允許覆蓋symbols,當一個設計師拖拽一個button到面板上時,它會帶來所有的關聯symbols。你做的那個漂亮button,對每個伙伴而言都是一樣的。
我每次從共享庫中添加組件到文檔中,它不會繼續導入嵌套的symbol嗎?
它不會,這個插件很聰明,它會檢查文檔是否存在,如果已經存在了就不會繼續導入。如果不這樣做,它們可能就會導入很多新的symbol。
如果我更新一個組件呢?
如果你是資源庫的所有者,只需要將更新的組件添加到資源庫中。就像我們在上面演示的那樣,它會詢問你是否要創建一個新的symbol或者覆蓋已存在的符號。
我的團隊會看到我的更新嗎?
當然,團隊成員會收到更新通知,并提示他們更新文件來匹配資源庫中的組件和樣式選項。
它不會重新加載所有的symbol是嗎?
是的,它只會更新更改的內容。
還有比它更好用的嗎?
應該是沒有了。
概要
辣條(原文是Lightsaber churros..但是看起來真像是辣條?。┦且粋€真實存在的東西,共享design systems非常好用而且很容易去設置。