Sketch 新出了Libraries功能,以后團(tuán)隊(duì)協(xié)作更方便了!
@C7210 :關(guān)于Sketch 47 Beta帶來的Libraries功能。終于實(shí)現(xiàn)可以調(diào)用庫(kù)文件以及一些第三方插件。但原生功能是另一碼事,在如此緊張的、可能涉及設(shè)計(jì)系統(tǒng)如許重大項(xiàng)目的功能上,依靠第三方解決方案的做法終歸有所牽制。
想來想去照舊感到Sketch官方文檔對(duì)Libraries新功能的概念和用法詮釋的最為周全和恰當(dāng),當(dāng)然Medium上還有一些很棒的實(shí)踐經(jīng)驗(yàn)供參考。
要試用Libraries功能,你首先必要到Sketch官網(wǎng)下載Sketch 47 Beta版本。
在“添加Libraries”這部分內(nèi)容當(dāng)中,我用到了自制的WireframeKit For Sketch(iOS)作為示意,這是一款面向交互設(shè)計(jì)師的線框稿風(fēng)格Sketch組件庫(kù)。
下面進(jìn)入官方文檔正文。
良好的設(shè)計(jì)來自于協(xié)作。有了Libraries功能,跨文件的Symbols共享、升級(jí)和同步便得以實(shí)現(xiàn)。
什么是Libraries?
一個(gè)Library本質(zhì)上就是一個(gè)通俗的Sketch文件,其中的Symbols可以被其他Sketch文件調(diào)用。假如你編輯了Library當(dāng)中的Symbols,那么調(diào)用了該Library的其他Sketch文件便會(huì)收到更新關(guān)照,你可以對(duì)變更進(jìn)行預(yù)覽、對(duì)比和確認(rèn),使這些Sketch文件所調(diào)用的Symbols主動(dòng)更新至最新版本。
在多人協(xié)作場(chǎng)景中,你可以將Library文件存放在Dropbox同步文件夾或GitHub的Repository當(dāng)中,并確保其他同事?lián)碛性L問權(quán)限,如許他們便可以在本身的本地Sketch文件當(dāng)中調(diào)用Library并使用其中的Symbols了。在你編輯了Library文件之后,他們的本地Sketch文件同樣會(huì)收到更新關(guān)照。
Libraries功能適合我嗎?
無論是獨(dú)自工作,照舊團(tuán)隊(duì)協(xié)作,Libraries功能都能幫你自在應(yīng)對(duì)。
我們提供了「iOS UI Design」作為默認(rèn)Library,你可以通過「Insert」菜單將常用的Symbols快速添加到文件當(dāng)中,也可以將本身的Sketch文件添加到Libraries當(dāng)中,或是打造全新的Library;無論怎樣,你都能夠在所有的Sketch文件當(dāng)中同一調(diào)用這些公用的Libraries,升級(jí)工作也只需在Libraries當(dāng)中一次性完成。
團(tuán)隊(duì)作戰(zhàn)的設(shè)計(jì)師們則可以充分行使Libraries的同步能力來確保設(shè)計(jì)方案中的UI元素為最新版本,或是及時(shí)獲取最新的品牌風(fēng)格定義。Libraries被隔離于工作文件之外,你可以通過其存放序言所提供的安全策略設(shè)置來確保其不會(huì)被錯(cuò)誤的變更;對(duì)于任何升級(jí)變更,你也有機(jī)會(huì)在同步之前對(duì)其進(jìn)行預(yù)覽確認(rèn)。
添加Libraries
要添加新的Library,你所需的僅是一個(gè)包含著Symbols定義的通俗Sketch文件,就這么簡(jiǎn)單。
當(dāng)你在本地Sketch文件當(dāng)中對(duì)Symbols進(jìn)行了優(yōu)秀的定義,并盼望在其他文件當(dāng)中進(jìn)行調(diào)用的時(shí)候,你就可以將其添加為L(zhǎng)ibrary了。通過頂部菜單欄的「Sketch Beta」進(jìn)入「Preferences」,即偏好設(shè)置(或使用快捷鍵“Command+逗號(hào)”),然后在窗口中打開「Libraries」選項(xiàng)卡。
在這里,你會(huì)看到Sketch默認(rèn)提供的Library,即「iOS UI Design」。左側(cè)復(fù)選框的選中與否將決定這個(gè)Library是否會(huì)出如今Insert菜單當(dāng)中。點(diǎn)擊右側(cè)的“眼睛”圖標(biāo),或使用空格鍵,可以對(duì)Library進(jìn)行預(yù)覽。
點(diǎn)擊右下角的“Add Library…”按鈕,選擇你本身的Sketch文件,即可實(shí)現(xiàn)Library的添加。
在上圖的范例中,我添加了自制的WireframeKit For Sketch(iOS)作為L(zhǎng)ibrary。
點(diǎn)擊左下角的管理按鈕(“齒輪”圖標(biāo)),彈出菜單,在這里你可以禁用、打開或移除當(dāng)前所選的Library。自行添加的Library在數(shù)量上沒有上限,每個(gè)Library在Symbols菜單當(dāng)中都自成系統(tǒng)。
外部Libraries
想要通過Libraries實(shí)現(xiàn)外部共享或協(xié)作?完全沒題目 。將Libraries文件存放在本地服務(wù)器、云存儲(chǔ)或版本控制體系當(dāng)中,向相干人員開放訪問權(quán)限即可。
譬如你可以將Libraries文件放置在Dropbox共享文件夾里,然后你的同伙或同事將其添加到本身的Sketch Libraries當(dāng)中,如許你們就可以基于統(tǒng)一份Library文件進(jìn)行工作了;對(duì)于該文件的任何變更都可以作用于每小我的本地Sketch文件。
使用Library Symbols
你可以像使用通俗的本地Symbols那樣使用Library Symbols,譬如通過菜單欄的Insert ? Symbol來插入到當(dāng)前畫布中。
為了與本地Symbols進(jìn)行區(qū)分,Library Symbols在圖層列表中會(huì)擁有一個(gè)獨(dú)特的圖標(biāo):
插入到畫布當(dāng)中的Library Symbols同樣可以通過右側(cè)檢查器面板進(jìn)行替代。
編輯Library Symbols
當(dāng)你預(yù)備像曩昔那樣通過雙擊Library Symbol對(duì)其進(jìn)行編輯時(shí),Sketch會(huì)提示你該Symbol屬于某Library,你可以在「Unlink from Library」或是「Open in Original Document」當(dāng)中進(jìn)行選擇。
選擇后者,Library源文件會(huì)被主動(dòng)打開,并定位到該Symbol。對(duì)源文件進(jìn)行編輯,意味著所有調(diào)用到這個(gè)Library的本地Sketch文件都會(huì)受到影響。
因此要細(xì)致:假如在團(tuán)隊(duì)范圍內(nèi)使用Libraries,那么在編輯源文件當(dāng)中的Symbols時(shí)要保持警惕。高階人員可能要對(duì)通俗團(tuán)隊(duì)成員的訪問權(quán)限進(jìn)行把控,例如設(shè)置為“只讀”(詳細(xì)設(shè)置體例必要參考你所使用的同步工具的相干說明)。
將Library Symbols本地化
假如你盼望在不影響Library源文件的情況下對(duì)Symbols進(jìn)行修改,那么在上文的對(duì)話框中選擇「Unlink from Library」,如許Library Symbol便會(huì)被本地化,離開與Library的關(guān)聯(lián);其原型也會(huì)出如今本地Sketch文件的“Symbols”網(wǎng)頁(yè)當(dāng)中。
細(xì)致:一旦Symbol離開了與Library源文件的關(guān)聯(lián),就無法再與Library保持同步。其他未離開關(guān)聯(lián)的Symbols則不會(huì)受到影響。
管理本地調(diào)用的Library Symbols
你可以對(duì)本地Sketch文件當(dāng)中所調(diào)用的Library Symbols進(jìn)行同一管理,無論它們來自一個(gè)或多個(gè)Libraries。在畫布中選中某個(gè)Library Symbol,在右側(cè)檢查器面板當(dāng)中點(diǎn)擊該Symbol的名稱,在彈出菜單中選擇「Organize Imported Symbols…」。
你可以在彈出的對(duì)話框中看到當(dāng)前文件當(dāng)中調(diào)用的悉數(shù)Library Symbols。選擇其中某一個(gè),點(diǎn)擊左下角的管理按鈕(“齒輪”圖標(biāo)),你可以選擇在Library源文件中編輯該Symbol,或是將其本地化。
Libraries的更新與同步
Libraries的緊張性不僅在于跨文件使用Symbols,同時(shí)更在于保持這些Symbols的同步更新。
我們前面已經(jīng)了解過如何編輯Library Symbols。當(dāng)你完成編輯,回到本身的本地Sketch文件當(dāng)中,你仍然可以選擇是否接受Libraries當(dāng)中發(fā)生的變更。
編輯了Library Symbols之后,回到你的本地Sketch文件,你可以在窗口右上角看到紫色的「Library Update Available 」提醒。點(diǎn)擊之后,會(huì)有對(duì)話框提醒你當(dāng)前文件中某些Symbols有待更新。
在這里,你會(huì)看到發(fā)生變更的所有Symbols,并能通過「before」和「after」進(jìn)行版本對(duì)比。假如你不確定其中的某些變更是否應(yīng)該更新到當(dāng)前本地文件,那么取消選中狀況不同步該項(xiàng)即可。
在這里,所有被選中的Symbols都會(huì)在你點(diǎn)擊「Update Symbols」之后被同步到你當(dāng)前的本地文件當(dāng)中。
假如你不盼望當(dāng)前文件當(dāng)中的某些Library Symbols被更新,也可以在同步之前就通過“Unlink from Library”將其本地化。
迎接關(guān)注作者的微信公眾號(hào):
本文地址:http://pkvc.cn/tutorial/di3955.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁(yè)設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁(yè)背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁(yè)設(shè)計(jì)中的常見頁(yè)面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁(yè)設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫(kù):40款為網(wǎng)頁(yè)設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺設(shè)計(jì)分享—專題頁(yè)面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