UI设计,设计有立体感的手机APPUI展示模板_图文

(19页)

'UI设计,设计有立体感的手机APPUI展示模板_图文'
本文是教你制作有厚度感和立体感觉的UI展示模板,虽然一般 这种效果用3D软件做比较好,但是并不是所有设计爱好者都会 用,而且有些展示效果要求可能不需要那么高,所以我们今天就 简单用PS来打造这种效果。之前搜索时发现网上居然没有这个教程,所以今天就简单分享一 下自己的制作过程。供新手们参考,请大神自觉飘过就好!! !首先我们来看一下最终效果,忽略像素,只讲步骤(图片因为缩 小了所以不清楚) 首先,我们打开PS,因为我们站酷的宽是900px,所以我新建 一个宽度900,高度700的画布,然后随便设置一个背景颜色就 好,这里设置为#e0e0e0名称(N):未标题?1名称(N):未标题?1BBIR大小:1.80M□ RW web颜色祈的当前® H: 10■ Os: |o |%O B: |88 I %OR:更 .0 6: [224]OB: |2249 [eOeOeO ■O a:O b:M: 11y: [TF K:匸然后我们在画布上根据自己想要的效果先画儿个框框,这是方便 我们待会排版我们设计好的页面,注意近大远小,用钢笔工具画 形状即可,方便后续调节,我画好的框框如下:(这里我们当然也可以选择从网上下载素材或者直接P0 一张人 家做好的效果图来打底,因为我们只需要这个形状而己)下面就可以导入一张你做好的界面效果图,并且ctrkt将它缩小并旋转一个角度使它与我们画的形状一边对齐fr 32 f -> <-rr !A| OfiTjfi■ ift k*意天利语T□黑体?簡中等下而我们ctrl+t然后右键选择斜切,拖动锚点将另一边重合SA爲肖扭曲旋转180度顺时针旋转90度逆时针旋转90度水平画转 垂亘翻转6|> J然后将另一点也拖动使上面的边重合,然后我们继续调整这两点 将自己的图片与画好的形状完全重合(斜切时一定要向同一个方向切,不要乱拉鼠标,既难操作又容 易变形严重) 切好后回车得到我们的图片,然后将该层复制一层,并将复制好 的层下移一个像素即可按照同样的步骤,都是复制新的图层,然后将新的图层下移一个像素,我们这里复制了四层,这样图片就看起来有了厚度感PS 文件(D嚴(D彦像①ESO)文字CO曲5(S滤傥(D 3DQ)视田M奇口理I帘助凹「显您横控件 0 "卫I吕呈吕 S A !+ 0* M cl5 3Olfct: 0 ◎彫*?QoOOOOOOSft-38中等X 18%T« X字符 三一 De/icel弋TT Tr T4 Tx T T虜示教程© 101% (安卓界直1拷贝4 RGB/8#) ? *意大利语rr 100% 臂6像素1T 32®$ ?逡猱他期印ySB良EEQ旺 S B HO 3S径凰层 |? ? jq 牌 V u © rr 正谢 ―二不疥聽安卓畀而1安卓弄面I拷贝安卓霁面1拷贝2安卓畀面1垮贝3;形状bj 下面我们要为它增加阴影来制造空间立体感选择第…个图层,也就是最上面的界面图层,双击打开图层样式,为它添加一个距离和人小为20的投影,不透明度选择50%效果如下,是不是已经有了一丢丢立休感啦 显示賈換控件戸"匹吕 冉占I S 5: bMMH clc 3。虺:0 ◎卷 % ■<色板豳P” & 101% (安至界面 1, RGB/8#) ? X字袴段落屋性*"丨历史亡舆体?简中尊 ?■o安卓畀面1拷见安卓畀面[淸贝O安卓界面1拷贝O安。界面1垮贝O » ■形状0数果O投彩冃整样弍孩色勸0调整HI 血 E1EQ IQ K2 B IX) a安卓界面1然后我们右键该图层拷贝图层样式,将它粘贴给最下面的界面图层拼合图像混合选项…复制图层…删陰图层从图层転组… 快速导岀为PNG导出为???转换为智能茫鮫 通过拷贝新建智能对象 编辑內容重趣姦坟件…重新链接到库图形??替換内容…导出内容…转誤为也g??无取色红色绿色Sfe灰色 明信片从所选爵新建3D模型新建3D魁栅辑化图层 栅枠图亘且 停用閒层蒙版启用矢星蒙版创建隽貼蒙版齒囹层 磐齒閒层糊占昌层且 清陰图层样式 从隔离禺层释放 台并囹层 合并可见图言复制图层…删陰图层从图层転组… 快速导岀为PNG导出为???转换为智能茫鮫 通过拷贝新建智能对象 编辑內容重趣姦坟件…重新链接到库图形??替換内容…导出内容…转誤为也g??无取色红色绿色Sfe灰色 明信片从所选爵新建3D模型新建3D魁栅辑化图层 栅格化閒层且停用閒层蒙版启用矢星蒙版创建隽貼蒙版粘贴图层样式从隔离禺层释放台并囹层 合并可见图言下面就是我们得到的效果啦,神奇有木有fi尸盘7花T151% 前:利语 卡细爭冏 :© BS安卓界面1楮贝o B3安卓畀面1拷贝渤q调整o ES安卓畀面1 o效果 。投影_。蚩影然后我们就可以按照上面的方法一次将图片导入并制作,做好后隐藏形状图层并调整界面位置,得到最终效果喜欢就点个赞吧!您每一次的肯定都是对我的鼓励!
关 键 词:
UI设计设计有立体感的手机APPUI展示模板_图文
 天天文库所有资源均是用户自行上传分享,仅供网友学习交流,未经上传用户书面授权,请勿作他用。
关于本文
本文标题:UI设计,设计有立体感的手机APPUI展示模板_图文
链接地址: https://www.wenku365.com/p-43446190.html
关于我们 - 网站声明 - 网站地图 - 资源地图 - 友情链接 - 网站客服点击这里,给天天文库发消息,QQ:1290478887 - 联系我们

本站为“文档C2C交易模式”,即用户上传的文档直接卖给(下载)用户,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有【成交的100%(原创)】。本站是网络服务平台方,若您的权利被侵害,侵权客服QQ:1290478887 欢迎举报。

1290478887@qq.com 2017-2027 https://www.wenku365.com 网站版权所有

粤ICP备19057495号 

收起
展开