PS虐我千百遍，我待Sketch如初恋–写在Photoshop CC 2015发布后

如果要问大家，这些日子哪件事在设计圈里最火，那你会想到什么？是各种让人炫目的动效设计，还是一个能说会道的“奇才”逆袭腾讯的故事？不不不，都不是，他们比起这个来，简直是小巫见大巫。

6月中旬，设计软件界的大拿Adobe发布了最新款的设计套件Creative Cloud 2015。这样的重磅炸弹无疑让每个还在辛苦P图的设计师犹如经历一场狂欢。所以这就是狂欢的原因？当然不是。Adobe的当家花旦Photoshop已然成为大家讨论的焦点。在加入了多画板支持，图层导出及设计空间等等的新功能后，使用Photoshop设计界面的设计师们终于看到了希望，一时间“Sketch去死吧”，“不支持windows还搞个毛线”，“PS绞杀sketch”这样的言论如洪水般遍布社交网络与各大设计网站的文章与评论区中。那么对于作为一直在使用Sketch做界面设计的静电来说，Photoshop推出这样的新功能，到底对于我以及和我一样使用Sketch作为主要工具的设计师有什么影响呢？也许有，也许没有。但是本着眼见为实的原则，静电第一时间下载了Photoshop及其它Creative Cloud 2015套件中的软件，进行了粗略的试用，看看Photoshop到底为这些喜爱PS操作流的设计师来说，究竟带来了什么？

一.Sketch与Photoshop两种图层选择方式操作流的区别

在本文开始之前，静电先描述一下在设计软件中存在的两种操作流派。第一类，是以Photoshop为代表的图层操作流。第二类，是以Fireworks，Illustrator，Sketch等软件为主的所选即所得的操作流。大家知道，前者的操作过程中，图层操作在设计过程中所占比例极大，也就是说，当你需要选择一个图层的时候，需要首先转到图层面板，在图层列表中选择你要处理的图层，然后再对这个图形进行相关的操作。鼠标在画布元素上移动的时候，并不进行图层悬停提示框选的操作，当然Photoshop也为使用者加入了点击即可选择相应图层的操作，但是图层外框并不进行提示（即所谓的蓝色选取框的显示）。在第二类软件，也就是Fireworks，Illustrator及Sketch这样的软件中，鼠标悬停在某个元素上，此元素外围即出现蓝色选取框，再次点击即可选中此图层。如下图，左侧为Photoshop类操作流，右边为Sketch，Fireworks及Illustrator图层操作效果。

对于两种操作流的利弊，静电认为各有各的好，但从Fireworks时代转过来的我来说，这种所指即所得的图层选择模式，可能是我使用后者这些软件的最主要的原因之一。毕竟，在这个效率为王的时代，频繁操作图层对于设计师来说可能很大程度上是一种负担，特别是对于移动端界面设计师而言，这样的方式无疑效率更高，也更容易上手。如果photoshop想要在这方面赶超sketch或者同类型的软件，它对于图层的操作和选择方式，也许应该成为一个首先要考虑的因素。对于后者的操作方式而已，在很大程度上，我们甚至不会过多的将注意点放在如何操作图层上边，这个可以最大限度的避免设计师在设计流程中的分心，从而更专注于设计本身。我们只需要在需要的时候点击图层进行操作，而不是每个步骤中都要点击选中图层，这节省了用户大量的选择和查找时间。对于此种模式，Mac中的Keynote软件同样可以参考，不同的是，Keynote在鼠标未选中时并不会出现提示框，但是在选择后会对选择图形进行标识。相关的操作流如今被越来越多的软件所采用，除了上文提到的使用此种选择交互方式的软件，我们也可以在诸如Axure，以及xmind等等的工作软件中找到它的影子。下图为此种交互方式的动画展示效果。从所指即所得的逻辑来说，此种方式更符合用户的预期，也可以大幅提升设计效率（对于UI界面设计来说），是未来图层选择模式的更优方案。

二.画板（Artboard）诚可贵，逻辑价更高

