【原创教程】用PS制作简单拟物计时器

栏目: Html · 发布时间: 8年前

【原创教程】用PS制作简单拟物计时器

好久不见啦宝贝们,我是你们亲爱的大旭老师,笔芯。

今天教大家来只做个炒鸡简单的拟物计时器,一起来看吧。

STEP1

打开你的Adobe Photoshop,创建一个新文档。

先制作背景:

给【背景】填充颜色 #343434

其次是用画笔工具(B)+柔边画笔,在整个背景正上半部打个光,颜色#ffffff、图层模式:柔光、不透明度:70%。

【原创教程】用PS制作简单拟物计时器

STEP2

制作底框:

用圆角矩形工具(U)绘制计时器的底框。

赋予【底框】光影,制造下陷的感觉:我们经常在使用图层样式时,其实可以灵活变通,多思考。

例如:在这步里,我们用内阴影做了个底框的阴影,同时也用它来做了高光,其实只是适当的修改了颜色和图层模式而已,但却做出了许多不同的效果。

图层样式:内阴影     模式:正片叠底     颜色:#000000     不透明度:35%       角度:90°     距离:1px        大小:4px

图层样式:内阴影     模式:滤色     颜色:#4a4444     不透明度:35%       角度:-90°     距离:1px        大小:4px

图层样式:渐变叠加     模式:正常     不透明度:55%     样式:线性     颜色:#262626~ #5d5d5d        角度:-90°     缩放:82%

【原创教程】用PS制作简单拟物计时器

STEP3

制作上半页:这里用圆角矩形工具(U),颜色填充#e2e1e0。

赋予【上半页】光影,制造凸起的感觉

图层样式:斜面浮雕     样式:内斜面     方法:平滑     大小:3px       软化:4px   角度:90°    高度:30°      高光:#ffffff  透明度: 14%     阴影:#000000  不透明度:47%

图层样式:描边     大小:3px     位置:外部     填充类型:颜色     颜色:#131315

图层样式:内阴影     模式:滤色     颜色:#706767     不透明度:33%       角度:90°     距离:2px        大小:2px

图层样式:内阴影     模式:滤色     颜色:#706767     不透明度:33%       角度:-90°     距离:1px        大小:1px

图层样式:渐变叠加     模式:正常     样式:线性     颜色:#161617~ #5d5a5a        角度:90°     缩放:150%

【原创教程】用PS制作简单拟物计时器

制作下半页:观察发现,下半页和上半页是个完全对称并垂直翻转后可以得到的图形,所以我们这里就可以直接复制一层,右键清除图层样式,然后用自由变换工具(Ctrl+t)垂直翻转得到计时器的下半页。

赋予【下半页】光影,制造凸起的感觉:这里添加的图层样式和上面是一样的,但因为在Ps里面,对象变换以后图层样式也会跟着变化,所以这里要清除图层样式,再重新添加,最后还得适当的调整一下参数、对齐。

图层样式:斜面浮雕     样式:内斜面     方法:平滑     大小:3px       软化:2px   角度:90°    高度:30°      高光:#ffffff  透明度: 14%     阴影:#000000  不透明度:47%

图层样式:描边     大小:3px     位置:外部     填充类型:颜色     颜色:#131315

图层样式:内阴影     模式:滤色     颜色:#706767     不透明度:26%       角度:90°     距离:1px        大小:2px

图层样式:内阴影     模式:滤色     颜色:#706767     不透明度:26%       角度:-90°     距离:1px        大小:1px

图层样式:渐变叠加     模式:正常     样式:线性     颜色:#161617(70%)~ #5d5a5a        角度:90°     缩放:150%

【原创教程】用PS制作简单拟物计时器

STEP4

制作左右轴:这里先用矩形工具(U)绘制计时器的左轴,颜色填充#e2e1e0,添加图层样式。右轴等左轴做好了以后,直接复制一个,移动对齐就可以了。

赋予【左轴】光影,制造凸起的感觉:

图层样式:斜面浮雕     样式:内斜面     方法:平滑       软化:2px     角度:-90°    高度:30°      高光:#ffffff  透明度:4%        阴影:#000000  不透明度:20%

图层样式:描边     大小:3px     位置:外部     填充类型:颜色     颜色:#131315

图层样式:渐变叠加     模式:正常     样式:线性     颜色: #5d5a5a ~ #161617(80%)~ #5d5a5a        角度:90°     缩放:150%

【原创教程】用PS制作简单拟物计时器

到目前为止,计时器的基本型已经完成了,然后我们把【底框】、【上、下半页】、【左、右轴】这五个图层编组,方便后面操作。编组完成后,将【组 1】复制一层,改名为【组 2】。这里可以根据自己的需求来增加或减少,看你是几位数就复制几个。

【原创教程】用PS制作简单拟物计时器

STEP5

制作数字模板:使用文字 工具 输入你要的数字,一个图层一个数字,居中对齐方便编辑。

【原创教程】用PS制作简单拟物计时器

隐藏缝隙上的数字:先把对应的文字图层右键转化为智能对象,然后在每个文字图层上添加个图层蒙版,再用画笔工具(B) – 柔边画笔 – 不透明度:90% – 颜色#000000。按住Shift键在图层的蒙版上把缝隙给擦出来,这样就能模拟缝隙的效果。

【原创教程】用PS制作简单拟物计时器

做到这里,这个效果基本上就已经做完了。当然你还可以去为它添加上更多丰富的光影,细节。相信你能做的更好!

总结

这样的拟物倒计时器是不是超级简单呢?多利用咱们的图层FX样式,可以做出更多这样的东西呢。


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。

数据库系统概念

数据库系统概念

Abraham Silberschatz、Henry F. Korth、S. Sudarshan / 杨冬青、马秀莉、唐世渭 / 机械工业 / 2006-10-01 / 69.50元

本书是数据库系统方面的经典教材之一。国际上许多著名大学包括斯坦福大学、耶鲁大学、得克萨斯大学、康奈尔大学、伊利诺伊大学、印度理工学院等都采用本书作为教科书。我国也有许多所大学采用本书以前版本的中文版作为本科生和研究生的数据库课程的教材和主要教学参考书,收到了良好的效果。 本书调整和新增内容:调整了第4版的讲授顺序。首先介绍SQL及其高级特性,使学生容易接受数据库设计的概念。新增数据库设计的专......一起来看看 《数据库系统概念》 这本书的介绍吧!

Base64 编码/解码
Base64 编码/解码

Base64 编码/解码

MD5 加密
MD5 加密

MD5 加密工具

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具