纯净、安全、绿色的下载网站

首页|软件分类|下载排行|最新软件|IT学院

当前位置:首页photoshop教程矢量手绘

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

游戏手柄实例教程   2021-06-04 我要评论

这里我们设计师教大家学习一篇高级PS鼠绘教程鼠绘实例教程巧用Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄。

最终效果

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第1步

在Photoshop中建立如下图所示的新文件

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第2步

使用圆角矩形工具(快捷键U)设定圆角半径150-160px。绘制如下面第1图所示的圆角矩形填充颜色#dee0df。然后添加图层样式(Layer Style)(2步如下面第2、3图所示)。做完之后复制图形并清除图层样式(Clear Layer Style)将复制图形的“填充(Fill)”设置为0然后增加如下面第4图所示的图层样式。重新命名两个图层“Base”和“Base 1”。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

 

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第3步

建立新图层并将其置于前两个图层上方。选择钢笔工具(P)绘制手柄的边缘按钮(如下第1图)。应用如下第2、3图所示的样式

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第4步

对所有图层编组命名为“Base”。创建新图层选择椭圆工具(U)画一个小圆形填充颜色#dee0df然后应用如下图所示的样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第5步

复制上面的小圆形两次将复制图层的“填充”值都设为0。将复制的第一个图层的样式清除并应用如下面第1图所示的样式;对复制的第二个图层进行与上面相同的处理添加样式如下第2图。最后在圆圈上面写上字母“Y”(颜色:#959595字体:Arial/Helvetica字号:4pt)。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第6步

把刚制作的“Y”按钮编组并命名为“Y”复制该组3次按下图所示的次序摆放。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第7步

将上面的“Y”“X”“A”“B”编组命名为“YXAB”。同样的方法制作组“+-”如下图所示。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第8步

创建新图层使用圆角矩形工具(U)。设置圆角半径为5px绘制如下两个图形(颜色#dee0df)并添加如下图所示的样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第9步

画两个圆合并两个图形并应用以下样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第10步

复制刚刚制作的十字形将填充设置为0。添加如下图所示样式并绘制4条短线(颜色#959595)。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第11步

将上面第8-11步的图层编组命名为“Cross”。现在开始制作游戏手柄的操纵杆了。创建一个新图层选择椭圆型工具(U)绘制一个正圆填充颜色#deeodf将填充值设置为0并应用下面所示的图层样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第12步

复制上面的圆圈清除已有的样式将填充值设为0并应用下面的样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第13步

再次复制该圆圈将填充值设为0清除已有样式替换为如下所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第14步

再次复制该圆圈将填充值设为0应用如下所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第15步

最后一次复制该圆圈将填充值设为0应用如下所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第16步

创建新图层选择钢笔工具绘制圆形并应用画笔描边(2px颜色#dbdddc)然后添加如下所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第17步

创建新图层使用“soft round brush”增加一些高亮点。将第11-17步的图层编组命名为“Right analogue stick”。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第18步

复制“Right analogue stick”组放置于图片的另一边重新命名为“Left analogue stick”。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第19步

现在开始绘制屏幕了。选择矩形工具(U)绘制一个大的矩形(如下第1图所示)。然后将填充值设为0应用下面的样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

 

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第20步

绘制另外一个矩形(颜色#ffffff)比上面的矩形略小添加如下所示的样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第21步

在屏幕上添加logo。将19-21步的图层编组命名为“Screen”。到现在为止大体的性状已经出来了。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第22步

绘制一些圆形(一个黑色两个白色)来完成顶部的摄像头(你可以增加一些高亮点)。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第23步

创建一个新的图层选择椭圆形工具绘制一下小圆(颜色#282828)应用如下所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

 

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第24步

复制上面的圆圈并缩小(如下图所示红色圆圈)。将颜色填充为#84919a清除已有样式添加如下所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

 

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第25步

再次复制该蓝色圆圈略微缩放该圆圈。清除之前的内阴影样式替换为如下样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第26步

最后应用soft round brush添加高亮点。将22-26步的图层编组命名为“Camera”。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第27步

创建新图层应用钢笔工具并使用描边(颜色#b7b7b7画笔大小2px)绘制如下所示图形。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第28步

创建新图层选择圆角矩形工具将圆角半径设置为10px绘制一个非常小的圆角矩形。填充颜色为#000000应用如下样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第29步

复制上面的小圆角矩形并将其置于对应的位置。最后在左边添加logo。如下图所示。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第30步

应用与上面相同的样式绘制两个小圆圈(颜色#000000)并做相应的标注。如下图所示。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第31步

将上面的图层编组命名为“Lower parts”。然后建立一个新图层绘制一个较大的圆圈将填充值设为0应用如下所示的样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第32步

用一个房子的图标装饰上面绘制的圆圈(这个圆圈实际上是Home键房子图标可以从网上找到)并在图标下面做标注。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第33步

复制第三十一步中的圆圈(保持填充值为0)清除已有样式添加如下所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第34步

将31-33步的图层编组命名为“Home”。然后创建新图层绘制一个小的正圆填充颜色为#deeodf并应用如下所示的样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第35步

复制上面的圆圈两次并将填充值都设为0清除所有已有样式。然后对复制的第一个图层添加如下第一幅图所示的样式复制的第二个图层添加下面第二幅图所示样式。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第36步

在上面的圆圈中添加I/O图标颜色为#d1200e。并在下方添加文本。如图。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第37步

创建新图层应用圆角矩形工具(圆角半径为6px)绘制一个小的圆角矩形填充颜色为#dee0df重复步骤34-35。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

 

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第38步

添加装饰(TV颜色:#079389字体:Arial/Hekvetica字号:3.5pt)。并在下方添加文本。如图。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

第39步

增加整体高光。打完收工。

Adobe Photoshop CS5鼠绘任天堂WII U游戏手柄实例教程

总结

教程至此结束。你可以增加一些很酷的背景让你的游戏手柄看上去更好希望你会喜欢这篇教程。


相关文章

猜您喜欢

  • Photoshop手绘可爱的卡通头像失量图-超萌的卡通绒毛宠物头像

    Photoshop手绘可爱的卡通头像失量图-超萌的卡通绒毛宠物头像教程中我们学习可爱的头像制作过程一款非常可爱搞笑的头像制作的时候 先把线稿画出来。记得用形状工具或者钢笔工具(选中钢笔工具后在选项栏中选择形状而不是路径)。 最终效果 1、眼睛和..
  • 给情窦初开的青春少女图片制作成仿手绘效 PS美女转手绘教程实例

    PS美女转手绘教程实例:给情窦初开的青春少女图片制作成仿手绘效果 1.打开原图(这个已经磨皮) 2.新建图层改模式为柔光用柔角浅粉色画笔涂抹脸部。如图 3.新建图层用同样的方法给唇上色 4.用黑色小号画笔画嘴角 5.用涂抹工具向内涂抹。如图 6...

网友评论

Copyright 2020 www.Musicdownload3mp.com 【飞音下载站】 版权所有 软件发布

声明:所有软件和文章来自软件开发商或者作者 如有异议 请与本站联系 点此查看联系方式