Adobe Photoshop CC和Premiere Pro做UI动效

我刚接触UI动效的时辰,用的都是PS(Adobe Photoshop CC 14.0)和AE,可是AE对电脑要求很高,只能生当作序列才导入PS生当作gif图 。 后来我用pr做一些简单的结果也可以生当作,对电脑要求不高,很快可以做一些工具出来,展示本身的作品,这里是一个简单的小icon,用PS(Adobe Photoshop CC 14.0)和PR(Adobe Premiere Pro CC2017)做的 。

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

需要这些哦
Adobe ?Premiere Pro CC 2017
Adobe Photoshop CC 14.0
方式/
1【Adobe Photoshop CC和Premiere Pro做UI动效】打开PS,新建一个500*500像素  72分辩率 颜色模式RGB通道 的白色画布

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

2点击左边矢量东西中椭圆东西,画一个400*400的圆,把填充颜色去失落,把边的颜色打开,居中到画布,并复制三个图层,一共四个

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

3埋没其余三个图层,用左边白色箭头,选中圆的四个点此中两个删除失落,就剩下一共半圆弧线,依次把剩下三个圆的点也删除失落

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

4全数显示,选中全数半圆弧,依图所示更改设置,把边线加粗,添加一个布景色
最后一个一个调整他的渐变颜色的角度偏向,如图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

Adobe Photoshop CC和Premiere Pro做UI动效

文章插图

5把所有图层都栅格化图层,图层全选-右键-栅格化图层,把半圆的图层归并,留一个有颜色的布景图就行,保留当作psd文件

推荐阅读