为了尽快赶上Sketch的脚步，Photoshop CC 2015中新加入了画板（也叫做艺术板）设计模式。对于画板的溯源，可能追究起来，要算是Illustrator的原创。相比较Sketch的画板，adobe的产品经理可是为了artboard操碎了心。这个功能的加入更被PS的粉丝们称之为逆袭Sketch之举，可是这个画板究竟怎么样呢？我们来对比一下Photoshop CC 2015和Sketch中的画板。
大家知道，一般的绘图软件，在新建文件时会提示我们输入画布的大小，分辨率及颜色模式等等参数。这也是photoshop等adobe系软件的常规操作，但加入画板后，Photoshop如何处理画板（Artboard），画布，图层分组这些层级的逻辑呢？首先我们在Photoshop CC 2015中新建一个文件，输入画布尺寸。静电在这里新建一个800-600的画布。

接着，静电费尽千辛万苦，终于找到了如何在这其中添加艺术板–添加艺术板的按钮是藏的非常深的-他在选择指针的二级菜单中。那么接下来，选择画板工具，看看会有什么情况发生吧。拖拽了一个画板后，画布消失了（如下图所示）。这个时候整个工作区变为灰色，我们刚才建立的画布就没了,取而代之的是一片灰色区域。原来如此，Adobe硬生生的添加了一个画板模式进来，同时右侧图层列表中新加了一个名为画板的类似于组的图层，此时的灰色区域，可以理解为工作区，这个区域是可以无限延展的，跟之前新建立的画布尺寸似乎没有任何关系。

研究了很久，问题来了，艺术板和画布的关系到底是什么呢？难道我们不是在画布上增加的艺术板，而是adobe把我们带进了一个无比奇妙的区域？这个区域可以理解为绘图板模式？这几个元素的逻辑，或者叫做包含关系，到底是什么样的呢？不知道，也许只有Adobe家的产品经理能说明白吧。

　　对照自家软件AI的处理方式,artboard只能被放置在画布上,当画布区域不够大的时候,需要将画布尺寸设定为更大,才能承载更多的artboard。

对于photoshop这种处理画布和artboard的模式，有些许生硬，并且一个致命问题是，一旦我们建立的画板非常多，比如有十几二十个的时候，整个文件体积将变的非常巨大，系统反应变卡也就是显而易见的事情了。

接着看看Sketch对画布的处理方式。在Sketch中，软件默认是没有画布这个概念的，工作区域是无限大的，这是艺术板模式的基础 。当然，最差的情况，我们可以在画布上摆放画板，但sketch显然没有这么做，因为有了画板的存在，我们的工作区域就变成无限伸展状态了。因此，sketch中的逻辑更为简单直接容易理解，工作区>画板>文件夹>图层，或者工作区>文件夹>图层（未建立画板或者图层位于画板外的情况）。所以sketch可以在画板外做你任何想做或者画你任何想画的图形，同样它会被显示在界面中。但是对于操作流不同的photoshop，当我们要在画板外放置某些元素的时候，必须回到图层面板，操作图层从属关系将它拖动到画板之外，如果从属关系不改变，属于画板图层内的图层在画板外将不显示。sketch则比较讨巧，如果将从属于画板中的元素拖动到图层外后，它们的图层从属关系也会发生变化。

对于Photoshop来说，我认为加入画板的功能固然值得大家兴奋一阵子，但是在加入这个功能时，请先将图层的逻辑关系搞清楚，然后再做处理会更好。否则这么简单粗暴的方式，只能让原本清晰的图层从属关系变的无比混乱。

三.画板（Artboard）向下兼容成为奢望

画板功能作为Photoshop创新的第一步，牵一发而动全身。在未搞清楚画板与图层从属关系的逻辑的情况下，匆忙作出改变，其后果必然是画板功能无法兼容老版本的Photoshop。当我们使用具备画板功能的Photoshop在画板模式下完成设计后，对不起，其他人的电脑必须也同样安装此版本的软件，否则画板兼容就会成为问题。如下图所示，在Photoshop CC 2014中打开2015版本创建的具有画板的文件时，情况是这样的。看起来很好，是的，因为图层被合并了，要想不合并图层打开，抱歉，你的设计稿可能并不是那么的漂亮了，如果人品不好，你可能只会得到一张大白板画布。在此时，画板被作为图层文件夹存在其中，同时在最初我们新建立的画布尺寸好像不怎么起效了，adobe你这么任性好么。

