您现在的位置:   首页 >> 新闻中心 >> 原型设计

ProtoPie进阶教程:随机函数的学习及应用

发布人:www.yunke.ai 发布时间:2021-01-01 147 次浏览

随机效果是动效设计中较为常用的基本动效,本文将详细介绍ProtoPie中的三种随机函数的使用方式,并利用随机函数进行随机抽号案例的制作。

随机效果

Protopie进阶教程--随机函数的学习及应用

随机效果

日本设计师 Kazuki Akamine 按照常用运动图形中提取出的基础要素的特点,将所有基础动效分为了 14 个系列,便于设计师运用和学习,这其中就包括随机动效(脚本系动效)。随机指每一帧的返回值都是随机值的函数。将其使用在某一界面元素的位置属性上,这样每一帧对象都会移动到不同的地方,形成gif图中非连续性的激烈运动。除了位置属性,还可以应用在文本图层上,或是结合缩放属性实现多种多样动效效果。

Protopie进阶教程--随机函数的学习及应用

拓展–文本图层随机效果

Protopie进阶教程--随机函数的学习及应用

拓展–缩放属性随机效果

ProtoPie的随机函数

ProtoPie软件可以在表达式中添加随机函数来实现随机效果,软件共提供了 3 种可以使用的随机函数:

Protopie进阶教程--随机函数的学习及应用

ProtoPie中的随机函数

具体使用可以在软件中任何支持表达式添加的地方进行添加,实现对图层具体属性的随机赋值,使用过程中我这边在实际学习中有两个使用技巧分享给大家:

(1)利用反复实现连续的随机赋值

在随机动效说明动图中可以看到小球实际是在不断的做随机位置的移动,要是实现这样的效果除了使用随机函数外,还需要打开具体设置中反复开关,使其不断进行位置的随机移动。

Protopie进阶教程--随机函数的学习及应用

利用反复的连续随机赋值

(2)关联变量实现多属性同样的随机变化

在缩放属性随机效果中,有圆形的随机缩放效果,如果分别对宽度和高度添加随机函数,无法实现高度宽度的同步随机缩放,所以这里需要增加一个变量,对变量赋值随机函数后,再将宽度和高度的缩放比例与变量进行关联便可以实现等比缩放。同理当需要对多个基础属性的参数添加同样随机变化时,都可以使用添加关联变量的方式来实现。

Protopie进阶教程--随机函数的学习及应用

关联变量实现多属性同步随机赋值

随机抽号案例效果

Protopie进阶教程--随机函数的学习及应用

案例实际效果

在了解随机函数的使用方法后,可以结合实际案例来实操一下。本次的案例是一个随机抽号的效果,抽号机器中有0到9共10个数字小球,点击抽号按钮后,小球便随机的在某一具体区域内进行随机的变化,直至生成一个具体的随机数字小球,点击再来一次可以重新进行数字抽取。

具体实现步骤