一个前端所需具备的PS能力-创新互联
前端网页设计+静态实现案例
放一个2天半内给某公司完成的(设计 + 静态实现)的案例吧,静态阴影用CSS3实现的http://www.cnblogs.com/MuYunyun/p/5693615.html,我最开始设计的时候就想好要用什么实现,各个框的大小是多少(精确到1像素),以及颜色搭配等等。
成都创新互联总部坐落于成都市区,致力网站建设服务有成都网站建设、成都网站设计、网络营销策划、网页设计、网站维护、公众号搭建、重庆小程序开发、软件开发等为企业提供一整套的信息化建设解决方案。创造真正意义上的网站建设,为互联网品牌在互动行销领域创造价值而不懈努力!还有很多素材我就不演示了,设计了好些网页模板,如果有大家想用PS进行网页制作,欢迎大家交流。
很多人做前端只是掌握了最基本的切图(甚至连切图都有不会的),就连小小改动都要麻烦设计师,这就大大浪费了时间的。
回到顶部(go to top)
练习时候做的
都是我的朋友啦(O-O)
回到顶部(go to top)
关于PS学习
现在我要分享下如何学习PS的。
1.首先我想说的是要对它有兴趣(这是废话)。能恶搞别人谁没有兴趣。。
2.不要相信说一个星期速成之类的鬼话!我是把慕课网的全部PS教程全部过了遍,而且每个素材都练过!!不会就反复看然后自己找素材练习。有时候弄一张图就花了半天以上。没2个月根本学不到PS的精髓,别谈创新运用了(个人看法)。如果你单纯只要学会切图就当我没说,我只是想说只学切图会让你觉得PS怎么这么无聊。
3.我感觉PS简单又不简单,有时就相差那么点色差,或者明度。
4.多看大神P的图,找灵感,找素材。尽管我们是前端,我们要设计,后台都要懂些,这样子我们才能效率更高。
回到顶部(go to top)
很久以前的PS笔记
图片名字 显示比例 色彩模式 颜色深度
alt+t:选着图形可以使之变形
1. 2寸照片 放在5寸纸上 2.大头贴
裁切工具:1.斜着的路标裁切 2.使不水平景色的水平①(旋转裁切)
② 使用尺子
移动工具:1.使两或者多张图片复原
△:Ctrl:移动选区 Alt:复制后移动选区
选区工具:1.镜子手表中插入脸蛋 2.二郎神的第三只眼
△:shift 选正圆 或正方形
3.去LOGO 补破照片 去护栏等等
①选区 移动(优点:快)
②选区 alt+c alt+v 或者 选区 alt+j点图层(优点:不影响原图层)
容差:越小则越严 越大则越松
描边 可以做头顶光环
填充+羽化可以①使武器、灯塔等发出炫彩的光
②制作投影
图像的变形:①把海报放到路边(透视)
②把人脸映到葫芦里(葫芦娃)(变形)
③阿拉丁神灯(变形)
④把钟表映到橘子中 (扭曲)
⑤把图片映到茶杯上(变形)
shift+ctrl+alt+t:复制并重复上一次的移动 ①做扇子
②正方形里放正方形
扩大选取:连续(相当于魔术棒连续)
选取相似:不连续(相当于魔术棒不连续)
不透明度越高越实,
不透明度越低越虚。
ctrl+n:复制原来的选区到新定义的图纸(参考日光改月照)
图层保存:可以用“图案保存”
渐变工具:①彩虹桥 彩虹(线性渐变 径向渐变)
②光线渲染(径向渐变)
③制作光盘(直角渐变)
④水晶球(径向渐变+线性渐变)
⑤彩虹戒指(ctrl+up然后alt+up)(线性渐变)
直方图:①曝光不足 ②曝光过度 ③反差不足(色调均化) ④反差过度
(具体情况选具体方法)
色阶:黑场白场同时往里压增加对比度,输出色阶同时往里压降低对比度。
灰场(照相机里面的“白平衡”)
①黑白照片上色
②云朵变色
曲线:斜率越高对比度越高,斜率越低对比度越低
①进行各部位的美容(头发、眼睛、皮肤、嘴、衣服)
②修改云的颜色
ctrl+j = ctrl+c然后ctrl+v
匹配颜色;①面若“桃”色
进阶教程
RGB(色光混合)越加越亮
CMYK(颜料混合)越减越暗
C(青)M(品)Y(黄)K(黑色)颜色模式
红黄绿青蓝紫
红+绿 黄
红+蓝 紫
蓝+绿 青
红+绿+蓝 白
黄+青+紫 黑
移动工具:(对齐 分布的功能)
①快速作张信纸(ctrl减去某个图层)
裁剪工具:shift+o:变换辅助线
人脸美白(污点修复画笔工具,修复画笔工具)
修复画笔工具:alt取样
红眼工具(使红眼变黑)
铅笔工具:可以作出像素字(1像素 shift)
仿制图章工具和修复画笔类似
历史记录艺术画笔工具:马赛克作用
钢笔工具:ctrl选择, alt调整
(锚点两侧都调整) (锚点一侧调整)
路径选择工具:移动选择路径
直接选择工具:alt复制并移动
路径实例(制作表盘)
shift+ctrl+alt+e:合并可见图层为一个新图层
蒙版:shift:停用蒙版(换脸术)
alt:查看蒙版
PS高级教学
(范冰冰素材):1.左腮偏大 2.嘴唇颜色不够鲜艳 3.黑眼圈 4.劲纹
步骤1:液化(解决左腮)
步骤2:模糊工具(处理黑眼圈、处理下嘴角,劲纹)
步骤3:加深工具(处理眉毛、图显双眼皮睫毛)
步骤4:减淡工具(鼻梁处高光部位涂抹,增强立体感)
步骤5:曲线(增强对比度)画笔(涂口红)涂抹工具
ps之脸型篇:女的可以少一些,但是男生的脸一定要有棱角。
普通照片变为卡通动漫效果:
1.液化:冻结区蒙版(保护区域不受变形影响),膨胀工具(放大眼睛)
2.添加纯色调整图层(白色,50%不透明)(图片比较暗的时候用)
3.新建图层,钢笔工具画出眉毛,路径填充
4.钢笔工具勾出侧脸轮廓
5.描边路径 画笔工具(硬圆3px)
6.特殊模糊
7.模糊工具(清楚特殊模糊块状痕迹)
8.画笔工具(涂抹原来的眉毛),加大画面对比度
作品:妈妈、吸血鬼
高反差保留磨皮:
1.通道-创建蓝副本(蓝的对比度最明显)
2.滤镜-高反差保留
3.图像-计算(2、3次)
4.ctrl:选择高光 反选
5.图层面板-新建曲线图层(处理到这里算结束,后文细节处理)
6.shift+ctrl+alt+e - 复制图层两次 -
一个副本进行表面模糊处理(处理鼻子上的汗水),
另一个副本进行高反差保留(提取皮肤纹理,还原上步模糊的一些线条)-线性光
内容识别比例:保护人物或者自己设计的某些部分不受影响
①不变的人和酒
②长高的美女
中性灰磨皮:(这种磨皮能使皮肤保留真实感)(1到5个小时)
1.新建图层
2.编辑-填充50%中性灰(模式为柔光)
3.观察组{
新建纯色调整图层,颜色为黑色(模式为颜色)
复制黑色调整图层,(模式为叠加)
}
b、选择直径在7像素以下的柔角画笔,画笔不透明度设置为:5%,流量为:50%,放大画布至500%。
c、设置前景色为白色,以单个像素为单位轻擦中灰层中较暗淡部位,使其与周边过渡均匀。设置前景色为黑色,以单个像素为单位轻擦中灰色层中较明亮部位,同样使其与周边过渡均匀。
d、增大画笔,配合黑白前景色轻擦明暗过渡区域,使明暗之间平缓过渡。
e、缩小画笔,配合黑白前景色轻擦眼黑与眼白,并用白色画笔擦亮眼神光
人物上写字:
一:打开要处理的素材,然后Ctrl + L 打开色阶调整人物的明暗度
二:然后菜单—-滤镜—–素描—-便条纸
三、确定之后,Ctrl+Alt+2 把人物高光提出来部分,按Ctrl+Shift+i 反选一下,再按Ctrl+J 创建一层图层出来
四:大字、小字
五:渐变
六;然后在图层2白×××层上面新建一个空白图层,按Ctrl点击图层1 载入选区,然后给这个新图层拉一个渐变,渐变色用,我们刚刚给人物用的那个颜色。完成之后再—-滤镜—-模糊—高斯模糊
写轮眼:B6414F 叠加
制作公司印章:结合圆形路径打字(参考金吉岛蛋糕印章)
学到ctrl+Enter:将路径转换为选区;
(自来水厂)仿真 想想看用了什么技术?
制作个人印章:篆刻艺术
常用快捷键
ctrl+shift+N:新建一个图层;
ctrl+G:编组
ctrl+alt+2:选择高光
alt+蒙版:加个黑蒙版
crtl+h:隐藏/显示快捷键
回到顶部(go to top)
总结
如果找不到素材练习的话,我可以提供些练习过的素材。代码撸累了P张图,其实是很好的放松方式,而且P图能让心变得很安静。送给在前端路上的你我。
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
网站名称:一个前端所需具备的PS能力-创新互联
转载来于:http://scyanting.com/article/ipeih.html