25學(xué)堂一無既往的給APP設(shè)計(jì)師和app程序員推薦一些高效率的APP設(shè)計(jì)工具或者是插件。

今天跟大家分享的是與Sketch搭配設(shè)計(jì)APP的最佳標(biāo)注插件—Zeplin。

Zeplin是解決產(chǎn)品設(shè)計(jì)中的最重要一環(huán)：標(biāo)注，協(xié)作，切圖。

Build pixel perfect apps in peace

Design hand-off has never been easier. Generate styleguides and resources, automatically.

與Sketch搭配設(shè)計(jì)APP的最佳標(biāo)注插件—Zeplin的官網(wǎng)免費(fèi)下載：

https://zeplin.io/? ?有興趣的小伙伴可以去嘗試下。

下面是25學(xué)堂為什么要推薦這款與Sketch搭配設(shè)計(jì)APP的最佳標(biāo)注插件—Zeplin

一份完美的優(yōu)秀的APP設(shè)計(jì)稿，如果沒有一份合適的標(biāo)注圖，肯定不是完美的，而且產(chǎn)生的APP設(shè)計(jì)視覺偏差也會(huì)大不一樣的。

之前或者現(xiàn)在，很多sketch app設(shè)計(jì)師還是在用馬克曼進(jìn)行標(biāo)注的，也就是直接在輸出效果圖上量尺寸。這樣的標(biāo)注有個(gè)缺點(diǎn)：

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

Zeplin 面向的用戶是設(shè)計(jì)師和前端（Web、Mobile）工程師，相當(dāng)于做的是中間橋梁這一塊，核心功能為標(biāo)注、Style Guide、備注文檔與簡(jiǎn)單的團(tuán)隊(duì)協(xié)作。

25學(xué)堂的小編在接觸Zeplin的時(shí)候，內(nèi)心是無比激動(dòng)的。終于找到了一款這樣的應(yīng)用，絕對(duì)是對(duì)設(shè)計(jì)師程序員之間架起一座橋梁。

之前做UI用的ps和AI，換上mac之后接觸sketch，確實(shí)，方便快捷了很多，知道發(fā)現(xiàn)Zeplin之后，兩者搭配，絕了。

之前給APP設(shè)計(jì)稿做標(biāo)注或者切圖挺頭疼，尤其標(biāo)注，總擔(dān)心標(biāo)注漏了什么，程序員又在問來問去。而在https://zeplin.io/中，最主要的就是解決了這些問題。以后再也不用擔(dān)心被程序員問來問去了。

最重要的，在zeplin當(dāng)中，標(biāo)注和設(shè)計(jì)稿可以共存一套，也不需要給2套。而且也不會(huì)因?yàn)闃?biāo)注擋住原來的設(shè)計(jì)稿的整體視覺效果。

使用zeplin來進(jìn)行app界面設(shè)計(jì)標(biāo)注的時(shí)候，默認(rèn)的時(shí)候是你設(shè)計(jì)好的視覺設(shè)計(jì)稿。

當(dāng)你鼠標(biāo)移上去的時(shí)候，就會(huì)出現(xiàn)標(biāo)注的所有信息，包括尺寸、顏色、字體等等。

如下圖：

如果你不知道怎么使用，可以看下站酷上 這樣的一篇文章：

Sketch 之優(yōu)秀插件Zeplin講解 ?或者 ? ?查看大圖教程

http://www.zcool.com.cn/article/ZMTY5NTY4.html