找回密码
 立即注册
网站/小程序/APP/浏览器插件/桌面软件/脚本 定制开发·运营维护·故障修复·技术咨询
查看: 2142|回复: 2

酷炫的渐变星球,这样的渐变风格海报很酷

[复制链接]
发表于 2019-8-13 19:02:15 | 显示全部楼层 |阅读模式
教程是给新手写的

其中包括各种基本操作完全的 PS 小白

也能跟着一步步做出来

有基础的同学可以跳过我的啰嗦

酷炫的渐变星球,这样的渐变风格海报很酷-1.jpg



1.新建画板,我设置的大小是 1024px*768px;

酷炫的渐变星球,这样的渐变风格海报很酷-2.jpg


前景色设置为,用油漆桶点一下填充背景。

酷炫的渐变星球,这样的渐变风格海报很酷-3.jpg



2.用椭圆工具添加一个正圆,大小 276px*276px(这个大小只是参考,但是大家一定要采用偶数直径,方便后面对齐),颜色任意(因为这个填充色咱们最后不用它),为了方面描述命名为 " 圆 - 外层 "。ctrl+A 选中整个画面,选择工具,水平、垂直居中。

酷炫的渐变星球,这样的渐变风格海报很酷-4.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-5.jpg



3.调节圆形的图层样式,首先,将填充改为 0%;添加图层样式 - 渐变叠加,设置颜色和参数

酷炫的渐变星球,这样的渐变风格海报很酷-6.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-7.jpg



这个渐变点进去,设置两端的色值,#ff00f6 ;#f000ff;调节上面的不透明度,从左到右依次是:

酷炫的渐变星球,这样的渐变风格海报很酷-8.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-9.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-10.jpg



看一下效果图是不是跟我的差不多就行。

4.选中图层 " 圆 - 外层 ",ctrl+J 复制一个图层,ctrl+T 自由变换,按住 shift+alt 缩小,大小大概为原来的 95%(我这里是 264*264),改名为 " 圆 - 内层 "。右击 - 清除图层样式,得到如图:

酷炫的渐变星球,这样的渐变风格海报很酷-11.jpg



5.给 " 圆 - 内层 " 添加样式:将填充改为 0%;然后添加图层样式 - 渐变叠加,设置颜色和参数(怎么有种似曾相识的感觉):



酷炫的渐变星球,这样的渐变风格海报很酷-12.jpg



注意这次渐变方向为径向,而且这个状态时鼠标在圆内移动可以改变渐变的位置,注意要让受光面在左上角处;

酷炫的渐变星球,这样的渐变风格海报很酷-13.jpg



右侧色值参考:#660777;

6.复制 " 圆 - 内层 "(ctrl+J),去掉图层样式,变换大小得到一个大小为原来 95% 的同心圆(参考步骤 4)命名为 " 液体 -1"。

酷炫的渐变星球,这样的渐变风格海报很酷-14.jpg



7.非常关键的一步来啦:绘制水波状的形状。首先,选择小黑工具点击圆形选中,在这种状态下,选择矩形工具

酷炫的渐变星球,这样的渐变风格海报很酷-15.jpg



按住 alt 键,画一个矩形(tips:布尔运算:按住 alt 绘制是减去,按住 shift 绘制是加上)

酷炫的渐变星球,这样的渐变风格海报很酷-16.jpg



再回到小黑,选中矩形调节位置,减去圆形的大概小一半(注意不是正好一半)。

酷炫的渐变星球,这样的渐变风格海报很酷-17.jpg



按住 shift 再选中圆

酷炫的渐变星球,这样的渐变风格海报很酷-18.jpg



合并形状组件

酷炫的渐变星球,这样的渐变风格海报很酷-19.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-20.jpg


得到一个类似于半圆的形状。用添加锚点工具添加三个锚点



酷炫的渐变星球,这样的渐变风格海报很酷-21.jpg



用小白工具(直接选择工具)选择一个锚点,调节位置,注意调节的过程中按住 shift 键,保证手柄的方向一直都是水平的

酷炫的渐变星球,这样的渐变风格海报很酷-22.jpg



(tips:贝塞尔曲线的绘制技巧——添加新锚点时按住 shift 键,拉出手柄,保证手柄的方向一直是水平或 45 度斜角,这样绘制出的曲线会比较平滑。)

同样的方法调节另外两个锚点

添加渐变叠加

酷炫的渐变星球,这样的渐变风格海报很酷-23.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-24.jpg



色值参考:左 #20f0f2 右 #418deb

8.复制 " 液体 -1",在其基础上调节锚点得到 " 液体 -2"。

酷炫的渐变星球,这样的渐变风格海报很酷-25.jpg



9.重复第 7 步得到 " 液体 -3"(要注意这里减去的矩形要更多啦),添加渐变叠加。



酷炫的渐变星球,这样的渐变风格海报很酷-26.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-27.jpg



