快捷搜索:  汽车  科技

ps空间特效合成教程(教你打造流畅酷炫的动态演示)

ps空间特效合成教程(教你打造流畅酷炫的动态演示)步骤 3完成后效果如下图。步骤2视图>新建参考线,垂直,间隔15px,左面4条,右面4条视图>新建参考线,水平,在40px,128px,220px处设置水平参考线。

现在动态演示已成趋势,相比静态,更直观,更能展示产品效果。 今天 设计芒果就教同学们如何利用Photoshop制作如此酷炫的动态演示。软件界面是中文版的呦,再也不担心看不懂了。

静态设计

步骤1

新建画布

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(1)

步骤2

视图>新建参考线,垂直,间隔15px,左面4条,右面4条

视图>新建参考线,水平,在40px,128px,220px处设置水平参考线。

完成后效果如下图。

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(2)

步骤 3

在画布上添加状态栏(也就是第一条水平参考线上方40px处),状态栏各位可以从源文件里面直接复制获取。

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(3)

下一步,创建新图层,然后在40px和128px之间创建选区,填充颜色#2c3137.

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(4)

步骤4

在标题栏添加应用的标题和Logo

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(5)

步骤5

在128和220px水平参考线之间的区域创建选区,填充颜色和上一选区颜色一样。

然后在两个区域之间添加2px,不透明度80%的亮色的分割线。

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(6)

步骤7

选择文字工具,添加分类。

为了暗示所选中的分类,所选中的分类要用粗体、亮色。

其他用普通粗细,暗色。

然后“杂志”复制一份,使用粗体 亮色,然后不透明度设置为0%,暂时隐藏

“首页复制一份”,常规体 暗色,不透明度设置为0%,暂时隐藏

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(7)

步骤8

背景填充为标题栏和菜单栏的颜色,确保背景图层处于GUI元素下方。

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(8)

步骤9

在主题区域中,划出如下图选区,填充颜色#3f464e

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(9)

添加图层样式,描边,内阴影,外发光。具体参数如下。

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(10)

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(11)

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(12)

设置图层样式内发光。(图层样式若不满意可不设置)

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(13)

添加图像,然后创建剪贴蒙版.

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(14)

然后添加文本图层,利用尺寸,颜色,粗细,来营造清晰的阅读层级。

最后添加几个按钮图标。

ps空间特效合成教程(教你打造流畅酷炫的动态演示)(15)

嗯 最后也就出来了 今天的分享也就到这里了 希望可以帮到有需要的小伙伴。分享到这里了芒果还有一些关于ps的教程以及素材可以分享给大家,大家可以来领取。

领取方式:

关注楼主芒果

领取资料

ps教程

平面设计素材

猜您喜欢: