美文网首页
11-27 principle

11-27 principle

作者: 丿小蜗牛 | 来源:发表于2020-01-04 21:35 被阅读0次
    • prinpicle非常高效、敏捷,是sketch的最佳搭档
      -可输出mov、gif格式

    Principle课堂笔记

    一款高效的高保真交互Demo制作工具
    1、Principle的动画基础原理是两个图层想要形成补间动画,必须命名相同;
    2、在Principle可以为同一个图层在不同画板之间的属性变化自动添加动效变化,我们只需要调整动效的触发时间(时间轴)以及动画效果(动画曲线),默认动画运动时间是0.3s;
    3、做动效之前,先在sketch将文件整理好,sketch图层(包括组/symbol/…)命名英文状态下加个 * ,导入principle后可以将图层合成为位图图层,目的在于减少图层数量,便于管理;
    4、sketch图层是剪切蒙版,导入principle会自动变成位图;
    5、sketch里的文本导入principle也会自动变成位图;
    6、Principle形状旋转的时候没办法调节中心锚点位置,可以借助别的形状完成相同的效果:将形状编组,该形状的中心锚点变为组的锚点,这时将另一个形状从组中拖出来,原组内形状锚点位置不受影响;
    7、需要注意:不同画板之间的同一对象名称需要一样,否则会出现动画混乱;
    8、当页面中出现很多交互时,为避免触控区域过小,同时为减少画板数量避免混乱,可选择组件整个画板进行添加交互事件,增大触控区域;
    9、滚动组是在一个指定的区域内,内容可以按照指定的方向进行滑动;内容在组的范围内滚动,超出范围会回弹,与拖拽有区别;无论加页面还是滚动,都在组上添加;
    10、动画面板指的是不同画板之间元素的交互,即画板与画板之间的交互;
    联动面板指的是同一画板内元素的交互,即画板自身的交互;
    11、联动面板的激活,需要图层添加水平或垂直的指令(如拖拽、滚动、页面);
    12、联动面板和动画面板的区别:联动面板横向是距离,动画面板横向是时间;
    13、当一个图层(组)是拖拽、滚动、页面时,此图层(组)的位移可以驱动图层的属性变化,可以改变自身属性,也可以改变其他图层属性;
    14、预览动画,需要先将联动面板轴移动到起始点;
    15、principle里拖拽一个图层放在另一个图层上松手,会将拖拽的图层变成其子图层形成父子关系,改变父级任何属性子级会相应调整;
    选中父级图层,勾选裁剪子图层,可以实现蒙版效果,相当于剪切蒙版;
    16、当视图存在多个画板,移动画板内图层的时候有技巧;拖动内容时一点一点移动,释放再拖动,若旁边画板出现变蓝不要释放;
    17、做复杂交互的时候,可以对整个画板添加自动,重新做触控区域;

    相关文章

      网友评论

          本文标题:11-27 principle

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