工程師與設計師的橋梁 - zeplin

zeplin 介紹

今天給大家介紹一款軟體—Zeplin，它是集標註、切圖、雲存儲、Guideline和生成前端代碼於一體的協作軟體。作者在團隊中已經使用了一段時間，親測好用，軟體的主要功能是標註，引入團隊後設計師再也不用標註，前端工程師看標註的效率也提高，一舉兩得。

Zeplin: zeplin.io

Zeplin出現之前，在早期PS時代都是用馬克曼給介面標註，sketch出現之後，有類似measure這樣的插件可以實現自動標註，但使用上還是很繁瑣，得到的產出物也並不方便工程師使用。

我們標註的稿子大部分都是如上圖所示，標註和效果圖合在一起，標註會遮擋內容，並不利於瀏覽。一般要出兩套圖，一套標註，一套效果圖。

在使用馬克曼標註時，很多設計師無法確定哪些信息需要標註，大多的處理方法是把所有間距元素都標註上，但其實有些信息是不必要的，這樣反而不利於工程師瀏覽。

其次，當項目的頁面很多時，標註會占用一部分時間，開發做好介面，進行視覺驗收的時候，還要截圖再標明視覺錯位的地方，如果是安卓有多個尺寸，還要出多個標註稿。對於疊代比較快的團隊來說，標註是一件耗時耗力的事情。

Zeplin的出現就是為了解決以上溝通錯位的問題，設計師不用再為標註勞心，工程師看設計稿的效率也提高了，一舉兩得。

Zeplin支持sketch和PS文件導入，安裝好後會自動把插件裝上，插件的作用是把設計稿導入到Zeplin。

首次登錄，會提示你創建一個項目，免費版的用戶可以創建一個項目，企業用戶100美元/月可以無限創建。

創建完成後，可以邀請團隊成員進來，把團隊成員設置為管理員，每一個成員都可以邀請其他成員進來。

-----

實際使用展示

記得開檔案時要選擇新增"工作區域" 如下圖

工作區域有很多種預設規格可供選擇 (當然也可以自訂)

可以匯出的狀態 畫面是這樣~

可以按黃色按鈕匯出

文章節錄自：再見！設計稿標註！ https://read01.com/zh-tw/zg2PBD.html#.WboV9bIjGUl