photoshop CC 必学.docx
《photoshop CC 必学.docx》由会员分享，可在线阅读，更多相关《photoshop CC 必学.docx（31页珍藏版）》请在冰豆网上搜索。
photoshopCC必学
Photoshop是视觉设计师最强有力的武器之一，其实Photoshop也为前端开发同学带来很多惊喜。
特别是从PhotoshopCC版本开始，它变得越来越有趣。
今天笔者就其中几个新特性给大家介绍一下。
如果您也有更多新的发现，请在下方留言与大家进行讨论。
关于PhotoshopCC的好文：
《涨姿势！
PHOTOSHOPCC功能手册》
《提速秘笈：
PHOTOSHOPCC使用技巧全公开》
自动切图（含WebP、SVG格式）：
前端开发人员经常需要将很多图层切出成独立的图片。
有了自动切图功能，无需花更多时间来切图了。
只需在图层名后添加相应格式后缀（如.png），即可自动输出所需格式的图片。
∙请保持菜单“编辑->首选项->增效工具”中的“生成器”为启用状态；
∙依次点击菜单“文件->生成->图像资源”，确认该菜单项已被勾选；
试着修改某个图层命名（如iTunes.png），然后检查当前psd文件所在目录下的“文件名-assets”的目录，打开此目录，发现iTunes.png已经躺在里面了。
常用技巧：
@2x Retina图片的输出，在图层前添加200%即可，如200%logo@2x.png;
开启WebP、SVG格式的自动输出：
新建generator.json文件，内容如下：
{
"generator-assets":
{
"svg-enabled":
true,
"webp-enabled":
true
}
}
将此配置文件拷贝至：
Windows:
（Win+R后输入%USERPROFILE%）目录下，如C:
UsersxxxMacOS:
$HOME如“MacintoshHD>Users>xxx”目录下WebP输出暂只支持MacOS。
复制CSS
PhotoshopCC终于推出了“复制CSS”功能。
它能让开发人员快速获取形状的CSS代码。
其实不少设计师也很想学习CSS，有了这个功能，可以让这些爱学习的设计师熟悉CSS代码与图形的对应关系；
右击图层面板上的图层，选择“复制CSS”，或点击菜单“图层->复制CSS”；
多个图层的批量获取，请选择多个图层，执行Ctrl+G，将所选图层转为图层组。
然后在该组上右击，选择“复制CSS”，即可批量获取CSS代码。
智能对象暂不支持“复制CSS”功能，您可以栅格化该图层再来使用。
当前的版本的此功能，包含了很多冗余信息和不太友好的写法，可能不是大家真正需要的。
于是ISUX前端团队改进了这个功能，您可以下载“PhotoshopCopyCSS”来增强PhotoshopCC自带的“复制CSS”功能，提升CSS代码的真正采用率；目前的优化有：
*自动识别CSSSprite图片，获取background-position信息；
*自动识别是否图标；
*优化CSS3渐变、文字、边框、阴影等CSS代码；
*优化RGB颜色值成十六进制颜色；
*去除冗余CSS属性，如position,z-index,left,top等。
您也可以反馈更好的建议，让这个功能真正为大家所用。
图层管理
前端开发同学接手的psd文档，往往有大量图层，我们需要对其进行整理。
例如删除空白、锁定、文本等图层。
我们还可以通过图层类型、名称、效果、属性等条件进行快速定位图层。
使用此功能可以很方便定位到当前选定图层，非常适合含有大量图层的psd文档。
另外隔离图层也是个很不错的功能。
开启隔离图层功能之后，我们可以通过移动选择工具，点选画布上的内容，找出我们需要的图层将其整理成一个独立的psd文件。
WebP插件
WebP是Google为减少数据量、加速网络传输的目的而开发的图片格式。
特别适合移动端图片的传输。
大大节省带宽，目前只有GoogleChrome浏览器对其原生支持。
PhotoshopCC的MacOS版自带输出WebP功能。
Windows下您可以下载此插件来输出WebP格式。
安装后，可以在Photoshop菜单“文件->另存为”对话框中选择“WebP格式图片”。
WebPforPhotoshop v0.5b5,16December2013 Mac | Win
动作条件
PhotoshopCC新增了动作条件，可以根据不同条件执行命令或其他动作。
智能参考线/使用图层颜色
这两个功能并不是PhotoshopCC的新功能。
为什么要在这里说呢，因为它能辅助我们一秒居中对齐、一秒贴边，这个非常实用。
另外也建议设计师使用图层颜色来标出改动位置，这样前端开发同学便能快速定位图层。
原文地址：
用好PSCC，会在设计效率方面带来很大提升。
1、PhotoshopCC精彩新功能
推荐阅读这篇《最全的PHOTOSHOPCC总结》
多重形状和路径选择
使用PhotoshopCC提供的多重形状和路径选择，可以同时选取多个路径、形状和矢量蒙版，不需按多次鼠标即可完成更多任务。
即使在拥有许多路径的多图层复杂图像文件中，也可以使用新的滤镜模式，直接在画布上锁定路径（及任何图层）。
简易绘制虚线
PSCC不需要手工计算像素来进行绘制虚线，虚线绘制变成基础控件。
文字优化
旧版本的PS在使用微软雅黑字体时，无法清晰显示。
而PSCC增加了WindowsLCD的文字选项，编辑文字时选择WindowsLCD，就可在PS中获得文字外观的真实预览效果。
背景存储与自动复原
使用PSCC，能够在背景储存大型的PS档案，同时还可继续工作；也可透过全新的自动复原选项保留所做的编辑，而不会中断工作进度。
PS软件效率更高，大型文件处理更快
PSCC对代码进行了优化，软件算效率有了很大的提升。
可编辑的圆角矩形
PSCC可以生成4个不一样圆角的矩形，圆角设置更加精准。
更精细的描边
描边能精确到0.x，能做更加精致的效果。
2、简单设置PhotoshopCC
说了这么多好处，也谈谈问题。
在使用PSCC的过程中，笔者经常遇到假死、闪退、崩溃的问题。
出现这些问题的主要原因是目前大部分用户使用的都是机械硬盘，而从PSCS6开始就增加了一个后台储存的新功能，该功能的好处是定时给你的psd文件进行保存，但这个功能在设计的时候并没考虑到目前大部分用户使用的都是7200转速的机械硬盘。
我们平时做设计稿很有可能同时打开多个甚至数十个psd文件，如果当前运行的十个psd文件都同时储存，而刚好我们也在进行PS操作，那出现假死、闪退、崩溃的机率就非常大了。
所以为了使用更稳定，可以在使用PSCC前先做一下如下设置，关闭后台储存功能。
3、PhotoshopCCbug一览表和解决方法
除了关闭后台存储来降低软件崩溃的问题，这里笔者还根据工作经验，汇总了一些PSCC的常见问题。
部分问题可以解决，但仍有部分问题只能留待下个版本的更新优化。
习惯篇
阅读之前，优设哥特别向您和您所在的团队推荐《PS礼仪手册》！
网页设计师必须修炼的内功技法，更是不可或缺的WEB设计指南。
还有这篇浏览量过五万的PS技巧！
《设计师应该知道的17个PS技巧》
1、同一个项目尽量在一个psd里
在项目中统一功能块、功能尽量保存在同一个psd里，日后使用会更加方便，节约在不同psd文件里查找时间。
2、时刻保持图层命名、归类
良好的归类、图层、命名习惯，在团队合作中psd源文件可用度效率更高，日后修改也会节省时间。
3、尽量使用智能对象
智能对象好处在于合并对象后不破坏对象，同时可以让这个合并后的对象具有可编辑特性，同时具备同步更新功能。
4、在文件夹中加蒙版，操作一步到位
在文件夹加蒙版，再次修改的时候只需要把图片放入文件夹即可，可以减少重复调整蒙版等工作。
5、输出尽量简单
如果项目有命名标准建议以标准来命名，如项目没命名标准建议用简单易懂的中文命名方式命名。
6、安装psd缩略图补丁
安装PSD缩略图补丁，一目了然PSD文件的内容，提高效率拒绝猜测。
技巧篇
1、精简快捷键
如果你肯花一点点时间来练系这些快捷键，腾出你闲置的左手放到键盘上，相信这会让你的工作更加快捷高效。
2、设置隔离图层快捷键
设置隔离图层快捷键，好处在于进入了隔离图层后不会对其他图层进行误操作。
技巧：
进入隔离图层后，按Ctrl可以进行对画布中的其他图层加入此隔离图层。
3、色阶的解决办法
我们做效果图的时候经常会使用大面积渐变，时常会出现比较严重的色阶问题，通常出现这些明显色阶的时候，可以通过使用高斯模糊对色阶进行模糊化处理。
4、文本框的好处
当你需要处理一大段文字时，文本框的好处就会体现出来，它会永远保持你字体的宽度整齐展现。
5、对齐像素
平时画icon的时候会常常使用到二分一、三分一或者其他比例的线条，所以一般会对网格对齐功能进行关闭。
而做界面的时候我们要求更加精准的界面，所以通常会开启网格对齐功能。
开启与关闭网格对齐方法：
Ctrl+K勾选“将矢量工具与变化和像素网格对齐”
6、图形可以合并
PSCC图形图层集体合并后，仍然是可编辑图形。
技巧：
合并图层快捷键Ctrl+e，能把选中的图层快速合并。
说了这么多，PSCC确实是一个有助于提升UI设计效率的好软件。
当然，以上所述仅为笔者个人经验总结，如有错漏欢迎指出，愿与大家交流！
升级会员 