Principle障眼法揭秘Recommanded by editor
2年前Publish
北京 | UI设计师
这篇文章是关于Principle的冷知识,内容过长建议PC端观看(之前以文章形式发布,由于内容过长,文字间距由文本默认排版过紧凑,因此重新发布)。
Collect
Collect
Collect
Collect
Collect
(图1 圆环由内到外 命名数字递增)
Collect
(图1 圆环由内到外 命名数字递增)
(图2 添加自动跳转事件 复制出新画板)
Collect
(图2 添加自动跳转事件 复制出新画板)
(图3 调整最外圆环透明度 预览效果)
Collect
(图3 调整最外圆环透明度 预览效果)
Collect
(图4 调整画板2命名 调整动画时长及曲线属性)
Collect
(图4 调整画板2命名 调整动画时长及曲线属性)
Collect
(图5 方法1  自动跳转回之前画板,跳转动画属性为「无动画」)
Collect
(图5 方法1 自动跳转回之前画板,跳转动画属性为「无动画」)
(图6 方法2  自动跳转复制新画板,调整新画板素材命名,再次自动跳转回画板1)
Collect
(图6 方法2 自动跳转复制新画板,调整新画板素材命名,再次自动跳转回画板1)
Collect
Collect
Collect
(图7 创建组件 -- 调整比例&透明度 -- 调整时长)
Collect
(图7 创建组件 -- 调整比例&透明度 -- 调整时长)
Collect
(图8 自动跳转得到画板3 -- 调整透明 -- 调整时长)
Collect
(图8 自动跳转得到画板3 -- 调整透明 -- 调整时长)
(图9 组件2 中 动画起始时间向后拖动,使得晚与 组件1 出现)
Collect
(图9 组件2 中 动画起始时间向后拖动,使得晚与 组件1 出现)
Collect
(图10 组件3 中 动画起始时间向后拖动,使得晚与 组件2 出现,返回实例预览效果)
Collect
(图10 组件3 中 动画起始时间向后拖动,使得晚与 组件2 出现,返回实例预览效果)
Collect
(图11 分别调整组件内 画板3 跳转回 画板1 后,无动画触发时间)
Collect
(图11 分别调整组件内 画板3 跳转回 画板1 后,无动画触发时间)
Collect
(图12 简易方法 不用计算时长、不用单独使组件循环)
Collect
(图12 简易方法 不用计算时长、不用单独使组件循环)
Collect
Collect
Collect
(图13 添加自动调整 得到画板2)
Collect
(图13 添加自动调整 得到画板2)
Collect
(图14 调整 画板2 内图层宽度&图层遮挡关系)
Collect
(图14 调整 画板2 内图层宽度&图层遮挡关系)
Collect
(图15 按住⌥拖动复制出画板3 -- 调整图层顺序 -- 添加自动跳转)
Collect
(图15 按住⌥拖动复制出画板3 -- 调整图层顺序 -- 添加自动跳转)
(图16 调整动画属性为线性匀速 -- 调整动画时长)
Collect
(图16 调整动画属性为线性匀速 -- 调整动画时长)
Collect
(图17 按住⌥拖动复制出画板4 -- 调整图层顺序 -- 添加自动跳转)
Collect
(图17 按住⌥拖动复制出画板4 -- 调整图层顺序 -- 添加自动跳转)
Collect
(图18 自动跳转回 画板1 -- 调整图层遮挡关系 -- 调整动画曲线及时长)
Collect
(图18 自动跳转回 画板1 -- 调整图层遮挡关系 -- 调整动画曲线及时长)
Collect
Collect
Collect
(图19 使纹理成为“足球圆形”图层子集)
Collect
(图19 使纹理成为“足球圆形”图层子集)
Collect
(图20 新建色块 -- 调整图层为子集 -- 降低色块颜色透明度)
Collect
(图20 新建色块 -- 调整图层为子集 -- 降低色块颜色透明度)
Collect
(图21 自动跳转 -- 旋转矩形360度 -- 跳转动画曲线/时长)
Collect
(图21 自动跳转 -- 旋转矩形360度 -- 跳转动画曲线/时长)
Collect
(图22 调整「足球纹理」角度 -- 调整动画时长 属性为线性)
Collect
(图22 调整「足球纹理」角度 -- 调整动画时长 属性为线性)
Collect
(图23 红色圆环为例 组件内部构造「具体可参考《Principle轻松玩转路径动画》」)
Collect
(图23 红色圆环为例 组件内部构造「具体可参考《Principle轻松玩转路径动画》」)
Collect
(图24 给投影等图层增加动效细节「旋转-360度」 调整动画曲线与时长)
Collect
(图24 给投影等图层增加动效细节「旋转-360度」 调整动画曲线与时长)
(图25 自动跳转回画板1 -- 调整动画为「无动画」)
Collect
(图25 自动跳转回画板1 -- 调整动画为「无动画」)
Collect
Collect
Collect
(图26 Sketch内新建矩形 通过「旋转副本」制作声波背景)
Collect
(图26 Sketch内新建矩形 通过「旋转副本」制作声波背景)
Collect
(图27 Sketch内画出声波面形形状)
Collect
(图27 Sketch内画出声波面形形状)
Collect
(图28 Sketch中布尔运算与矩形相减得到镂空图层 -- 更改图层颜色)
Collect
(图28 Sketch中布尔运算与矩形相减得到镂空图层 -- 更改图层颜色)
Collect
(图29 添加自动跳转 -- 调整画板2内各素材角度 -- 调整动画曲线 时长)
Collect
(图29 添加自动跳转 -- 调整画板2内各素材角度 -- 调整动画曲线 时长)
Collect
Collect
Collect
(图30 Sketch中提前对异形底板做长度处理)
Collect
(图30 Sketch中提前对异形底板做长度处理)
Collect
(图31 新建矩形 -- 调整图层顺序 放置成为子集 -- 勾选裁剪子图层选项)
Collect
(图31 新建矩形 -- 调整图层顺序 放置成为子集 -- 勾选裁剪子图层选项)
Collect
(图32 点击跳转后移动素材)
Collect
(图32 点击跳转后移动素材)
Collect
Collect
Collect
(图33 通过联动控制遮挡达到3d效果)
Collect
(图33 通过联动控制遮挡达到3d效果)
Collect
Collect
Collect
(图34 添加自动调整 -- 移动位置 -- 调整动画属性及时长)
Collect
(图34 添加自动调整 -- 移动位置 -- 调整动画属性及时长)
Collect
(图35 通过自动跳转加色块位移实现数字递增)
Collect
(图35 通过自动跳转加色块位移实现数字递增)
Collect
(图36 给需添加拖动图层上层新建一个色块 -- 给色块增加拖拽属性)
Collect
(图36 给需添加拖动图层上层新建一个色块 -- 给色块增加拖拽属性)
Collect
(图37 模型为网络来源)
Collect
(图37 模型为网络来源)
(图38 通过联动 调整媒体时间)
Collect
(图38 通过联动 调整媒体时间)
Collect
472
Statement: all the content and comments made by netizens in ZCOOL only represent themselves, and do not reflect any opinions and opinions of ZCOOL.
Report
Share
Collect
Project info
Creative time2019/10/29
收录收藏夹
查看更多
UID
16
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
All Comments0