ps设计圆点可爱ICON图标

这是模仿 Nest 烟雾警报器 做的 icon,打洞实在被难倒了没办法完全一样,只能做个差不多相似的样子出来。打洞排列怎么做可以参考这篇:《AI教程:…

UI知识,UI设计需要学习什么软件?

近期我被很多学员问到了关于UI设计需要学习什么软件的问题。今天我就来给大家聊下UI设计需要掌握的软件有哪一些。 首先第一个是PS,全称Adobe Photoshop Adobe Photoshop,简称PS,是由Adobe Systems开发和发行的图

这是模仿 Nest 烟雾警报器 做的 icon,打洞实在被难倒了没办法完全一样,只能做个差不多相似的样子出来。打洞排列怎么做可以参考这篇:《AI教程:利用ILLUSTRATOR创建漂亮的螺旋圆点花纹》,不怎么好做就是了。

图层数比起之前的Icon Design:My Wallet,这个 Nest Pastiche icon 只有 9 个图层,最难搞的就是那堆洞的排列,其他都还好处理。

1. 边缘高光阴影2. 文字3. 中间的环和彩色光4. 中间的凹槽5. 满满的打洞6. 方型底7. 阴影a8. 阴影b9. 白底

ps设计圆点可爱ICON图标插图
阴影

为了模拟真实影子,我会做2层的阴影,略微修改尺寸、位置、透明度、高斯模糊的数值。如果只用单层,影子渐层感会比较呆板。

ps设计圆点可爱ICON图标插图(1)

靠近主体、尺寸较小,用于加深主体的影子、增强对比度。

ps设计圆点可爱ICON图标插图(2)

偏离主体、高斯模糊的数值更大、尺寸也比较大,透明度低,做影子外围渐层的效果。

边缘导角

这种弯进去的作法挺常见的,稍微试了下,发现只要一个图层、设定 2 种图层样式就能表现出还不错的视觉效果。光线由上往下打,所以上方有高光、阴暗面在下方。想象一下实物、方体边缘是导了 R 角,所以高光不会是锐利一条线,而是渐层。

ps设计圆点可爱ICON图标插图(3)

制作阴影面,离光缘越远的部份一定比较暗。

ps设计圆点可爱ICON图标插图(4)

制作 R 角缓和的反光。因为内阴影和内光运会重迭在一起,注意数值设定,内光晕要比内阴影的尺寸更大。

成品

ps设计圆点可爱ICON图标插图(5)

中间的文字仿真 3C 产品上常见的金属文字贴纸。因文字较细,仅设定笔画、渐层、阴影。原版产品的光圈是蓝色、我试着改成粉红色。

Nest 除了白色机型之外、也有黑色款,有兴趣的人可以试着把黑色款做出来。

这是模仿 Nest 烟雾警报器 做的 icon,打洞实在被难倒了没办法完全一样,只能做个差不多相似的样子出来。打洞排列怎么做可以参考这篇:《AI教程:利用ILLUSTRATOR创建漂亮的螺旋圆点花纹》,不怎么好做就是了。

图层数比起之前的Icon Design:My Wallet,这个 Nest Pastiche icon 只有 9 个图层,最难搞的就是那堆洞的排列,其他都还好处理。

1. 边缘高光阴影2. 文字3. 中间的环和彩色光4. 中间的凹槽5. 满满的打洞6. 方型底7. 阴影a8. 阴影b9. 白底

ps设计圆点可爱ICON图标插图
阴影

为了模拟真实影子,我会做2层的阴影,略微修改尺寸、位置、透明度、高斯模糊的数值。如果只用单层,影子渐层感会比较呆板。

ps设计圆点可爱ICON图标插图(1)

靠近主体、尺寸较小,用于加深主体的影子、增强对比度。

ps设计圆点可爱ICON图标插图(2)

偏离主体、高斯模糊的数值更大、尺寸也比较大,透明度低,做影子外围渐层的效果。

边缘导角

这种弯进去的作法挺常见的,稍微试了下,发现只要一个图层、设定 2 种图层样式就能表现出还不错的视觉效果。光线由上往下打,所以上方有高光、阴暗面在下方。想象一下实物、方体边缘是导了 R 角,所以高光不会是锐利一条线,而是渐层。

ps设计圆点可爱ICON图标插图(3)

制作阴影面,离光缘越远的部份一定比较暗。

ps设计圆点可爱ICON图标插图(4)

制作 R 角缓和的反光。因为内阴影和内光运会重迭在一起,注意数值设定,内光晕要比内阴影的尺寸更大。

成品

ps设计圆点可爱ICON图标插图(5)

中间的文字仿真 3C 产品上常见的金属文字贴纸。因文字较细,仅设定笔画、渐层、阴影。原版产品的光圈是蓝色、我试着改成粉红色。

Nest 除了白色机型之外、也有黑色款,有兴趣的人可以试着把黑色款做出来。

作者: 791650988

为您推荐

联系我们

联系我们

0898-88881688

在线咨询: QQ交谈

邮箱: email@wangzhan.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

关注微博
返回顶部