ps基础
【Adobe Photoshop,简称“PS”】,是由【Adobe】 开发和发行的【图像处理软件】。
Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具,可以有效地进行图片编辑工作。
ps有很多功能,在图像、图形、文字、视频、出版等各方面都有涉及。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mAPHY9Zm-1605793424951)(…/AppData/Roaming/Typora/typora-user-images/image-20201116135340523.png)]
菜单栏
文件
- ctrl+n 新建
- ctrl+o打开
- ctrl+w关闭 ctrl+alt+w关闭全部
- ctrl+s保存 ctrl+shift+s另存
- ctrl+alt+shift+s另存为web所用格式
编缉
首选项——单位与标尺 —— 像素
填充——内容识别
图像
图像大小 ctrl+alt+i
画布大小 ctrl+alt+c
裁切
裁剪
文字
字符面板(段落面板)
选择
ctrl+d 取消选区
ctrl+shift+i 反选
视图
清除切片
清除参考线
标尺(ctrl+R)
放大 ctrl+加号
缩小 ctrl+减号
窗口
图层面板(F7)
信息面板(F8)
历史记录
工作区——新建工作区(复位工作区)
工具栏
移动工具(v)——熟练
-
属性栏
- 自动选择(图层)
- 对齐
- 选中元素(ctrl+左键点击点选任意图层,shift+点击连续选择,鼠标左键拖动)
-
复制
- 选中图层,alt+鼠标左键拖动
- alt+方向键
-
移动
- 方向键(默认1像素,配合shift移动10像素)
选区工具(M)——熟练
新选区(加选、减选、交叉)
羽化(0)
样式(正常)
- 固定比例
- 固定大小
抓手工具(H)
移动画布:空格+鼠标左键拖动,
+空格键可临时转换为抓手工具。
放大镜(Z)
默认放大
配合alt缩小( 或配合鼠标滚轮-向前放大)
文字工具(T)——熟练
属性栏——字体,字号、颜色 、对齐(读取、修改)
复制(ctrl+a,ctrl+c复制,ctrl+v粘贴)
标尺工具
x和y:绘制的起点坐标。
W:标尺投射到x轴上的宽度。
H:标尺投射到y轴上的高度。(正负仅代表方向,x轴方向向右,y轴方向向下)。
A:代表标尺和x轴的夹角,取值范围在-180°到+180°之间。
L1:表示标尺选段的长度。
L2:表示绘制第二条线段的长度(按住alt键可以继续绘制第二条线段,最多绘制两条线段,a为两天线段的夹角)
切片工具——熟练
绘制切片
- 鼠标右键-编缉切片选项(x,y左上角坐标,w,h切片宽高)
- 鼠标右键-右键划分切片
删除切片
- 右键——删除
- 选中——delete
- 视图—清除所有切片
选中切片
- 切片选择工具
- 切片工具+ctrl ——》转换为 临时切片选择工具
修改切片
- 右键——w\h
- 拖动控件手柄
保存切片
- crtl+alt+shift+s 存储为web所用格式
- 存储—切片(所有用户切片,选中切片)
- 设置— 其他——(命名、指定是否放入image文件夹)
图层面板
上(下)移图层 —— ctrl+ } crtl+ {
置顶(底 )—— ctrl+shift+} ctrl+shift+}
合并图层 —— ctrl+E
盖印图层 —— ctrl+shift+alt+e
- 新建
- 删除
- 右键——删格化图层
- 显示、隐藏(点小眼睛) (配合alt显示隐藏其它)
- 填充(alt+del,crtl+del)
- 载入选区——选中图层 配合ctrl+鼠标左键点击
图层样式
- 颜色叠加
- 右键(拷贝图层样式——粘贴)
cutterman切图(熟练使用)
Cutterman是一款运行在photoshop中的插件,能够自动将你需要的图层进行输出, 以替代传统的手工 “导出web所用格式” 以及使用切片工具进行挨个切图的繁琐流程。 它支持各种各样的图片尺寸、格式、形态输出,方便你在pc、ios、Android等端上使用。 它不需要你记住一堆的语法、规则,纯点击操作,方便、快捷,易于上手。
http://www.cutterman.cn/zh/cutterman
- PS版本要求 CC2014及以上
- 操作系统 win/mac
cutterman安装完成后重启PS, 从菜单栏 -> 窗口 -> 扩展打开(注册-登录)
-
导出单个图层
-
导出多个图层
-
导出合并图层(勾选合并图层)
-
导出选区内容
-
导出指定大小(宽度、高度)
-
导出不覆盖(设置—相同文件名—重命名)
-
导出不同格式
-
压缩品质
- jpg (0-100) 通常(70-80)
图片格式
.psd(源文件)
Photoshop默认保存的文件格式,可以保留所有有图层、色版、通道、蒙版、路径、未栅格化文字以及图层样式等。
.jpg
色彩丰富 【不支持透明】
压缩比高,生成文件体积小,
支持多种压缩级别可以控制文件大小
适用:色彩丰富的不透明的图片(摄影图像(产品图,照片,渐变))
.gif
颜色不够丰富,只支持256种颜色
【支持动画】
支持透明(【支持全透明】,不支持半透明)
文件小
适用于:色彩简单的logo/icon图标/动图
.PNG
- png8
- 支持透明【支持全透明】,不支持半透明
- png24
- 支持alpha透明(全透明和全不透明,半透明)
- 颜色丰富
- 早期的浏览器不支持PNG图像( IE6)
- 色彩简单图片文件小,色彩丰富的图片文件大
适用于:透明背景图片(投影,发外光) 线条复杂(文字)
.WebP
谷歌(google)10年推出一种新型图片格式
-
文件小,支持有损和无损压缩,支持动画、透明
-
但并不是所有浏览器都支持 webp
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-SdSsYUqC-1605793424955)(…/AppData/Roaming/Typora/typora-user-images/image-20201116160956011.png)]
图片优化
- 选择合适的图片格式
- 精灵图、iconfont
- 分清背景图(小图标、纹理性背景)、前景图(产品图、广告图,展示性)
- 大图片分割
- 静态大banner图处理
1.根据有效区在图片中心填充白色区域(比有效区至小2-4个像素)
2.前景图取大图的中心部分(按有效区大小)
3.大背景图片要居中(center),有效区内的图片处理居中(margin:0 auto;)
5793424955)]
图片优化
- 选择合适的图片格式
- 精灵图、iconfont
- 分清背景图(小图标、纹理性背景)、前景图(产品图、广告图,展示性)
- 大图片分割
- 静态大banner图处理
1.根据有效区在图片中心填充白色区域(比有效区至小2-4个像素)
2.前景图取大图的中心部分(按有效区大小)
3.大背景图片要居中(center),有效区内的图片处理居中(margin:0 auto;)