UI设计教程之啤酒杯UI图标教程

冷栋老师 发布于 2018/01/23 15:12
查看:998|回复:3

终于知道翻译教程的酷友是多么的伟大了,真的是好麻烦啊!不试不知道啊!但愿大家能看懂!

.com/large/435500048401378885da

创建一个1200*1200px,分辨率为72px/inch的文档。双击背景图层,添加渐变叠加图层样式

.com/large/435500048403f3821bc9

下载玻璃形状,按下图标注添加形状#1-350*624px;#2-326*472px;#3-196*455px;#4-286*116px;#5-216*16px;#6-285*111px;#7-405*272px;

.com/large/4357000462b9af232fe9

仅保留形状1隐藏其他图层,为其添加图层样式

.com/large/435b000014141235fc5a

.com/large/43560004692b4bde984c

.com/large/4357000462c650311878

.com/large/4355000483f98a564d06

显示形状2,使用椭圆形状减去顶部,减去的这部分作为啤酒的泡沫层(复制刚刚得到的形状2,将减去改成相交即可得到泡沫层,最后在合并形状组件)

.com/large/435600046985a7e91e90

给形状2添加渐变叠加样式

.com/large/43550004845540b5f413

.com/large/435800045d8a12d6da32

复制形状2图层并添加渐变叠加图层样式

.com/large/435700046327da606e88

.com/large/43570004632bcff7e18d

再次复制形状2添加图层样式

.com/large/435a0002704a6c810d6f

.com/large/435b0000147c7afa5a13

.com/large/435600046987a30df3da

第三次复制形状2,CTRL T向左向右拉伸到玻璃瓶最外沿,选中选区部分添加图层蒙版

.com/large/43590002eb65fe91b7dd

.com/large/435a000270a6ed4d003e

第四次复制形状2,减去顶部,仅保留图上部分,添加图层样式

.com/large/435700046381cb5a27c1

.com/large/4357000463835a167f19

.com/large/435b000014f32173e89b

复制形状2拷贝5图层,添加斜面与浮雕样式

.com/large/4356000469d5701e18c8

.com/large/435700046380184d89dd

显示泡沫层添加渐变叠加样式

.com/large/435b000014f1a63e78d8

.com/large/435800045de7d11a7069

显示形状6添加图层样式

.com/large/435500048528e60106df

.com/large/43550004852777ff8d1d

.com/large/435600046a3e6c6455e6

.com/large/435800045e4db7471790

显示形状4添加图层样式

.com/large/435800045e4a58d89420

.com/large/43590002ebe395c1352d

.com/large/435800045e4a58d89420

.com/large/435600046a3d3f90f218

下图形状应该不难创建吧,这里就不多说了,直接添加图层样式

.com/large/435800045e4a58d89420

.com/large/43590002ebe2790b57de

同理添加图层样式

.com/large/435a000271c1344bf7ea

.com/large/435800045ec91c5b7c61

载入选区,创建一个新的空白图层,编辑-描边-10px白色

.com/large/435a000271c3e55867b4

删除底部选区部分,仅保留顶部部分,添加图层样式

.com/large/4357000464745f3fbff8

.com/large/435600046aba2135beca

.com/large/435a000271c2f4436928

.com/large/435a000271c07df24357

.com/large/435b000015dc3c6bd84a

显示形状5添加图层样式

.com/large/435b000015dbb7e67bdc

.com/large/435600046abb3310aad9

.com/large/435600046ab8ea6faa29

显示形状3添加图层样式

.com/large/43590002ece181f3f4e3

.com/large/435b0000164f058d59d9

.com/large/435600046b1de4d5dc22

.com/large/435600046b1c3efd0ead

.com/large/435800045f34ce617bf8

创建如下三个椭圆路径,新建图层,填充颜色,减去选区以外的部分,填充不透明度为0添加图层样式

.com/large/4357000464e9e6501b4d

.com/large/435b00001650f804774d

.com/large/43550004860f19742f9d

复制形状3添加斜面与浮雕效果

.com/large/4357000464ea6d7c9ff9

.com/large/43590002ece2649471eb

再次复制形状3添加斜面与浮雕效果

.com/large/435800045f36d60f42e4

.com/large/435800045f35d86c81ca

创建新的把手层,减掉选区以外的部分,然后添加图层样式

.com/large/435a00027281938b6c2a

.com/large/435b000016ae5d571ada

.com/large/435800045f9c5bb919b5

创建把手组,然后复制把手组,合并把手组CTRT T水平翻转,使用自由变换工具调整,然后设置叠加模式

.com/large/435a00027280d3132c3f

.com/large/43550004867ad5276768

显示形状7添加图层样式

.com/large/43550004867b79fdb265

.com/large/435a0002727e8c6fb7d1

.com/large/43550004867c5c2db1cf

复制形状7添加图层样式

.com/large/435a0002727f5bc17a42

.com/large/435b000016af33bc34c5