四.减肥勿伤身，你真的需要矫枉过正的“设计空间”吗？

对于越来越臃肿庞大的photoshop而言，当CC 2015推出这个“设计空间”功能的时候，外界的反馈一致的好，终于变得轻盈了，终于从简了，终于瘦身了。可是，想要瘦身必须付出巨大的勇气。来看看这个新的设计空间，adobe为我们提供了什么？首先你必须要保证自己的Mac OS X 为10.10及以上，windows版本为8.1 64位及以上，才有机会目睹设计空间的芳容。那些还用着xp或者旧版本mac系统的同学们，或者没有安装64位系统的朋友们可能无缘设计空间了。什么？不是说好的要瘦身吗?为什么系统要求却变得如此变态？好吧，鬼知道为什么。总之你可能是无法使用的就是了。好在我们看到那个括号里的“预览”二字，代表这还是一个beta版本。

我们打开被成为激动人心的设计空间功能吧，勾选上对勾。界面duang的一下就变的简洁了，左侧工具图标列表消失，并被右侧中部的仅有的五个图标代替，他们分别是箭头工具，矩形和圆形工具，路径工具及文字工具。右侧是属性检查器，下方是图层列表。adobe将设计模式简化到了极致，但这真的是我们想要的吗？通过试用，静电发现这个设计空间实在是太过简陋，该有的功能一概没有，比如最常用的图层属性消失了，选曲工具也消失了。但有一点值得鼓励的是，在这个模式下，本文开头提到的图层选取功能居然做了改变，这一点难道是adobe也意识到了吗？希望如此。

对于设计模式来说，photoshop的初衷是好的，静电推测adobe也付出了很大的勇气来做改变。但是photoshop到底是怎样一款软件，这样的模式附加在这个巨无霸上，总感觉有点不伦不类的感觉。毕竟船大难掉头，我们静观adobe的改变吧。在这里静电提到一个词是“矫枉过正”，因为现在这个“设计空间”，不具备太多的可用性，仅仅是让我们预览一下效果而已。从另外一个层面上来说，我认为adobe本身应该区分清楚软件的使用人群，对于不同的人群，推出不同功能的软件，而不是在一个软件的基础上兼顾所有人的需求，毕竟这个实在太难太难。静电在这里又一次回想起被adobe收购的Macromedia公司，特别是fireworks这款软件，也许是后妈不亲，也许是其他原因，fireworks这款兼具移动设计功能同时又具备轻巧矢量功能的软件就这么停止更新了，CS6作为最后一版一直装在静电的电脑中。那么最终photoshop又要走回fireworks最初所擅长的东西吗？不管设计空间也好，还是什么空间也好，我们基于photoshop的期望已经足够的沉重，难道不应该为她卸下一个个包袱，让她轻装前进吗？也许，这只是静电的一个妄想吧。

下图为Sketch软件的界面，简单切容易上手，这才是真正意义上的“design space”。

五.切图与标注，问题或者不是问题

标注和切图一直是移动端设计最难解决的问题，面对种类繁多，分辨率各异的移动设备。photoshop一直没有一个很好的解决方案，也许各种第三方插件已经为phptoshop使用者提供了不少的便利，但基于位图编辑的与操作的photoshop仍然未能为移动设备素材的输出带来多少便利。Photoshop CC 2015在新版本中增加了快捷的图层导出选项，多选图层则可以一次导出选择的图层，这在某种意义上不失为一种进步。但如果要适应更快速便捷的素材输出，photoshop做的显然还不够。标注也是设计师面临的老大难问题，所以你需要的是markman还是？

