美文网首页玩转动效设计UI/交互设计规范
动效篇-AE之UI动效(流线粒子buling~buling~)

动效篇-AE之UI动效(流线粒子buling~buling~)

作者: redBlue_ | 来源:发表于2017-04-10 18:26 被阅读306次
    fff.jpg

    今天分享下粒子buling~buling~的制作方法!!!

    最终效果如下

    文中重要的插件和快捷键见片尾(有惊喜)~

    流线粒子buling~buling教程

    新建纯色,新建字体princess

    钢笔工具分别勾勒出每个字母的路径,一个字母一个形状图层

    复制一层p,把原始的p关掉


    绘制出的新路径延长至如图


    绘制形状

    给蒙版路径key帧,在关键帧上粘贴路径


    点掉关键帧


    添加3D Storke效果(需安装Trapcode插件,链接见顶部),并调节Thickness属性


    删除形状图层p2


    Screen Capture on 2017-04-10 at 11-11-58.gif ![]

    帧挫开越长,形状的尾巴越长


    加缓动,调曲线


    复制图层,下边一层改为浅蓝色,把start关键帧往后挫

    同理,复制图层,改为粉色,把start关键帧往后挫,效果如下

    S

    绘制第二条流线,新建图层,钢笔绘制路径,添加3D Storke效果(需安装Trapcode插件,链接见顶部),并调节Thickness属性,start/end打关键帧开始为0 结束为100,start往后挫帧,复制图层修改颜色,start往后挫帧,效果如下

    当流线滑过砸到字母i上面那个点时key帧,添加Motion v2插件中的EXCITE效果

    效果如下


    找到形状图层rn和图层p,添加修剪路径(不熟悉修建路径的点这里http://www.jianshu.com/p/5627ad55107f),当流线滑过笔划时让字母出现


    效果如下

    复制两层i,给修建路径key帧,挫帧,改色(基本同上)


    在添加第三条流线,新建图层,钢笔绘制路径,添加3D Storke效果(需安装Trapcode插件,链接见顶部),并调节Thickness属性,start/end打关键帧开始为0 结束为100,start往后挫帧,复制图层修改颜色,start往后挫帧,效果如下

    用第三条流线带出字母c,选择形状图层c添加修剪路径,需要调节偏移路径(符合动势)


    效果如下


    字母c闭合时做些小细节,用Motion v2中的BURST效果做水滴飞溅



    效果空控件中用到的属性及参数



    效果如下

    字母ess制作方式大同,不再重复说明,下面来加一下粒子效果


    复制图层白色纯色1,新建预合成命为粒子发射器,并点击3d按钮如图


    新建绿色纯色图层,加粒子特效(需要安装插件)


    调整粒子属性如图


    图片.png

    修改粒子数调整为80000



    调整属性Velocity值为30
    整体效果如下

    空气阻力调整为1如下图

    调节属性Size over Life


    进入粒子发射器与合成修改粒子颜色为浅蓝色

    调整Color Random(颜色随机)属性为20

    给图层添加发光效果
    ![](http://upload-images.jianshu.io/upload_im ages/2666102-8eb7673e7c2a04ab.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
    调整发光效果数值如图

    最终效果


    UI动效常用插件下载与安装

    Trapcode插件链接地址:
    https://pan.baidu.com/s/1i4ZrhEd
    https://pan.baidu.com/s/1c2AEQ9U motion 2插件链接
    注册序列号:
    Trapcode Tao 90509642123479776933
    Trapcode Mir V2.1.2 85079585234586664989
    Trapcode Particular V2.5.0 92608846345644048269
    TrapCode Shine v2.0 92338513256767241817
    TrapCode 3D Stroke v2.6.7 91588738256767692766
    TrapCode Form v2.1.3 8446-8918-2345-6022-3856
    TrapCode EchoSpace v1.1.6 91769344123491994523
    TrapCode Horizon v1.1.7 87419480123494067600
    TrapCode Lux v1.3.5 87689194123456089091
    TrapCode Sound Keys v1.3.0 88419208123489637676
    TrapCode StarGlow v1.7.0 86068670256777585702

    UI动效常用快捷键(更新中)

    enter重命名
    Com+Shift+Alt+Y新建一个空物体层
    Com+;显示/隐藏参考线
    Com+Shift+Alt+;锁定/解锁参考线
    Com+Y 新建固态层
    Com+D复制图层
    Com+Shift+Y 修改固态层属性
    Shift+Com+【/】置顶/置底
    Alt+[/] 裁剪时间线
    J/K 向前/后一个关键帧
    ~最大化当前面板
    Com+Shift+A 图层全部不选
    Com+Shift+D把一个图层一分为二
    B/N合成 开端/结束 时间
    Com+M渲染合成
    I/O移动时间线到层的入点/出点Ç
    Com+Shift+C把选择层作为合成
    U/W显示关键帧所在属性(被key),显示所有属性
    +/- 时间轴单位(视觉)缩放
    Com+Shift+R 旋转角度
    </>缩小/放大视图
    Alt+{/}向前后剪切
    Com+N 新建合成
    Com+M生成影片
    Com+I 导入素材
    G自由绘制蒙版
    Q默认矩形

    相关文章

      网友评论

        本文标题:动效篇-AE之UI动效(流线粒子buling~buling~)

        本文链接:https://www.haomeiwen.com/subject/ferhattx.html