优草派 > 视觉设计

如何使用pixso制作原型动效?操作步骤有哪些?

李冰琪         优草派

Pixso是一款由国内本土团队打造的一站式协同设计工具,不仅实现了和 Sketch、Adobe XD 的无缝衔接,更基于优秀的组件变体、自动布局、实时协作等特色功能,集UI设计、原型、交互、标注和资源于一身。能够完成产设研全流程,中文语言更符合国人的使用习惯和需求。pixso用来做原型动效很方便,本文小编来为大家分享一下如何使用pixso制作原型动效。

如何使用pixso制作原型动效?操作步骤有哪些?

一、进入原型模式

1、当我们设计好App的原型草图后,需要在界面的右边看板中找到【原型】选项并点击,进入到原型模式。

2、没有选中草图的任何交互热点时,原型看板会默认让用户选择【起始面板】。选择哪个页面作为起始面板,原型就会从哪个页面开始演示。

3、需要注意的是,起始面板的选项与画板的命名同步,所以为了提高原型动效的设置效率,我们需要为画板的命名进行区分。

4、当选中原型中的页面、组件或图标时,需要为它们添加【交互事件】,以设置更复杂的触发条件,【+】为添加;【-】为撤销。

二、设置触发条件与目标

为原型组件添加【交互事件】后,即可根据交互逻辑所需的触发条件,设置要跳转到的目标画板。

除了可以设置【跳转到】的交互目标,还有【打开或关闭弹窗】等可以选择。

三、设置转场动画

设置原型动画的作用在于帮助产品经理、交互设计师、UI设计师以及开发了解产品在真实环境中的外观与相应方式,直接决定了原型动效的用户体验质量。

· 在转场动画中,有多个父级条件可选。除了即时和溶解以外,其他6个条件都可以设置动效出现的来源方向。

· 动效预览功能可以帮助产品经理或者设计师在预览的过程中及时改进更新,得到更好的设计效果。

· 在做原型动效的时候,高阶设计师们很少采用线性状态的运动方式(没有速度变化地运动到另一点),多用加速或者减速动效,因为物体移动的方式会使设计更加生动,让人感到心情愉悦。

· 通过设置入场或出场完成所需的时间,可以做出更生动的动画效果。

以上就是Pixso设计原型动效的操作步骤,操作简单方便。在设计动效的时候需要从用户角度出发,设计出用户体验感更高的动态效果。

  • 微信好友

  • 朋友圈

  • 新浪微博

  • QQ空间

  • 复制链接

取消
5天短视频训练营
新手入门剪辑课程,零基础也能学
分享变现渠道,助你兼职赚钱
限时特惠:0元
立即抢
新手剪辑课程 (精心挑选,简单易学)
第一课
新手如何学剪辑视频? 开始学习
第二课
短视频剪辑培训班速成是真的吗? 开始学习
第三课
不需要付费的视频剪辑软件有哪些? 开始学习
第四课
手机剪辑app哪个好? 开始学习
第五课
如何做短视频剪辑赚钱? 开始学习
第六课
视频剪辑接单网站APP有哪些? 开始学习
第七课
哪里可以学短视频运营? 开始学习
第八课
做短视频运营需要会什么? 开始学习
【原创声明】凡注明“来源:优草派”的文章,系本站原创,任何单位或个人未经本站书面授权不得转载、链接、转贴或以其他方式复制发表。否则,本站将依法追究其法律责任。

客服热线:0731-85127885

湘ICP备19005950号-1  

工商营业执照信息

违法和不良信息举报

举报电话:0731-85127885 举报邮箱:tousu@csai.cn

优草派  版权所有 © 2024