-
Q1:遮罩通过 SVGA 导出后没有效果怎么办?
-
Q2:Sketch Cloud 不能使用之后,该怎么协同使用组件库?
———-
Q1:遮罩通过 SVGA 导出后没有效果怎么办?
提问人:来自厦门的UI设计师黄烁
问题阐述
这位朋友需要通过 SVGA 输出一个卡片滑动效果动画,效果如图:(为避免有可能涉及群友设计作品的版权问题,所有的示例图我都将以我个人作品样式进行模拟演示,该案例源文件可在公众号自取,方便大家查看图层,易于理解)
他运用了 AE 常规的制作遮罩动画的方法:
-
步骤1:将卡片组搭建为预合成;
-
步骤2:建立遮罩层,采用图层 Alpha 遮罩“卡片组预合成”;
-
步骤3:通过给“卡片组预合成”的位置属性k关键帧,完成滑动效果。
在 AE 窗口中浏览时,动画正常。但使用 SVGA 导出后,遮罩无效果。最终导出结果如图:
问题解析
此时路径蒙版不同于图层 Alpha 遮罩的方式,路径蒙版属于“卡片组预合成”的子级,位置属性会跟随父级“卡片组预合成”变动。所以如果采用前面常规图层 Alpha 遮罩的方式,给“卡片组预合成”的位置属性K关键帧,我们会发现,蒙版会跟着父级移动。效果如图:
所以想要实现卡片移动的效果,就得保持路径蒙版位置不变,而让内部的卡片进行位置移动。因此位置属性的关键帧就得K在预合成内部。
这样就通过路径蒙版的方法达成了动画效果。我们再次用 SVGA 导出,达成理想效果:
*友情补充注意点
-
关于SVGA:《工作案例分享:SVGA动效落地的使用与避坑》
-
关于Lottie:《了解图标落地,让前端再爱你一次》
———-
Q2:Sketch 协同使用组件库的问题
提问人:来自厦门的UI设计师黄烁
问题阐述
问题解析
-
上传阶段:由管理员搭建好 Symbol Library(组件库),发布到 Sketch Cloud;
-
共享阶段:管理员在 Sketch Cloud 项目中通过 Sketch 账号添加成员,并赋予指定权限;
-
接收阶段:被添加的成员在 Sketch 中激活第三方组件库,完成共享;
-
维护阶段:今后更新组件库,成员会收到 Symbol Library 的更新通知。
-
第一,用 Sketch 的朋友应该都拥有一个 Apple ID(因为 Sketch for Mac 嘛),全员拥有账号,就不需要团队成员去重新注册;
-
第二,每一个 Apple ID 都拥有 5GB 的 iCloud 免费储存空间,足够存好多个 Sketch 项目组件库文件了;
-
第三,苹果在安全性方面做得一向比较好,并且 iCloud 共享文档会实时更新,成员可以实时接收到组件库更新提醒。
1、上传阶段:存储组件库文件到 iCloud;
2、共享阶段:右键 Sketch 文件,点击“共享-共享文件”,可以通过多种方式邀请成员,并且可以设置成员权限;
3、接收阶段:管理员通过某一种方式邀请成员后,通知成员,成员可以接收共享文件到自己的 iCloud 中(此处以链接分享为例);
4、维护阶段:成员手动添加组件库文件到Sketch中。当拥有“可更改”权限的成员修改了组件库文件后,保存覆盖,共享文件会在所有成员的 iCloud 中实时更新。
评论回复