Sketch 47 Libraries功能圖文詳解

終于~~

終于~~

終于~~? sketch可以被調用的庫文件。

一些第三方插件早已實現,確實,但原生功能是另一碼事;在如此重要的、可能涉及諸如設計體系這樣龐大項目的功能上,依賴第三方解決方案的做法終歸有所牽制。

要試用Libraries功能,你首先需要到Sketch官網下載Sketch 47 Beta版本。

Sketch官方文檔并未配圖,本文所有圖片均來自我(C7210? ,下同)個人的操作演示。

在“添加Libraries”這部分內容當中,我用到了自制的WireframeKit For Sketch(iOS)作為示意,這是一款面向交互設計師的線框稿風格Sketch組件庫。

下面進入官方文檔正文。

優秀的設計來自于協作。有了Libraries功能,跨文件的Symbols共享、升級和同步便得以實現。



什么是Libraries?

一個Library本質上就是一個普通的Sketch文件,其中的Symbols可以被其他Sketch文件調用。如果你編輯了Library當中的Symbols,那么調用了該Library的其他Sketch文件便會收到更新通知,你可以對變更進行預覽、對比和確認,使這些Sketch文件所調用的Symbols自動更新至最新版本。

在多人協作場景中,你可以將Library文件存放在Dropbox同步文件夾或GitHub的Repository當中,并確保其他同事擁有訪問權限,這樣他們便可以在自己的本地Sketch文件當中調用Library并使用其中的Symbols了。在你編輯了Library文件之后,他們的本地Sketch文件同樣會收到更新通知。



Libraries功能適合我嗎?

無論是獨自工作,還是團隊協作,Libraries功能都能幫你從容應對。

我們提供了“iOS UI Design”作為默認Library,你可以通過“Insert”菜單將常用的Symbols快速添加到文件當中,也可以將自己的Sketch文件添加到Libraries當中,或是打造全新的Library;無論怎樣,你都能夠在所有的Sketch文件當中統一調用這些公用的Libraries,升級工作也只需在Libraries當中一次性完成。

團隊作戰的設計師們則可以充分利用Libraries的同步能力來確保設計方案中的UI元素屬于最新版本,或是及時獲取最新的品牌風格定義。Libraries被隔離于工作文件之外,你可以通過其存放媒介所提供的安全策略設置來確保其不會被錯誤的變更;對于任何升級變更,你也有機會在同步之前對其進行預覽確認。



添加Libraries

要添加新的Library,你所需的僅是一個包含著Symbols定義的普通Sketch文件,就這么簡單。

當你在本地Sketch文件當中對Symbols進行了良好的定義,并希望在其他文件當中進行調用的時候,你就可以將其添加為Library了。通過頂部菜單欄的“Sketch Beta”進入“Preferences”,即偏好設置(或使用快捷鍵“Command+逗號”),然后在窗口中打開“Libraries”選項卡。

在這里,你會看到Sketch默認提供的Library,即“iOS UI Design”。左側復選框的選中與否將決定這個Library是否會出現在Insert菜單當中。點擊右側的“眼睛”圖標,或使用空格鍵,可以對Library進行預覽。

點擊右下角的“Add Library...”按鈕,選擇你自己的Sketch文件,即可實現Library的添加。

在上圖的范例中,我添加了自制的WireframeKit For Sketch(iOS)作為Library

點擊左下角的管理按鈕(“齒輪”圖標),彈出菜單,在這里你可以禁用、打開或移除當前所選的Library。自行添加的Library在數量上沒有上限,每個Library在Symbols菜單當中都自成體系。




外部Libraries

想要通過Libraries實現外部共享或協作?完全沒問題 - 將Libraries文件存放在本地服務器、云存儲或版本控制系統當中,向相關人員開放訪問權限即可。

譬如你可以將Libraries文件放置在Dropbox共享文件夾里,然后你的朋友或同事將其添加到自己的Sketch Libraries當中,這樣你們就可以基于同一份Library文件進行工作了;對于該文件的任何變更都可以作用于每個人的本地Sketch文件。



使用Library Symbols

你可以像使用普通的本地Symbols那樣使用Library Symbols,譬如通過菜單欄的Insert ? Symbol來插入到當前畫布當中。

為了與本地Symbols進行區分,Library Symbols在圖層列表當中會擁有一個獨特的圖標:

插入到畫布當中的Library Symbols同樣可以通過右側檢查器面板進行替換。




編輯Library Symbols

當你準備像過去那樣通過雙擊Library Symbol對其進行編輯時,Sketch會提醒你該Symbol屬于某Library,你可以在“Unlink from Library”或是“Open in Original Document”當中進行選擇。

選擇后者,Library源文件會被自動打開,并定位到該Symbol。對源文件進行編輯,意味著所有調用到這個Library的本地Sketch文件都會受到影響。

因此要注意:如果在團隊范圍內使用Libraries,那么在編輯源文件當中的Symbols時要保持小心。高階人員可能要對普通團隊成員的訪問權限進行把控,例如設置為“只讀”(具體設置方式需要參考你所使用的同步工具的相關說明)。

將Library Symbols本地化

如果你希望在不影響Library源文件的情況下對Symbols進行修改,那么在上文的對話框中選擇“Unlink from Library”,這樣Library Symbol便會被本地化,脫離與Library的關聯;其原型也會出現在本地Sketch文件的“Symbols”頁面當中。

注意:一旦Symbol脫離了與Library源文件的關聯,就無法再與Library保持同步。其他未脫離關聯的Symbols則不會受到影響。



管理本地調用的Library Symbols

你可以對本地Sketch文件當中所調用的Library Symbols進行統一管理,無論它們來自一個或多個Libraries。在畫布中選中某個Library Symbol,在右側檢查器面板當中點擊該Symbol的名稱,在彈出菜單中選擇“Organize Imported Symbols…”。

你可以在彈出的對話框中看到當前文件當中調用的全部Library Symbols。選擇其中某一個,點擊左下角的管理按鈕(“齒輪”圖標),你可以選擇在Library眼文件中編輯該Symbol,或是將其本地化。




Libraries的更新與同步

Libraries的重要性不僅在于跨文件使用Symbols,同時更在于保持這些Symbols的同步更新。

我們前面已經了解過如何編輯Library Symbols。當你完成編輯,回到自己的本地Sketch文件當中,你仍然可以選擇是否接受Libraries當中發生的變更。

編輯了Library? Symbols之后,回到你的本地Sketch文件,你可以在窗口右上角看到紫色的“Library Update Available ”提示。點擊之后,會有對話框提示你當前文件當中某些Symbols有待更新。

在這里,你會看到發生變更的所有Symbols,并能通過“before”和“after”進行版本對比。如果你不確定其中的某些變更是否應該更新到當前本地文件,那么取消選中態不同步該項即可。

在這里,所有被選中的Symbols都會在你點擊“Update Symbols”之后被同步到你當前的本地文件當中。

如果你不希望當前文件當中的某些Library Symbols被更新,也可以在同步之前就通過“Unlink from Library”將其本地化。




本文來自Be For Web

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,501評論 6 544
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,673評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,610評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,939評論 1 318
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,668評論 6 412
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,004評論 1 329
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,001評論 3 449
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,173評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,705評論 1 336
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,426評論 3 359
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,656評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,139評論 5 364
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,833評論 3 350
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,247評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,580評論 1 295
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,371評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,621評論 2 380

推薦閱讀更多精彩內容