符號是我們設計專案的支柱。它們讓您更容易在文件中填充重複出現的元素,並一次性更新所有元素。但並非每個按鈕、圖示或文字區塊都是相同的。有時您需要對編輯進行非常具體的調整,這就是覆蓋的用武之地。覆蓋允許您快速自訂特定的符號實例,使其成為您嘗試新事物的最佳幫手。
問題是,我們的創造力總是想更進一步,而我們不想限制這一點。因此,我們一直在改進符號、覆蓋,甚至是我們的介面,讓它們為您發揮更大的作用。
讓我們來看看一些令人興奮的變化,以及它們如何為您的設計工作流程注入強大動力!
全新的「覆蓋」面板,是誰呢?
過去,您可以透過套用色調、覆蓋文字圖層中的文字、交換巢狀符號、文字樣式和圖層樣式來編輯符號實例。現在,我們添加了一整套顏色和文字屬性覆蓋選項,這些選項將真正加快您的符號編輯體驗。
在我們努力為您的覆蓋添加更多彈性的同時,我們還改進了「檢查器」中的「覆蓋」面板。以下是改版前後的比較,或者我們喜歡稱之為煥然一新
全新的「覆蓋」面板提供了許多用於符號編輯的新選項,同時保持界面簡潔易用。
「覆蓋」面板剖析
全新的「覆蓋」面板提供了許多用於符號編輯的新選項,同時保持界面簡潔易用。如上所示,「覆蓋」面板現在會在您選擇符號時,按群組列出可覆蓋的屬性。
以下是可用覆蓋群組的完整列表
- 符號中使用的所有顏色
- 您可以為符號設置的文字值
- 套用的任何文字樣式或圖層樣式,分組顯示,每種樣式只顯示一個條目
- 符號中使用的所有圖像
- 符號中的任何巢狀符號及其包含的熱點
這些覆蓋類型現在都歸類在各自的區段下,這將幫助您輕鬆地對顏色、樣式、文字和圖像進行批量更改,但更多相關資訊請參閱後文。
無處不在的顏色
如你所願,我們做到了!顏色覆蓋功能終於來了——而且我們指的可不只是色調。改進後的覆蓋面板新增了「顏色」區塊,會以色票的形式顯示符號中使用的所有顏色。你甚至可以像在顏色選擇器彈出視窗中顯示 顏色變數 一樣,以網格或清單檢視的方式排序色票。
這對你的設計來說意味著什麼?想像一下,你正在建立一個一次性的節日活動登陸頁面,並且想重複使用主網站上現有的符號按鈕——但顏色不符。現在,你不用再建立新的符號變體,只需使用「覆蓋」面板就能輕鬆變更該按鈕執行個體的顏色。
但這個區塊的功能不僅僅是讓你覆蓋顏色。舉例來說,將滑鼠懸停在顏色的色票上,就會在文件中使用該顏色的所有位置醒目顯示。這是查看哪些圖層共用顏色屬性的一個好方法。將滑鼠懸停時,你還可以查看更多資訊,例如顏色的 Hex 代碼和名稱。
你可以在我們的 文件中進一步瞭解覆蓋顏色。
對文字說聲好
新的「覆蓋」面板在處理文字方面也有一些亮點。現在,每當你在畫布上選取文字圖層時,你會看到所有文字屬性覆蓋都已分組並列在「檢查器」中。目前,你可以覆蓋任何巢狀文字圖層的粗細、顏色、裝飾和對齊方式。很棒,對吧?
假設你正在設計一個使用含有巢狀文字圖層的選單項目符號建立的選單,但你想將其中一個項目設為季節性菜餚。現在,你可以為標題加上底線,或為其賦予不同的顏色,讓你的顧客知道這道菜是限量供應的,而無需離開「覆蓋」面板。
你可以在我們的 文件中進一步瞭解覆蓋文字圖層和樣式。
別擔心,我們沒有忘記文字樣式。現在,由於覆蓋會按類型分組,你可以對符號執行個體進行批量變更——這是在一次操作中交換所有文字樣式的好工具。
不確定哪些圖層應用了文字樣式?只需選取執行個體,然後將滑鼠懸停在「檢查器」中的文字樣式上。我們會醒目顯示當前使用該樣式的所有圖層。在這裡,你可以使用下拉選單自動交換所有圖層,或者在執行個體中選取特定的文字圖層,如果你想手動編輯它們。
你可以對各種覆蓋群組進行批量變更,例如顏色和圖層樣式。
提升使用覆蓋功能時的體驗品質
流暢的設計體驗需要的遠不止是酷炫的新功能。這就是為什麼我們希望確保我們還能在各處添加一些額外的改進,讓你的工作更輕鬆。讓我們來看看我們最近發佈的一些提升體驗品質的改進,以及它們如何幫助你更好地、更快地使用覆蓋功能 👀
在符號執行個體中選取圖層
有效的覆蓋工作流程的關鍵在於能夠輕鬆地選取所需的圖層。這就是為什麼我們對 Sketch 中的圖層選取進行了一些調整。以前,雙擊符號會進入其來源——雖然這種行為很有幫助——但我們認為,如果雙擊允許你深入符號執行個體,會更方便。
不確定這是什麼意思嗎?假設您深陷於巢狀符號中。您真的全力以赴,在符號中添加了各種符號,因為您是 Sketch 專家,而且什麼都不怕。但是現在您想要覆寫最深層的巢狀圖層。您無需在「覆寫」面板中搜尋,只需在實例上按兩下即可開始深入了解圖層。
但是,等等。還有更多!以下列出我們新增的一些方便的 快捷鍵,可幫助您選取要編輯的確切巢狀圖層。
- 在未選取任何物件的情況下按 ⌘ 點擊 → 選取到下一個符號
- 第一次按 ⌘ 點擊 → 選取畫布上的實例
- 後續按 ⌘ 點擊 → 選取巢狀符號
- 在選取實例的情況下按 ⌘ 點擊文字圖層 → 直接選取文字(只要未選取任何父符號)
- 按 ⌘⌃ 點擊任何圖層 → 選取最深層的巢狀圖層。
注意:您現在可以使用 ⌘↵ 快捷鍵直接跳至符號的來源。
圖層清單改進
為了保持整齊,我們過去只在「圖層清單」中顯示符號中經過樣式設定的巢狀圖層。但現在,我們採用了 1:1 的對等關係。這表示「圖層清單」現在會顯示符號內部的每個圖層,無論其是否套用樣式,讓您更容易直接從「圖層清單」編輯任何想要的圖層。
透過「圖層清單」,您也可以輕鬆隱藏巢狀元素,方法是點擊其名稱旁邊的眼睛圖示。這表示您不再需要使用「覆寫」面板中的「無符號」來覆寫巢狀符號。現在,您只需按一下即可完成此操作。如果您想讓巢狀元素重新出現,只需再次點擊眼睛圖示即可重新開啟可見性。
注意:您也可以使用快捷鍵 ⇧⌘H 或 ⌫ 來開啟和關閉可見性。
您也可以使用快捷鍵 ⇧⌘H 或 ⌫ 來開啟和關閉可見性。
更多快捷鍵
快捷鍵永遠不嫌多,但我們也相信讓現有快捷鍵發揮更大作用。因此,我們採用了三個最受歡迎的快捷鍵,並提升了它們的功能。
T 快捷鍵現在不僅可以啟用文字工具。它還允許您獨立編輯任何文字圖層,無論其是在符號還是群組中。這表示您無需擔心文字圖層的來源即可知道如何編輯它。
我們還將複製貼上功能提升到下一個層級。您可能會問,怎麼做到的?嗯,現在您可以使用 ⌘C 複製符號中的任何圖層、群組或巢狀符號。然後按 ⌘V 將其貼上到畫布上的任何其他位置,作為單獨的圖層或群組。以前,您必須分離巢狀符號或從符號來源複製圖層才能獲得相同的結果。但現在呢?您無需離開正在處理的實例。此外,您貼上的圖層將保留與您複製的圖層相關聯的覆寫。
就是這樣!我們希望您已準備好並受到啟發,在 Sketch 中試用新的覆寫功能。這些只是我們一直在努力的眾多改進中的一部分。請查看我們的 最新消息 頁面,以詳細了解調整大小改進、註解等等。