【Spine】眨眼动画
Spine 眨眼动画
眨眼动画的思路一般是序列帧播放眨眼或者网格变形,这里以Spine为例介绍第二种网格变形的方法
目录
- Spine 眨眼动画
- 眼睛图层分层
- 上眼睑和眉毛:路径约束
- 眼珠和眼白:剪裁
- 眨眼动画
- 效果样例预览
眼睛图层分层
如果美术给到的素材本身就是分层可以忽略这部分。但是个人有时候会从漫画抠一张没有分层的图自己补图再分层,所以给可能有需求的人分享一下自己的推荐分层
- 眉毛
- 上眼睑
- 二层上眼睑(可选)
- 眼珠高光(可选)
- 眼珠
- 眼白
- 下眼睑(根据情况看是否需要分这层)
效果的主体部分是上眼睑、眼珠和眼白三层,再加上眉毛和下眼睑完全可以算一个完整的眨眼动画了。其它的眼珠高光等等都是用于增加层次感的,分的层越细致,效果越好
上眼睑和眉毛:路径约束
眉毛与上眼睑思路相差不多,这里以上眼睑为例,先为所有的网格布线
mesh 布线
在上眼睑处创建一条路径以及多个骨骼,骨骼用于控制网格变形,路径用于控制骨骼
为上眼睑创建路径和骨骼
选中上眼睑的所有骨骼,为它们添加路径约束,注意旋转选择“链”或者“链缩放”
路径约束选择链或链缩放
把骨骼绑定到对应 mesh 上,即可通过路径控制上眼睑了
眉毛、下眼睑都可以参考这个思路,参考样例如下
路径约束控制部分
眼珠和眼白:剪裁
新建一个插槽,里面新建一个剪裁,画出剪裁的轮廓
ps:Spine 的剪裁(Clipping)其实和遮罩差不多,用别的一些软件习惯了个人下意识更想叫遮罩一些
创建剪裁
Spine 的剪裁需要在绘制顺序中调整,剪裁图层默认会对它之上的所有图层进行剪裁,这里只影响眼珠和眼白的内容,所以需要在绘制顺序中调整并选择对应的结束插槽,剪裁图层就影响从剪裁图层开始直到结束插槽的区域
调整绘制顺序并设置结束插槽
眨眼动画
最简单的眨眼就分为两个阶段,闭眼和睁眼,具体k帧看需求。
上眼睑向下运动幅度更大,下眼睑可以稍微向上运动一小点,比例差不多3:1或者4:1
闭眼位置参考
一般来说会把闭眼相较于睁眼k的较快一点
摄影表
至于曲线方面,个人喜欢这样拉
曲线图表
效果样例预览
参考眨眼动画预览
【Spine】眨眼动画相关推荐
- android 骨骼动画库,cocos creator spine骨骼动画组件使用
1: 掌握sp.Skeleton组件的使用; spine骨骼动画工具 1: 骨骼动画: 把动画打散, 通过工具,调骨骼的运动等来形成动画 2: spine是一个非常流行的2D骨骼动画制作工具 3: s ...
- Unity Spine SkeletonGraphic 动画重复播放 过度残影透明渐变Bug 解决方案
Unity Spine SkeletonGraphic 动画重复播放 过度残影透明渐变Bug 解决方案 不推荐使用SetToSetupPose和Setup Pose相关,代码直接贴上 /// < ...
- Spine 骨骼动画查看器 Skeleton Viewer_官方文档中文版
Spine 骨骼动画查看器 Skeleton Viewer_官方文档中文版 大家好,我是笨笨,笨笨的笨,笨笨的笨,谢谢! 欢迎加入专业Spine技术交流群 Spine2D骨骼动画 7708065 此文 ...
- Spine骨骼动画知识普及
一些基本概念 以下将介绍一些骨骼动画的基础概念,便于对骨骼动画不甚了解的童鞋(比如技术)进行扫盲.已经熟悉骨骼动画的童鞋可以直接跳过. 动画的基本原理 动画,顾名思义,即是能动的画,画能随着时间的推移 ...
- Unity Spine切换动画
Unity使用Spine切换动画时会自动加入融合,这时动画会产生过渡的效果,如果想直接切换则按下图操作即可 把Default Mix Duration设置为0 public void Awake(){ ...
- spine 所有动画的第一帧必须把所有能K的都K上
spine 所有动画的第一帧必须把所有能K的都K上.否则在快速切换动画时会出问题. 转载于:https://www.cnblogs.com/wantnon/p/4519882.html
- Spine变色动画在unity中失效的问题
最近美术同事做spine变色动画的时候打开了Tint Black选项来做图片颜色过渡变化的效果.但是到了程序这边在unity中显示的是灰度,没有颜色变化. 在unit中有问题的spine动画材质图片如 ...
- Android繁星眨眼动画效果
分享一个类似星星眨眼的动画效果实现方式.这里涉及到两个类,看官可直接拿来用. StarView.java import android.content.Context; import android. ...
- 用计算机做动画效果,ps制作眨眼效果,用ps制作眨眼动画效果
AE是强大的视频制作软件,那么你知道如何快速的制作酷炫的卡片擦除效果么?下面让我们跟着以下图文步骤,学习下制作的方法. 工具/材料 After Effects CS4 操作方法 01打开AE软件,创建 ...
最新文章
- 比目前世界上最快的超级计算机快 4 倍,英伟达这波玩大了!
- php 文档标示规范,php标识
- 【Android 安全】DEX 加密 ( Application 替换 | 获取 ContextImpl、ActivityThread、LoadedApk 类型对象 | 源码分析 )
- ehcache springboot_Spring Boot应用缓存实践之:Ehcache加持
- 【Android】Activity的四种launchMode
- 练习利用LSTM实现手写数字分类任务
- php数组匹配匹配里面的值,php – 比较数组并搜索匹配的值
- Flink学习笔记:搭建Flink on Yarn环境并运行Flink应用
- 基于物理着色(二)- Microfacet材质和多层材质
- 【渝粤教育】21秋期末考试基础会计10258k2
- 10_android打包的过程
- 计算机系统论文题目,计算机系统维护毕业论文题目(572个).doc
- PCM数据格式你该知道的一切
- 投资:螺纹钢研究框架
- SecureCRT配置详细图文教程
- Excel函数——小数点计算
- 苹果手机话筒声音小怎么办_苹果8通话声音小,苹果8听筒声音小怎么办
- Unity Shader - URP ShadowCast ShadowRecieve - 投影 和 接受阴影
- 人类简史 从动物到上帝
- 关于内外网数据同步解决方案