V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Keinez
V2EX  ›  分享发现

介绍一些设计师/前端设计需要的 Spec 工具

  •  3
     
  •   Keinez · 2015-01-17 07:57:26 +08:00 · 4644 次点击
    这是一个创建于 3594 天前的主题,其中的信息可能已经有所发展或是发生改变。

    起因是看到了一个插件叫做 Markly,看起来是个很不错的 Spec(设计稿中的尺寸距离描边等)工具,支持实时更新 Spec,支持 Photoshop 和 Skecth,要价 $39.99。

    看起来很强大,嗯?

    翻了一下设计师们的评论,结果一边倒的在推荐 Zeplin

    查了一下,Zeplin 是个目前只支持 Sketch 的 App,不过比 Markly 要便利的多,目前在进行 Beta 测试。遗憾的是不仅歧视 Photoshop,还顺带歧视了 Windows 一把……

    接着有人提到 Adobe Extract。打开看了一下,算是 Photoshop / Windows 上的一个替代解决方案,但坏处是它并非完全为 Web 设计而生,这玩意会把所有属性全都以 CSS3 的形式读出来……适合比较懒的设计师和前端们。

    最后我自己装的是 Ink。相比 Markly 的优势是能够添加 Documentation,坏处是这玩意基于 js,受限于 Adobe 屎一样的 js 性能,遍历一个含有大量图层的文件感觉会非常坑爹。而且我们的前端都会用 Photoshop,所以一般直接 PSD 扔过去就完事了,不需要 Spec ……

    其他插件有 Specctr,和 Ink 大同小异,多了个量图层间距的功能——这已经被新版 Photoshop CC 的 Ctrl 键爆出屎了。不过还提供 Illustrator 、Indesign 和 Fireworks 版本,打包 $99,如果你还在用这些东西的话可以试试。

    以及 specKing。这玩意的网站太丑了,让我简直不敢相信这是一个设计师工具……要价 $19,确实一分钱一分货。

    10 条回复    2015-01-17 19:13:54 +08:00
    Neo
        1
    Neo  
       2015-01-17 08:15:19 +08:00 via Android
    有空试试,谢谢推荐
    sc
        2
    sc  
       2015-01-17 08:15:56 +08:00
    这几个都看了下,作为码农,我觉得Zeplin不错 :D
    Keinez
        3
    Keinez  
    OP
       2015-01-17 08:18:05 +08:00
    @sc 万一设计师丢给你 PSD 的时候,你还得需要弄一个 Photoshop CC 2014 ……
    sc
        4
    sc  
       2015-01-17 08:29:13 +08:00
    @Keinez 我觉得设计师把生成的Spec图(就是那些弹簧啊、数字标注啊什么的)直接输出类似PNG格式的图不就好了?(我不是前端工程师、不是很了解这个作业流程
    Keinez
        5
    Keinez  
    OP
       2015-01-17 08:32:15 +08:00
    @sc 好是好,但是这其实是个体力劳动的过程,而且:

    - 对于追求细节的设计师你得搞清楚所有的边距,差5个px,效果差天远。

    - Spec 对 Responsive Design 无效。

    - 改需求的时候会死人的。

    所以一般使用自动化工具标注或者直接把 PSD 扔给前端来解决这个问题。
    sc
        6
    sc  
       2015-01-17 08:39:07 +08:00
    @Keinez 干脆你们学点代码、把前端工程师的工作也做了吧 :D
    Keinez
        7
    Keinez  
    OP
       2015-01-17 08:40:39 +08:00
    @sc 如果真的没有前端的话,我确实可以撸东西出来……就是可维护性和js质量不敢恭维就是了。
    bladecamper
        8
    bladecamper  
       2015-01-17 09:23:35 +08:00
    @Keinez 前端怎么可能不装ps
    angelself
        9
    angelself  
       2015-01-17 11:13:23 +08:00
    推荐Ink,但前端不需要标注成那样。就算了。
    其他方便标注的还有pxcook和markman,都不是ps插件
    有个好用的ps动作是sizeman,框选按快捷键即可出标注。
    old9
        10
    old9  
       2015-01-17 19:13:54 +08:00
    没人提马克鳗哇
    http://www.getmarkman.com/
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1393 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 17:36 · PVG 01:36 · LAX 09:36 · JFK 12:36
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.