中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

Sketch是一款輕量的設計工具，特別適合有條件（Macbook）的交互設計師使用，提高自己的審美能力，設計更有逼格的作品。自從Sketch 3更新Symbol以來，Sketch已經向原型工具看齊，還能配合Principle無縫實現交互效果。本文將詳細介紹Sketch用于原型設計的核心功能——Symbol的正確打開方式。友情提示：適用于有一定基礎的Sketch用戶。

1.寫作背景

網上關于Symbol的用法教程也有不少，但或多或少存在的一些問題，列舉如下：

• 說明過于簡單，摻雜術語較多，缺乏具體的示例，這部分教程源于官方給出的中文說明手冊；
• 直接上手就操作，項目實際應用介紹不夠充分，只為學習工具使用，多見于民間中文教程；
• 具體介紹項目應用，但是略過中間實現的步驟，多發布于外文教程。

所以，想借此文章整理一下，目標是：讓大家熟練掌握Symbol用法，具體運用到項目當中去，提高交互設計效率。

2.Symbol的介紹及應用場景

（1）Symbol是什么？

Symbol譯作“符號”，它是一種特殊的組，能被多個頁面重復引用，在Symbol中修改樣式，其他頁面也會同時被修改。如果熟悉Axure的同學應該比較容易理解了，對，它的功能和Axure中“母版”的功能類似，但是它的應用某種程度上比Axure的母版更方便。

（2）Symbol應該怎么用？

注意上面所說的Symbol特性：能被重復引用，能批量修改并生效到所有頁面。產品中部分元素經常會重復出現在多個頁面中，例如菜單、搜索框、登錄頭像等，我們可以提取出來將其創建為Symbol，并應用到以下兩種常見場景當中去。

場景1：交互設計需要制作多個頁面，每個頁面都要用到相同的控件，例如相同的菜單。

傳統處理方式：復制粘貼，效率低

Symbol用法：用Symbol代替復制粘貼，先創建好Symbol，再在每個頁面復用Symbol。

場景2：頁面某個控件樣式有變化，涉及多個頁面的改動，例如菜單底色變化。

傳統處理方式：每個頁面修改一遍，改到吐血。（真實項目經歷：由于一個菜單變化，使用PS的視覺設計師把所有手上100多個頁面全部調整一遍）

Symbol用法：在Symbol中進行修改，所有頁面同步生效。想象一下，如果Axure沒有母版功能，效率值下降多少？

場景3：提供一份最新的完整的視覺設計規范

傳統處理方式：先制作頁面后，再從頁面中提取規范內容，形成規范文檔，如果頁面有了新的規范，則需要更新到設計規范中去，最后的結果往往是更新不及時。

Symbol用法：Symbol庫本身就是一份設計規范文檔，維護Symbol=維護規范文檔，還能同步更新所有頁面。

3.Symbol基礎教程

以一個資料卡為例，具體介紹在Sketch怎么創建、維護、應用Symbol，體驗Symbol的強大功能。

（1）創建一個Symbol

我們首先以最小單位來創建一個Symbol，例如頭像，先在畫布上畫好頭像，然后右鍵點擊頭像，選擇Create Symbol，在彈出的框中輸入Symbol的名稱即可。

需要注意的是：Symbol的名稱輸入有講究，盡量使用英文名稱，如果你在符號名中加入了斜杠 “ / ”，Sketch 會將它視為組的分隔標志，分組能方便地復用Symbol（后面詳述），且符號始終會按照字母順序排列，而不是創建時間，方便維護Symbol。

為了方便講解，第一個Symbol的命名為“頭像/Q版頭像”，分在“頭像”組，其他Symbol的創建同理。創建完成后，得到下圖所示的基礎Symbol庫，其中各Symbol的命名規范如下：

• 頭像組：頭像/Q版頭像；頭像/美女頭像
• 文字：文字/黑色；文字/藍色；文字/灰色
• 背景：背景/Q版背景；背景/美女版背景

（2）復用一個Symbol

如圖所示，把創建好的Symbol組合成一個資料卡，就完成了Symbol的復用，使用相同的方式，可以在多個頁面復用。

有讀者看到這里估計已經忍不住了：這有個卵用，跟復制粘貼還不是一個鳥樣，別急，見證奇跡的時刻馬上到了。如果要將Q版資料卡變為美女版資料卡，還用上面的方式組合一遍？如果只替換頭像/背景呢？這個時候，我們要用到上述所提及的Symbol分組了。

右鍵選中頭像后，依次選中“Replace With”→“頭像”→“美女頭像”即可，從下圖也可以看出，利用“/”規范命名后，Symbol自動分好組了，更方便進行復用替換操作。

（3）維護Symbol

在頁面雙擊任意Symbol，或者點擊pages下方的Symbols，可以進入Symbols頁面，在里面對Symbol進行更改即可，所有更改會生效在復用的頁面用。

4.Symbol嵌套教程

隨著 Sketch 39 41 兩次重大的版本更新，Symbol新增嵌套功能，變得更加強大了，還是用上述的資料卡例子，來看看怎么實現資料卡的整體替換，局部替換。

（1）制作嵌套Symbol

把制作好的資料卡進行組合選?。℅roup Slection），里面包括多個Symbol，如圖所示。

組合完成后，針對資料卡Group，生成一個Symbol，命名為資料卡/Q版，資料卡美女版本同理。

（2）復用嵌套Symbol

嵌套Symbol有兩種復用方式，第一種同單個Symbol的方式，直接替換整塊資料卡即可。

第二種方式才是嵌套Symbol復用的核心，如圖所示，選中一個嵌套Symbol后，軟件右側出現了Overrides，里面包括多個下拉選項，這些選項實際上是由單個Symbol組成，可以通過下拉選項切換為其他單個Symbol。

如圖所示，在右側切換頭像后，嵌套Symbol資料卡的頭像已經更換了單個Symbol。

（3）個性化文本

這里還有另外一個功能，如果Symbol屬于文本類，那么可以在右側相應文本的地方替換為自己輸入的文字即可，可以滿足同一個菜單樣式，不同菜單名稱的情況。

5.Symbol使用小tips

• 同一組的Symbol尺寸應保持一致，如果尺寸不一致，替換后樣式會出現問題
• 在畫步上畫任意形狀圖形（矩形或者其他），都可以直接替換為Symbol，并且沿用Symbol的樣式
• 和視覺設計師合作維護Symbol，項目效果更佳

本文由@夜雨 原創發布于人人都是產品經理，未經許可，禁止轉載。