恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
【笔记】AE Curva插件
0.0°
2019-01-22 原创文章 经验/观点 举报 7975 271 427 35

本篇笔记适用于有一定 AE 基础以及处在动画进阶阶段的同学食用<( ̄︶ ̄)>


※ 码字截图啥的挺辛苦,转载请注明作者与出处哈~,阿里嘎多※

       

       米娜桑~我是翔君,这篇笔记介绍一下文字书写类动画 ~(•̀ ω •́ )~ ;提起文字书写动画最常见的传统方法应该是蒙版走线类的动画,但是蒙版走线的方法只能适用于笔触粗细相同的字体,我们就叫他乖巧的字体,例如:

Image title

       但是大部分的手写字体并不是等粗的啊啊啊啊啊O(≧口≦)O,对于爱搞事的字体难道要一帧一帧的扣蒙版动画么?(π__π)

Image title

Image title


       辣么~神器来额~~就是本文分享的AE Curva 插件,一键操作,傻瓜式k帧,嗷嗷提升你的工作和学习的效率(•̀ᴗ•́)و ̑̑



------------------------  我是萌萌哒分割线  ˋ( ° ▽° )   ---------------------------



首先先来说一下插件的安装:


1,翔君已经把插件打包好放在了文末的下载链接里了,内容包含如下:


2,在AE未启动的情况下将压缩包里的 Curva_scriptUI.jsxbin 文件放置到你电脑 AE 安装目录下的脚本文件夹中(大部分的脚本类插件都是这么安装的,例如翔君的文件放置目录为【D:\Program Files (x86)\adobe\Adobe After Effects CC 2014\Support Files\Scripts\ScriptUI Panels】)

将文件 Curva_regular.jsxbin 放置到【D:\Program Files (x86)\adobe\Adobe After Effects CC 2014\Support Files\Scripts

这里要注意两个文件的黏贴位置不能错误否则插件可能会出错 (。・ω・)ノ゙ 用苹果的小伙伴们安装方法也是一样的,把对应插件文件放在安装目录的脚本文件夹里就ok啦~

Image title

3,启动AE 在 编辑-首选项-常规 中找到下图项“允许脚本写入文件和访问网络”在前面打钩


4,在 窗口-Curva_scriptUI 选项中就可以调用书写插件了,在第一次打开插件的时候会要求填写序列号,序列号就在打包的 txt 文件里,蓝后就安装完成辣ヾ(o◕∀◕)ノ 面板是下图酱婶的



------------------------  我是萌萌哒分割线  ˋ( ° ▽° )   ---------------------------


Curva的使用方法:


1,首先我们先在 ae 中新建一个文字图层,写入一个比较有手写风格的文字


2,选择文字图层右键-从文字创建形状,这样我们会得到一个形状图层


3,点击形状图层前面的小三角在内容栏里找到“c”文字轮廓的路径(path),选中路径

Image title

