UI设计教程 超详细的冰淇淋图标制作

2015-05-04 13:30 832 1 收藏

临近夏天,冰淇淋的出现也会变得越来越频繁,下面图老师小编介绍一个超详细的UI设计教程,手把手教你如何制作出美味可口的冰淇淋图标。

【 tulaoshi.com - UI设计 】

新建一个画布,大小为400×300像素

单击“创建新的填充或调整图层”,然后选择纯色

ps-tut-draw-ice-cream-002

选择浅蓝色作为背景(参数如图)

在图层面板中双击图层名称更名为“ background”

ps-tut-draw-ice-cream-004

图层面板底部的默认背景已经不再需要,可以删除

ps-tut-draw-ice-cream-005

使用矩形工具画一个矩形,颜色选择白色,填充为无

ps-tut-draw-ice-cream-007

按Ctrl+T应用自由变换,右键单击,然后选择透视

将矩形右上个角向外拉动,按回车键确认变换

ps-tut-draw-ice-cream-010

选择椭圆工具,在矩形下部添加椭圆形

ps-tut-draw-ice-cream-011

双击图层,添加一个从白色到淡蓝色渐变叠加样式

样式为“线性”,混合模式为“正片叠底”(其它参数如图所示)

添加一个浅蓝色的矩形,并把它垂直于杯身

用路径选择工具选择刚才制作的形状,按Shift+Alt复制拖动覆盖杯身

用选择工具选中形状按Ctrl+T进行自由变换,右键单击选择透视

将右下角向内拉动,直到其形状与杯身的角度一致

按Ctrl+Alt+G向下剪贴蒙版,所有的矩形将成为杯子的条纹

ps-tut-draw-ice-cream-018

在图层面板中创建新组命名为“Cup”,再用椭圆工具绘制一个椭圆

ps-tut-draw-ice-cream-019

在之前的形状上添加一个较小的椭圆形状

从选项栏中设置路径模式为减去顶层形状做为冰淇淋杯的上部。(注:快捷键为alt)

添加灯光和阴影

想要把它变成三维的图像,我们需要添加灯光和阴影。用路径选择工具选择大的椭圆形状,按Ctrl + C复制,然后按Ctrl+V粘贴。我们现在便有两条路径。选择复制的路径向上移动(如图所示),然后将其路径模式设为减去顶层形状。将会得到两个重叠的椭圆。

建立新层,填充颜色

点击Ctrl+Enter将其转换成选区,将有一个月牙形状的选区。建立新层,填充颜色,作为下一高光层的剪贴蒙版来使用。点击编辑 > 填充,在对话框中,选择使用:颜色,将会对话框显示要求输入颜色,选择蓝色,点击OK。

重复前面的步骤,在顶部建立一个新的月牙的路径

转换为选区,仍然使用同样的方式,填充蓝色

按Ctrl点击之前创建的第一环形状,按Ctrl+Enter转换成一个选区

单击“选择>修改>收缩大小为2px”

建立新层,然后填充选择白色

ps-tut-draw-ice-cream-027

Ctrl+D取消选区,然后添加滤镜

确保这一图层在最上方,将其转换为剪贴蒙版

给图层组添加蒙板,选择画笔工具,填充为黑色

新建一层, 给画笔工具调整好适当的透明度,给杯子画上阴影

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/uisheji/)

ps-tut-draw-ice-cream-032

创建一个图层组并将其命名为“ ice cream”,组放在“cup”组的下面

ps-tut-draw-ice-cream-033

选择钢笔工具,在选项栏中选择形状

ps-tut-draw-ice-cream-035

填充色选择一个粉红色,描边为无,你也可以选择你自己喜欢的颜色。单击并拖动以绘制一个曲线的形状(如图所示)。

设置颜色特效

ps-tut-draw-ice-cream-038

双击该图层,然后添加一个内发光, 颜色为白色, 混合模式为滤色,方法为柔和。然后添加一个渐变叠加, 颜色从黑到白,混合模式为:叠加,样式为线性(参数如图所示)。

继续使用相同的颜色用钢笔工具绘制一个弯曲的形状

添加相同的图层样式,也可以按住alt拖动“fx”直接复制

ps-tut-draw-ice-cream-040

继续添加冰激凌的形状

ps-tut-draw-ice-cream-041ps-tut-draw-ice-cream-042ps-tut-draw-ice-cream-043ps-tut-draw-ice-cream-044

形状任意,颜色相似,添加相同的图层样式。

添加阴影和高光使它更真实

ps-tut-draw-ice-cream-046

选择之前第一层的形状,在上面添加新层。将其转换为剪贴蒙版(按Ctrl + Alt + G)。

选择画笔工具,大小为10

将前景色改为暗粉红色,然后画上阴影

下面你可以使用画笔工具添加相较之前不同的和灯光和阴影。你可以在选项栏中降低的画笔工具的不透明度。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/uisheji/)

继续在杯子表面添加阴影,可以继续添加新的层组

选择椭圆框选工具画一个和杯底大小一样的椭圆选区

ps-tut-draw-ice-cream-054

添加新的图层,点击编辑>填充,选择填充深蓝色

你也可以选择不同的颜色,这取决于你自己画的的杯子的颜色。使用键盘快捷键Ctrl 激活选区,点击滤镜>模糊>高斯模糊,柔化阴影取消选区。

选择移动工具,然后点击右箭头两次

ps-tut-draw-ice-cream-056

按Ctrl+J复制阴影,按Ctrl+T变换形状

ps-tut-draw-ice-cream-057

可以降低其不透明度使阴影自然一点

添加阴影和高光

我们可以发现冰淇淋目前还是太平了。我们可以到其表面添加更多的高光。 建立新的图层,选择画笔工具,颜色为白色、降低画笔透明度在冰淇淋表面涂抹。

可以发现发生了微妙的差异

使用画笔工具给表面添加一点阴影,颜色改为黑色

ps-tut-draw-ice-cream-062

为了让它更真实,在表面上添加一些小瑕疵

可以稍微提高画笔的透明度并减小笔刷的大小,例如 1 px 或 2 px. 添加新的图层,再随机在冰淇淋表面涂抹

一个逼真的冰淇淋完成

来源:https://www.tulaoshi.com/n/20150504/174592.html

延伸阅读
设计师gaolewen关于08年奥运会上一系列元素的主题图标设计。
设计师silencemira的图标UI设计欣赏。
标签: PS PS基础
最终效果 1、先用钢笔勾出一个箭头的路径。 2、按Ctrl + Enter把路径转为选区,切换到通道面板,新建一个通道,然后填充白色,按Ctrl + D取消选区,执行:滤镜  模糊  高斯模糊,数值为4.3左右,按Ctrl + L调色阶把左右两个黑色三角形箭头想中间靠拢,使得轮廓变清晰,圆角完成。 3、按Ctrl点击通道载入选区,回到图层面...

经验教程

885

收藏

57
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部