两分钟认识一款把 Sketch 变成 Principle 的插件:Diya

随着 Sketch 在版本49中增加了 Prototyping 功能,试图给 Sketch 安装「原型」义肢的插件也越来越多。前几天发现一款有意思的插件 Diya,安装后的 Sketch 神似 Principle。插件的 slogan 是「Bring your ideas to life」,为你的设计画龙点睛。

阅读准备

  • 插件官网:Diya – Timeline animation directly in Sketch
  • 相关阅读:Introducing Diya|Diya Tutorials
  • 其他插件:CRAFT|Sketch Material|WeSketch|Runner

上手很简单,走完核心流程大概可以分四步。

第一步,连线

和 Prototype 功能相同的连线方式,从 Layer 到 Artboard。当然,目前见过所有具备原型能力的插件都是这么操作的。

第二步,调整

每个动画都可以在时间轴面板上调节。Sketch 升到版本49.3的同学,时间轴面板暂时无法被呼出,等作者修复吧。。。

第三步,预览

第四步,导出

Diya 的导出功能很贴心,会针对原型面相的对象「老板」和「开发」生成两个文件:

  • 1. 一份普通的原型文件,老板有个浏览器就可以浏览;
  • 2. 一份带动效注释的原型文件,开发可以参考上面的参数进行效果还原。

虽然我没当过「老板」和「开发」,但是这个细节暴露了 Diya 的作者是服务设计出身,具备前端开发能力的全链路设计师。

快速上手后,还有这些功能可以玩一下。

运动曲线

如果对动效的要求很高,嫌弃默认值的同学可以自己调节动效参数。

形变动画

可以比照 Keynote 的「神奇移动」来理解这个功能。

路径动画

这是个非常有趣的小技巧,可以看一下官方教程,讲的很清楚。

动画复用

正如 Sketch 的精华 Symbol,用 Diya 制作的交互动画同样可以复用。

文章总结

怎么看 Diya 都比 anima 家每年$79的 Sketch 插件 Timeline 靠谱多了!!

非科班设计(公众号)

作者:徐小马

Sketch
(0)

相关推荐

  • 两分钟认识一款优雅的图标管理工具:Nucleo

    在互联网产品的设计工作中,无论是参考.拼稿还是搭建中低保真原型,设计师时时刻刻都会用到图标,然而,如果不对不断收集或制作的图标加以管理,那么在查找使用的时候会非常低效.为了解决这个问题,笔者给大家推荐 ...

  • 《我的世界》两分钟计时器怎么制作

    <我的世界>里面中继器,红石以及命令方块都是这款游戏非常经典的工具,玩家可以通过这些道具创造出很多看似不可能实现的东西,这就是科学的力量,下面是两分钟计时器的制作方法,有兴趣的玩家可以学习 ...

  • 如何撤回超过两分钟的微信消息

    超过两分钟的微信消息是撤不回的了,因为撤回的信息是要在两分钟内.

  • 微信发的帖子两分钟之后还能删掉吗

    不能,微信发出去的信息超过两分钟是无法删除的,微信发给对方消息,可以在2分钟内可以长按发送的消息进行撤回即可,撤回消息后对方手机端的消息就会被删除掉.

  • qq群超过两分钟怎么撤回消息

    目前根据腾讯规定,超过两分钟的消息是不能撤回的.

  • 微信群发错了小视频,超过了两分钟,群主能帮忙删除吗

    无论是视频还是图片.文字,超过两分钟都是无法撤回的,群主也无法删除. 微信信息超过两分钟无法撤回删除,你删除只能删除你的微信账户显示,其他微信好友可以正常接收显示你发送的信息. 微信删除发给对方消息, ...

  • Win10系统电脑空闲两分钟后会黑屏的解决办法

    Win10系统电脑空闲两分钟后会黑屏了怎么回事?此问题大部分出现在WIN10笔记本电脑上,正常情况下,Windows10系统电脑在空闲几分钟会,会自动进入睡眠状态,即自动黑屏.不过,有位用户表示自己并 ...

  • 微信为什么要有两分钟撤回功能

    微信里可以撤回2分钟内的消息,撤回后还会有一条提示,这让很多人感到不解,产品经理到底是怎么想的?为什么要这样设置?今天我们一起来解析一下“微信撤回”这样的做法到底是在干吗. 古人有云,“一言既出,驷马 ...

  • QQ怎么撤回超过两分钟的消息

    最近有QQ进行了更新,其中新推出了超出两分钟撤回功能,下面小编就给大家介绍一下如何撤回超过两分钟的信息.这里以手机为例. 操作方法 01 首先打开QQ,输入账号密码进行登陆. 02 要确定自己的版本是 ...