Sketch这款为移动端界面而生的软件，则对于此作出了最大限度的便利，我们可以一次导出多个所选择的图层，方式包括但不限于切片导出，拖拽图层导出或者直接选中图层进行导出，同时导出时可以方面的设置导出图形的缩放比例及后缀（如@2x，@3x等等），同时输出格式也更为多样，从常用的png，到pdf以及svg格式。而photoshop仅仅为我们提供了位图及svg一种矢量格式。下图为sketch的操作界面。

在标注方面，通过配合sketch的measure插件（开发者为国内的大神Utom，其插件开源免费，为sketch上下载最多的插件之一）以及zeplin，可以轻松完成标注，甚至你可以无需标注，前端工程师使用zeplin即可轻松查看各个元素的属性，无需安装sketch即可。下图为zeplin操作动画。

六.使用Photoshop组件库下载素材？请您付费成为正版用户

看了激动人心的宣传片，想使用adobe stock获取各种ui素材？不好意思你必须付费成为正版使用者。因为Photoshop提供的组件库是云端的。别光记得激动人心，喂，没付费你啥也没有。

相比于这个价格，精明的设计师同学请去算一笔账吧，是购买99美刀终身使用的sketch划算呢，还是来一个每月79美刀的超豪华午餐合适？sketch已经内置并会随版本更新最新的UI设计模型库。

七.Adobe Preview CC登场，但必须用美国区AppStore账号下载

千呼万唤，adobe终于推出了自家的移动端预览软件-Adobe Preview CC，支持wifi甚至usb链接，小伙伴们再也不用为手机预览总是断线发愁啦。当静电兴奋的点开链接，拿出手机准备下载的时候。你这时候一定会问为什么中国区没有？想当年Adobe含恨退出中国市场的时候，你应该可以预料到这一天。好了好了，快去折腾一下，准备好美国区AppStore账号吧。

其实预览软件wifi连接不稳定的问题，Skala preview已经率先解决，支持usb连接下的预览，更重要的是 Skala preview完美支持sketch，妈妈再也不用担心我预览掉线啦！

后记：大块头虽有大智慧，灵巧专注更是未来方向

Photoshop发展到今天，经历过无数风风雨雨，已经成为设计师心目中不可亵渎的神圣象征。但不可否认，她正变得越来越臃肿和庞大，对系统配置的要求几近变态。作为从网页三剑客一路走来的设计师，静电更希望photoshop及adobe家的其它软件能更为专注和好用，Photoshop就是photoshop，专注位图处理；Illustrator就是illustrator，专注矢量绘图；Sketch也就是Sketch，将移动端界面设计做到极致。在图像处理领域，PS是不可或缺的大块头，但在这个变化越来越快的时代，各种轻盈灵巧的软件俘获了越来越多设计师的芳心，也为他们带来了效率的巨大提升，让他们更专注于设计本身而不是软件操作技巧，不同的目的使用不同的软件，多个软件综合使用，最终创造出优秀的作品是设计师的最终目的。大而全固然值得崇拜，但小而美的Sketch，hype等越来越多的设计软件却让这个世界变得异彩纷呈。抛开自身的偏好，静电希望Photoshop和专注于移动界面设计的sketch都能走的越来越好，我们无法抗拒资本运作对于软件设计团队的影响，但曾经的那些美好的点滴，至少会在我们心中存留，因为这个世界本来就不只有一种选择。

本文无意讨论Photoshop与Sketch软件优劣，仅仅指出各自问题与作者遇到的疑惑。“吊打sketch”，“秒杀sketch”等等言论更是可以休矣，多大仇多大恨才会说出如此狠话？最近Photoshop固然是主角，但狂欢过后，作为设计师的我们需要更理性的思考。看了这篇文章，有人一定会说：“认真你就输了”。其实我想说，认真与专注才不会输，因为认真和专注成就了今天的sketch以及adobe，这些驻留到我们电脑硬盘和桌面上的美丽应用。

最后，你究竟是在为免费且毫无代价的使用而欢呼，还是发自内心的，为那些付出巨大努力而开发出来的，令人激动人心的功能喝彩？