4,下面重点来啦~ 点击 Curva_scriptUI 插件面板上的 animate 激活插件后弹出下面的面板,在上面的 c 路径面板中选择一个锚点作为起点单击选中,然后点击蓝色的方形按钮,再在路径面板上选择两个结束的点,点击ok 等待大约3-5秒,(就像下图 gif 酱婶操作 (´・ω・`)

Image title

5,下面就是见证奇迹的时刻  ≖‿≖✧

Image title


Curva 设置选项及工作原理:


1,路径面板栏

       窗口菜单白色虚线最上面的那一部分,也就是之前选择一个起点和两个终点的部分,需要注意的是:

※ 1 ※ 当选择一个锚点作为起点后,点击蓝色方形按钮后路径上会有一小段消失了(具体为什么会消失在下面的工作原理部分会详细说明),两端的锚点会变为蓝色,不可再被选择;而其他为绿色的锚点可以被选择。

Image title

※ 2 ※ 选择的两个终点必须相连否则效果不是很好,因为两个终点之间的那部分路径就是笔画的最后一笔;选择好两个终点之后终点与起点之间的两端路径分别会变成紫色蓝色,这也就是要生成动画的部分;但是有些时候当文字转化为形状图层后,所生成的路径并不一定满足“一个起点两个终点”的原作,这时候就要手动添加锚点以达到满意的效果 (´・ω・`)。

Image title

特殊强调的是:Curva 插件只能用于与形状图层的路径上,矢量蒙版是不行滴!!!


2,速度设置栏

      夹在两条白色虚线中间那部分~

       在下拉菜单中 Curva 提供了一些运动曲线作为参考,点击旁边的蓝色按钮还能自己编辑运动速度曲线,但是翔君还是建议大家采用匀速运动,之后采用时间重映射的方式调节速度,也方便之后的编辑。

Image title

3,时间设置栏

        最下方的一栏~

       在 Duration(sec)下面的输入框里可以设置手写动画的时长,以秒为单位,建议时长控制在 0.4 ~ 1.2 秒之间,根据笔画的长短而定;

       form current frame  后面的 √ 勾选后将在时间指针处开始关键帧动画,否则是在合成的起点开始动画

       reversed 勾选后书写动画将反向进行也就是擦除动画~

Image title


然后说一下 Curva 的工作原理:


Image title

1,以上面的“C”为例,这样能好懂一些 ( ̄▽ ̄") ,在选择好起点之后(橙色点),将起点相邻的一段路径作为起笔路径保存在第一个缓入关键帧当中(红色路径);这也是为什么选择起点之后会有一段路径消失的原因;

2,之后选择两个终点后(红色点),插件默认将两个终点之间的一段路径存入最后一针关键帧(绿色路径),将起点与终点之间的路径分为两条(紫色路径蓝色路径),也就是笔画的两侧;然后插件自动对紫色路径蓝色路径进行每一帧的 k 帧动作。


3,限于 Curva 只能作用于单一闭合路径,当遇到如“R”这样的文字就需要对笔画进行拆解然后分别执行插件动作。

Image title


4,当然 Curva 也不是万能的 (°□°;) ,对于无法形成闭合路径的书法类和比较夸张的字体还是需要依靠蒙版动画来实现书写效果的。

Image title

当然 Curva 除了一些喜欢搞事的字体解决不了,大部分的书写动画还是OJBK的~ 下面是翔君做的三个小实例:

1,具有鲜明手写风格的字体:

Image title

2,规范的logo类书写动画:

Image title

3,当然不一定是文字,只要是闭合的路径都可以利用 Gurva 创建动画效果,例如 例 3 中 UI 中国LOGO的小动画的六边形蓝色背景:

Image title

最后总结一下:

       Curva 相对与其他第三方插件来讲体积小,操作调试起来较为方便;但正是体积大小的关系也局限了 Curva 的特效种类,不过配合上其他内置特效依然有不俗的表现,同时也可以大幅的提升工作效率。

        最后说点絮叨的话~ 要是放在以前,插件玩明白了就扔一边了,过一段时间也就捡不起来了,还得在研究一下;也因为这样翔君开始记起了分享笔记,希望对小伙伴们有所帮助吧~也是为了自己的二次学习,温故而知新嘛~哈哈哈~以后翔君也会不定期的分享一下资源类和教程类的笔记,有需要的小伙伴可以关注一波哦~ 好啦下篇笔记见( ^_^ )/ 拜拜~





Image title

Image title

更新:2019-01-22

下载
收藏

271人已收藏

烨翔君

蔚来汽车 界面体验设计师

  • 36

    作品

  • 2300

    粉丝

  • 424

    关注

  • OPPO · GORGEOUS GREY
  • 【主题】WPS Office 2019 NewYear
  • 【字体】滑翔造字计划·100+
  • 【2018】翔君の作品集

    猜你喜欢

      2019-01-22 原创文章 经验/观点 举报 7975 271 427 35

      【笔记】AE Curva插件

      0.0°

      你确定要举报【笔记】AE Curva插件

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年11月30日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      427
      271
      35

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录