美文网首页
Framer动效制作01

Framer动效制作01

作者: huangxiaohao | 来源:发表于2016-07-20 16:45 被阅读56次

    在dribble上看到过许多精彩的交互动效,一直在寻找一款比较好的动效制作软件。试过pixate,但是很快就放弃了,觉得这个软件支持的有限,而且逻辑上就是把握不好。

    找到Framer,正好我有一定的前端知识,想想设计师在啪啪啪的敲代码,就觉得好帅气,所以就决定来学习这款软件。其实,用到的前段知识真的不多,看的懂代码就好啦。

    这个系列我会持续更新下去,希望早日可以做出帅气的动效 :)

    贴出代码

    Screen.backgroundColor="#877dd4"

    layerA=new Layer

             width: 150

             height: 150

             x:Align.center(-98)

             y:Align.center()

             backgroundColor: "#fff"

             borderRadius: 6

    layerB=new Layer

             width: 150

             height: 150

             x:Align.center(90)

             y:Align.center

             backgroundColor: "#fff"

             borderRadius: 75 

             layerA.states.add

             rotated:

             rotationX:180

    layerA.states.add

             rotated:

                   rotationX:180

    layerB.states.add

              rotated:

                  borderRadius:6

                  rotation: 90

    Utils.interval 2,->

    layerA.states.next()

    Utils.interval 3,->

    layerB.states.next()

    相关文章

      网友评论

          本文标题:Framer动效制作01

          本文链接:https://www.haomeiwen.com/subject/uabvjttx.html