1. 新建文件
快捷键Ctrl+n
分辨率72像素/英寸,颜色RGB,背景内容为透明,可存储预设
2.查找图层
打开PSD图片,点击左上角的‘组‘选项,切换成‘图层‘;
按Ctrl+左键点击选中图片中你需要的位置,就会在右边的窗口图层里面快速定位出相对应的图层位置;
按Ctrl+左键点击选中当前图层,你会在图片看到上对应的元素被虚线包裹着
3. 定制窗口
-
点击菜单栏中‘视图‘,勾选‘标尺‘和‘显示‘里面的‘智能参考线‘
-
点击菜单栏中‘窗口‘,只需勾选‘信息‘,‘历史记录‘,‘图层‘,‘字符‘,其他多余的可以取消掉,避免占用浪费右边窗口的资源
-
在‘信息‘面板里面的‘面板选项‘,将第一颜色和第二颜色改成‘RBG颜色‘,鼠标坐标的单位尺寸改成‘像素‘,状态信息栏勾上‘文档尺寸‘
-
点击菜单栏中‘编辑‘,选中‘首选项‘里面的‘单位与标尺‘,将标尺与文字都改成‘像素‘;
-
建议:当我们完成上述操作,点击菜单栏中‘窗口‘,选中‘工作区‘里面的‘新建工作区‘,进行存储当前的模板;以便日后使用;
4. 对齐
‘移动工具‘快捷键: v
按住Ctrl键选中两个或多个图层,在‘移动工具‘的功能栏中有左对齐.右对齐.居中对齐等对齐方式;
5. 选取工具
快捷键 : m
按住shift+m键,可以快速切换选取工具
按住shift键,矩形会变成正方形,椭圆会变成正圆形;功能栏有两个选区的加法,减法,乘法;按住shift键是增加选取，alt键是减去选区
按住Alt+shift键,以当前鼠标点为圆心,进行画圆
6. 常规快捷键
图片缩小和放大 : 按键Ctrl+加号或者减号
移动图片: 按住空格变成小手,就可以拖动图片
删除选区 : Ctrl + D
印盖图层 Ctrl + shift + Alt + E
套索工具按住shift加大选区,按住Alt减少选区
后退(撤销) : Ctrl + Alt + Z
前进 : Ctrl + shift + Z
快速填充前景色 : Alt + delete
快速填充背景色 : Ctrl + delete
参考线的水平和垂直切换 : Alt
图片位置快速选定 按住‘h‘变成小手,移动的时候有个方框,松手就会放大显示当前框框的内容
参考线: Alt + V +E
按住Alt键你会看到菜单栏字母有个下划线,就可以进行操作
隐藏/打开 参考线: Ctrl + ;
7. 快速选择工具
将颜色相似的区域快速选取出来,由于快速生成闭合区域,可以使用Alt减去部分区域
8. 套索工具
当套索区域完成闭合后,在区域内右键点击‘填充‘,里面的‘内容‘为‘内容识别‘,区域会自动取消
9. 截取工具
快捷键: C
截取你需要的区域,然后在右边的图层中对修改的图层旁边的小眼睛,按住Alt+左键单击,小眼睛就只会显示当前图层
然后按Ctrl+shift+S,即可将当前图层保存并导出
小技巧: 比如要导出文字,选按Ctrl+单击左键选中图层,会出现虚线包围当前图层,然后按C进行截取,按enter确定后,对当前图层
? 小眼睛按Alt+单击左键,背景会去掉,然后按Ctrl+shift+S保存导出png图片
10. 污点修复画笔工具
快捷键: J
污点修复画笔：周围取素材再融合，选中的区域内有类黑色自动认为是污点，自动去除修复画笔：需要找一个圆心(alt+左键)，放开alt,可以绘制出当前"+"里的内容
11. 历史记录画笔
以去除面部斑点为例:
点击菜单栏中‘滤镜‘,选中‘模糊‘里面的‘高斯模糊‘,大概设置4像素,生成新的效果;
? 查看右边窗口面板的历史记录,在当前模糊的图层左边有个小笔,这就是我们要的历史记录画笔
? 选回之前的图层,点击历史记录画笔,就能生成模糊祛斑的画笔
12. 涂抹工具
可以把眼睫毛画长
13.减淡工具
皮肤变白
14.图层的层级
最上层层级最高,最底层为背景
15.参考线
选中当前图层,当拖住参考线靠近图层时,会自动吸附上去
16.快速精准切图
菜单栏下‘文件‘,选项中的‘脚本‘里面的‘将图层导出到文件‘,选择文件类型‘png-24‘,里面的选项都勾上
透明区域，交错，裁剪图层勾选 注意：比如说要做一个gif动画，如果是ps导出，半透明效果出不来，我们用ps导出一个一个png序列帧，由于命名是很顺的，我们可以在脚本 当中引入堆栈，那是非常炫的一个功能 1、有阴影会保留下来。 2、命名刚好是图层的名字，如果做网页设计把每个图层命名使用网页中合法的命名，就可以不需要导出后再调整名称。
17.自动切图
1.编辑——首选项—— 增效工具——勾上 启用生成器 2.文件--生成--图像资源 3.直接通过向图层或文件夹添加或删除后缀名 .png / .jpg / .svg ，自动导出或删除图片，此方法可替代手工切图 4.200%xx @2x.jpg 5.保存到svg，可获取前端代码。
18. 抽出资源
cc2014版本开始的导出svg的办法
菜单栏‘文件‘,下的‘抽出资源‘,抽出你需要的图层和格式
19 . 复制css
介绍用Photoshop CC自动生成css的办法
菜单栏‘图层‘,选项里的‘复制css‘
注意一点,外部的文件(智能对象)是不能复制,在编译器粘贴即可获得样式
20. 前端开发学习切图推荐
本文由以下视频网址学习得到的小知识:https://www.imooc.com/video/9812
个人建议看第二,五,六章的视频讲解;