.com/large/43570004653c0254f77d

.com/large/435b000016b02e1aff3b

.com/large/435600046b8c3562ea75

再次复制形状7添加图层样式

.com/large/435800045fda18101dcc

.com/large/435b000017178ac6d2f1

第三次复制形状7添加渐变叠加图层样式移动到形状7图层底部作为投影层,向左向下各移动2像素,然后滤镜-高斯模糊0.6,创建图层蒙版擦除不需要的部分

.com/large/435a000272d2f9a7538d

.com/large/435a000272d3faca4630

新建空白图层,设置画笔,用吸管选取合适的颜色,绘制泡沫纹理

.com/large/435a000272d4775db209

.com/large/43570004658a2683581e

新建空白图层,设置画笔,在选区内绘制泡沫纹理并添加图层样式,重复操作一到两次,使效果更加

.com/large/435800045fdb1e572d1a

.com/large/43590002ed8f3a00138e

.com/large/435b0000171618f21e50

.com/large/4355000486d2cb76b5a5

复制杯体并合并图层组然后设置编辑-调整-对比度-35;滤镜-模糊-高斯模糊 6;滤镜-杂色-添加杂色 3;滤镜-扭曲-玻璃

.com/large/435a0002733a9b073399

.com/large/435a00027338a62b841f

.com/large/43590002ededb3344f1a

.com/large/43580004604346aa2434

为了使效果更佳下载并添加特殊的纹理层。打开通道面板。选择红色通道并点击小图标加载选区,回到图层面板,给玻璃层添加图层蒙版。

.com/large/435a00027339a092101f

.com/large/43590002edebf4d27664

.com/large/4357000465ec95a22c14

开始绘制水珠,新建空白图层首先设置画笔工具,然后添加图层样式

.com/large/4358000460c8dd468b8f

.com/large/435a000273b8c0e48497

.com/large/43590002ee77bdff4ddf

.com/large/435a000273b7b51f5dde

.com/large/435600046cd491d21ba9

.com/large/435600046ccf8b87e03a

.com/large/435600046cd0795fc423

.com/large/4358000460c32f9969c8

添加投影,分别合并杯体和把手图层,垂直翻转,然后对杯体进行变形(凸起变形模式)

.com/large/4358000460c53cbebd26

.com/large/43590002ee74a2a2d8a2

合并把手与杯体添加图层蒙版,并对选区部分设置高斯模糊滤镜 3,使投影更加自然

.com/large/435b000017f0b4990b44

最后添加一个t椭圆投影

.com/large/435600046cd1f92600e5

.com/large/435600046cd27844a46a

大功告成! 教程很长,希望你们可以认真学习





—————————————————————我是一条分割线——————————————————————

《免责声明》本网站转载的文章遵循原作者的版权声明,如果原文没有版权声明,按照目前互联网开放的原则,我们将在不通知作者的情况下,转载文章;如果原文明确注明“禁止转载”,我们一定不会转载。如果我们转载的文章不符合作者的版权声明或者作者不想让我们转载您的文章的话,请来信告知,邮箱:496976599@ qq.com;电话:18819171618。 本网站转载文章仅为传播更多信息之目的,凡在本网站出现的信息,均仅供参考。本网站将尽力确保所提供信息的准确性及可靠性,但不保证信息的正确性和完整性,且不对因信息的不正确或遗漏导致的任何损失或损害承担责任。 任何透过本网站网页而链接及得到的资讯、产品及服务,本网站概不负责,亦不负任何法律责任。 本网站所刊发、转载的文章,其版权均归原作者所有,如其他媒体、网站或个人从本网下载使用,请在转载有关文章时务必尊重该文章的著作权,保留本网注明的“稿件来源”,并自负版权等法律责任。

查看点赞情况
全部点赞
总计: --

共有3条评论

发布新贴
招版主啦

版主

  • UI黄老师 UI黄老师
  • UI讲师-冯志龙 UI讲师-冯志龙
  • UI设计-江海金 UI设计-江海金
  • UI设计讲师-黄晓炜 UI设计讲师-黄晓炜
  • 讲师-熊祥淳 讲师-熊祥淳
  • 钟园园 钟园园

注册有礼

完善以下信息,为你推荐课程

  • 学生
  • 白领
  • 高管
  • 自由职业
  • 其他
  • 工作需要
  • 自我提升
  • 兴趣爱好
  • 创业/转型
  • 其他
  • 小白
  • 了解
  • 熟悉
  • 精通
  • 其他
  • 高中/中专
  • 专科
  • 本科
  • 硕士
  • 其他
  • 影视枪战大片特效解析
  • PS视觉惊悚课堂
  • 45天7千平方大厦变形记
  • 原画学习痛点技法全解析
  • 影视动画奇幻课堂
  • AI高端商业设计全攻略
  • UG职场生存必备指南
  • 日赚千元之新媒体行业揭秘
出现异常