Zeplin for mac

Zeplin for mac是一款為設(shè)計師和工程師提供產(chǎn)品原稿交接與溝通的高效平臺，用戶可對產(chǎn)品進(jìn)行標(biāo)注、Style Guide 注釋，還提供了簡單的團(tuán)隊協(xié)同工作功能，通過插件，設(shè)計師可將Sketch的Artboard單獨或批量導(dǎo)入Zeplin的Project里供開發(fā)者做業(yè)務(wù)功能與前端交互的實現(xiàn)。

軟件介紹：

Zeplin面向的用戶是設(shè)計師和前端（Web、Mobile）工程師，相當(dāng)于做的是中間橋梁這一塊，核心功能為標(biāo)注、Style Guide、備注文檔與簡單的團(tuán)隊協(xié)作。這塊軟件由四名在伊斯坦布爾的開發(fā)者制作，目前僅支持 Sketch，但是 PS 也已經(jīng)出現(xiàn)在官網(wǎng)，應(yīng)該也快了。

在使用 Zeplin 之前，最早是使用馬克曼進(jìn)行標(biāo)注的，也就是直接在輸出效果圖上量尺寸；使用 Sketch 插件 Measure 之后，可以在畫板中生成尺寸標(biāo)注信息，導(dǎo)出標(biāo)注圖提供給開發(fā)同學(xué)使用。無論是馬克曼還是 Measure，最后的交付物是一致的，大概如下圖所示：

這樣的標(biāo)注圖有個問題，就是已經(jīng)破壞了原本的視覺效果圖，標(biāo)注的信息一定會對原設(shè)計稿形成遮擋，因此一般效果圖和標(biāo)注圖要分開給，開發(fā)也經(jīng)常需要在兩個圖之間切換，圖片管理不太方便。如果你的設(shè)計稿同時要適配多個尺寸，還要要輸出多份標(biāo)注圖，交付給多個開發(fā)同學(xué)。更重要的是，如果對頁面進(jìn)行了迭代修改，就需要重新標(biāo)注、重新輸出、重新交付，即開發(fā)與設(shè)計之間的聯(lián)結(jié)是斷的，每次都要人工把這個缺口接上。

另外，如果時間有允許，設(shè)計師還需要制作 Style Guide，一方面是為了方便切圖，另一方面是為后期迭代做好準(zhǔn)備。Style Guide 大概要包含的是字體信息、色彩信息、icon 樣例、常用間距等內(nèi)容，如果自己制作的話，大概類似于是這樣：

Zeplin 主要就是為了解決上述問題的，使用它之后，可以在 Sketch 中一鍵導(dǎo)入 Artboard，在設(shè)計師做好圖層管理（命名、分組）的前提下，它可以自動生成標(biāo)注信息（并且可以標(biāo)注為 pt 或 dp），允許添加注釋形成類 prd 文檔，并且自動提取 Style Guide，同時還允許添加項目組成員，提供給團(tuán)隊組查看項目。

這是項目組管理界面，還有關(guān)于項目的簡單統(tǒng)計，比如多少頁屏幕、多少色彩和多少注釋等。

Guideline，可以承載字體、顏色。

圖片界面，當(dāng)鼠標(biāo)不懸浮在某個元素上時，可以查看整個界面的效果圖。右側(cè)可以看到所有使用的顏色列表。當(dāng)需要查看標(biāo)注時，點擊對應(yīng)的元素即可：

這樣的話，設(shè)計師和工程師就可以無縫銜接了，團(tuán)隊的開發(fā)同學(xué)都說這個工具太牛了：）

缺點的話，目前有一些體驗上的小問題。比如圖片是存儲在境外服務(wù)器上的，，一開始就是因為被墻的原因多次登錄不上。其次是產(chǎn)品本身還是 Beta 版，處于邀請碼階段，所以肯定會有一些 bug 存在，像全屏之后右上角沒有常用的放大縮小關(guān)閉按鈕，還有 Sketch 插件一鍵導(dǎo)入快捷鍵經(jīng)常失敗等。

使用方法：

基礎(chǔ)使用介紹

Zeplin 對于專業(yè)人員來說很好上手，創(chuàng)建一個 Project，你可以看到軟件支持 Android、iOS、Web 三種工作環(huán)境，另外開發(fā)者還提供可實驗性質(zhì)的 Mac OS X 軟件開發(fā)環(huán)境。

此時到 Sketch 里找到 Menubar – Plugins 目錄，如果你安裝了 Zeplin 專為 Sketch 開發(fā)的插件，可以直接在插件目錄里選擇“Export Selected Artboards”將文件導(dǎo)入 Zeplin，這個速度很快。

標(biāo)注與Style Guide

作為項目人員，你可以隨時通過軟件和 Web 版進(jìn)入 Project 對原稿進(jìn)行標(biāo)注（添加 Note，與對方就產(chǎn)品進(jìn)行溝通），設(shè)計師可以制作 Style Guide，包括字體樣式、色彩構(gòu)成、Icon 樣例、常用間距等內(nèi)容。

高效的協(xié)同工作機(jī)制

作為一款項目組協(xié)同工作軟件，Zeplin 可以讓團(tuán)隊成員一共參與整個原稿的交流工作，項目創(chuàng)建者只需輸入其他同事的郵箱或 Zeplin 賬戶名即可發(fā)出邀請。而如果當(dāng)前工作環(huán)境不是 Mac，你也仍然能通過 Web App 參與工作。