(从左至右 #f429da、 #f400d4、 #f47ffb 、#fcc5ff)

这里单纯通过图层样式的叠加可能得不到如图所示的渐变样式啦,这个时候我们要引入另一种方法。新建一个图层,放在 " 液体 -3" 上面。按住 alt 点击图层 2 和液体 -3 之间的位置,将图层 2 剪切进 " 液体 -3"。

双击效果 - 勾选第一个对勾 " 将内部效果混合成组 ",去掉第二个对勾,确定。(非常重要,否则我们接下来做的步骤效果就看不出来了。)

酷炫的渐变星球,这样的渐变风格海报很酷-28.jpg



再选中新建的透明图层,选择画笔工具,按住 ALT 键点击 " 液体 -3" 上渐变色最浅的地方,前景色就成了浅粉色将画笔调节为柔和,笔触放大。

酷炫的渐变星球,这样的渐变风格海报很酷-29.jpg



沿着 " 液体 -3" 曲线的外侧点击几下,注意不要多点,避免颜色太实。

再将前景色颜色改成橙色,

酷炫的渐变星球,这样的渐变风格海报很酷-30.jpg



沿着右下角外侧点击一下,得到如图:

酷炫的渐变星球,这样的渐变风格海报很酷-31.jpg



10.辛辛苦苦到这里,还是有的小小的成就感的吧。。。下面我们该绘制高光和反光啦,也并不轻松。。。

回到 " 圆 - 内层 ",复制一个放在最顶层。填充改为白色,运用布尔运算减去一个大圆,设置混合模式为叠加,不透明度 17%

酷炫的渐变星球,这样的渐变风格海报很酷-32.jpg



添加个图层蒙板,用渐变工具添加一个渐变。反光完成。

11.高光。。。这个真不好讲,总之就是用布尔运算加加减减,直接上步骤吧。

酷炫的渐变星球,这样的渐变风格海报很酷-33.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-34.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-35.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-36.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-37.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-38.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-39.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-40.jpg



12.到这一步主体终于完成啦!趁热打铁,咬牙做下去。下面我们来做光环吧。用之前教大家的布尔运算,做一个椭圆形的环。

酷炫的渐变星球,这样的渐变风格海报很酷-41.jpg



渐变叠加。

酷炫的渐变星球,这样的渐变风格海报很酷-42.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-43.jpg



添加一个图层蒙版,用渐变工具把后面遮一下,注意不要遮太死,因为我们的星球也是半透明的。

酷炫的渐变星球,这样的渐变风格海报很酷-44.jpg



13

在图层上右击,删格化图层样式,将混合模式改成 " 线性减淡(添加)",然后 ctrl+T,按住 shift 旋转 30 度,调整一下位置。

酷炫的渐变星球,这样的渐变风格海报很酷-45.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-46.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-47.jpg



14.将刚才的圆环复制一层,下移 25px。

酷炫的渐变星球,这样的渐变风格海报很酷-48.jpg



添加颜色叠加 #96015c,混合模式改成正片叠底。填充 0%,不透明度 13%。

酷炫的渐变星球,这样的渐变风格海报很酷-49.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-50.jpg



15.好我们来绘制流星。用圆角矩形工具添加一个高 16,宽 138 像素的圆角矩形。填充改为 0。添加渐变叠加。

酷炫的渐变星球,这样的渐变风格海报很酷-51.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-52.jpg



16.删格化图层样式后旋转 30 度放在合适位置,并复制一个改变位置。

酷炫的渐变星球,这样的渐变风格海报很酷-53.jpg



17.用同样的方法做出另外两个,调节透明度(参考 50%),适当减弱一下。

酷炫的渐变星球,这样的渐变风格海报很酷-54.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-55.jpg



18.添加一个圆(卫星),渐变叠加,注意径向。调节反光位置正好冲着星球。

酷炫的渐变星球,这样的渐变风格海报很酷-56.jpg



19.给上一步的卫星添加一个图层蒙版,用黑色柔光笔在左上角点几下,如图。



酷炫的渐变星球,这样的渐变风格海报很酷-57.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-58.jpg



再将图层混合模式改成颜色减淡

酷炫的渐变星球,这样的渐变风格海报很酷-59.jpg





20

再添加一个圆,渐变叠加:(注意此时图层填充是 0)

酷炫的渐变星球,这样的渐变风格海报很酷-60.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-61.jpg



21.终于该画背景了,这个流动的云形图最近也是很流行了,直接拿圆角矩形用布尔运算拼就可以,直接上图:填充色:#230d4e

酷炫的渐变星球,这样的渐变风格海报很酷-62.jpg



22.小星星:多边形工具,设置边数为 4,星形,缩进边依据 40%,鼠标拖出一个四角星形。



酷炫的渐变星球,这样的渐变风格海报很酷-63.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-64.jpg



23.旋转,添加渐变叠加,放到合适的位置。同样的办法再做两个大小不一样的。



酷炫的渐变星球,这样的渐变风格海报很酷-65.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-66.jpg





酷炫的渐变星球,这样的渐变风格海报很酷-67.jpg





24.将上述云和小星星建一个组,复制组,移到主体星球右边。将两个背景组放在主体图层之下。

酷炫的渐变星球,这样的渐变风格海报很酷-68.jpg



看一下整个的图层 :



酷炫的渐变星球,这样的渐变风格海报很酷-69.jpg



25.整体调节一下,大功告成!




在这里我相信有很多想要学习UI设计是一名从事了多年UI设计私人定制课程,今年年初我花了一个月整理了一份最适合2019年学习的学习干货及教程,从最基础到,各种框架都有整理,送给每一位UI设计取的可以关注我并在后台私信我:学习,即可免费获取


本文版权归原作者今日头条所有,如有侵权请联系管理员删除,原文地址:https://www.toutiao.com/a6720750184470462990/
回复

使用道具 举报

发表于 2019-8-13 19:02:37 | 显示全部楼层
转发了
回复 支持 反对

使用道具 举报

发表于 2019-8-13 19:03:01 | 显示全部楼层
转发了
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|服务条款|版权问题|手机版|小黑屋|手机版|滇ICP备13004447号-1|滇公网安备53032802000133号|神秘网

网站地图sitemapArchiver

GMT+8, 2024-11-16 08:59 , Processed in 0.091626 second(s), 23 queries , Gzip On.

基于Discuz! X3.5

辛树所有

快速回复 返回顶部 返回列表