「教程乾貨」- 一些關於 Symbol 使用建議的總結
大概需要 3 - 5 分鐘閱讀
我相信沒人願意接盤雜亂而零散的Sketch文件,所以只要是出自我們手裡的Sketch文件,就應保證其是清晰整潔的。(譯者:若能達到令人敬畏的境界實為上乘。)
基本 Symbol 控制項
應盡量將控制項保持在較小的粒度,以及相互之間的低耦合,以確保較強的可維護性。
Symbol 控制項命名
我們試著全部保持小寫,並用「/」來分隔。這樣Sketch會自動實現子父級的菜單關係。(譯者:菜單根屬關係與大小寫無關。在此澄清措辭上的潛在誤會。)
在這我想推薦一種「控制項/屬性-狀態」的命名規範。
你應盡量將控制項狀態與控制項本身的物理屬性分離開來,因為無論其狀態還是物理屬性,都有可能不斷演變。
button/primary-mouseover
button/primary-disabled
in/input/field/active
如果你用Sketch Runner這款插件,找起Symbol是不是輕鬆很多?(譯者:譯完自己裝了一個,發現此插件太凶了~快速插入、跳轉、運行、創建、預覽,等等)
Symbol 內部圖層命名
首先,Symbol的內部欄位命名非常重要。請確保那些「需要經常切換狀態的Symbol」之間的欄位名稱是相同的,因為切換Symbol狀態後,可以使之前的Overrides內容得以保留。
其次,為「Symbol控制項」重命名並不會影響到「Symbol原件」。我的習慣是用純小寫命名控制項,而用純大寫命名文本欄位。這純屬個人偏好,無關對錯。
Symbol 圖層結構
請盡量按視覺邏輯去打理圖層順序,因為Overrides面板會按圖層順序將欄位顯示出來。
Symbol 嵌套
對於相同尺寸的子Symbol,可以在其父級Symbol內替換。在「切換圖標」或「切換控制項狀態」等場景下非常常用且高效。
以下4種狀態其實僅用了1個Symbol來實現
(譯者:此處指的是1個父Symbol。)
Resizing
還不熟悉Resizing功能的同學可以看一下這篇,專門講解 → 知乎專欄
其它
文本尺寸應設為固定值
將文本尺寸設為固定值,並將Resizing屬性設為Resize Object,即可使文本隨Symbol尺寸的變化而變化。
Symbol尺寸最小化
反正可以Resizing,同時,理論上「拉伸」要比「壓縮」更容易,同時還能保持文件比特的最小化。
軟廣硬發:更多「Sketch中文教程」及「Sketch優質素材」,盡在 Sketch 素材網 ??????原文地址:https://medium.com/@lloyd/sketch-symbols-best-practices-now-that-nested-overrides-are-a-thing-9b651d3fe1a4#.1mwf21pru
原作者:Lloyd Humphreys
譯者:Sketch U&I ?? 微博關注,定時乾貨
推薦閱讀:
※「教程乾貨」- 想在Sketch里實現響應式網格系統?簡單!- 響應式系列三
※高能提升你的Sketch效率 :基礎快捷鍵篇
※「教程乾貨」- 巧騙Sketch,讓按鈕實現自動Padding