从开工（正月初九）到今天刚好一个月整，这段时间通过自己的学习和在项目上的一些尝试，算是对principle有一定的理解了。下面，我将从四个方面谈谈自己对principle的理解以及自己的一些收获。

一、利用principle做交互动效的流程

第一，要在sketch或figma（因为自己使用的设计软件是sketch，后面就不提figma了）上做好设计搞

第二，将sketch的画板图层导入到principle里

第三，根据自己的想法完成交互动效的效果

第四，交付开发，与开发对接，实现最终上线的目的

虽然看起来这四步挺简单的，但是要实现没有破绽流畅的效果，事前是需要一定的逻辑能力，思维能力以及整理图层的能力。

由于principle只能识别sketch中简单的图形（矩形，圆形和圆角矩形），强调一句，这个识别指的是可以在这个元素上进行修改，比如颜色以及圆角的变换，而像文字图层被导进principle识别出的是一张位图，这让我在事先就得考虑到某处文字可能会出现的颜色。再说说第三条，其实这应该是放在最前面的，因为你得要先有一个想法，在这个基础上，你才能合理的打组图层，减少不必要图层的视觉干扰。其次就是，在实际的动态效果中，物体的运动轨迹要遵循实际的物理运动规律，这样用户看起来才不会觉得突兀与不习惯，这也是做动效所要考虑的合理性。最后再说说与开发对接的环节，因为工位离的近，所做的动态效果相对简单，所以就没有给出实际的动效稿，这一点有利有弊吧！利的是，这可以减少实际的开发工作时间，加快项目上线速度。弊的是，一旦动态效果相对复杂，口述给开发，最终实现效果与演示效果难免有落差。

二、利用principle做交互效果的一些小技巧

这里就例出两处自己实际项目的小收获吧。由于无人交流的困境，所以实现方法可能还有更优选，在这就暂时留下一个记录。

这个例子是要实现下拉框在导航栏下一层出来。因为头像跟下拉框在一个组件里，也就是一个层级里，常规操作的话，不可避免的就是，要么头像显示出来下拉框层级在上，显然这种效果不是我们想要的。要么下拉框层级在下，那么头像就别导航栏遮住了，这也不是我们想要的效果。我的解决办法就是，复制一个头像出来，用来占位，很巧妙的解决了这个问题。

这个例子是要实现逐次出现的效果之外，还要加上houvr（鼠标放上去的悬停显示效果）。常规操作，会出现两个问题。一，将新信息栏组件化，这样就实现不了逐次出现的效果。二、不将信息栏组件化，这样导致的情况就是交互路径变多边复杂，容易出问题，效率也低下！正确操作应该是，先等逐次出现效果之后，给组件化，这个情况下实现houer效果，完美解决问题！

其实还有挺多收获的，这两个例子算是印象比较深刻，所以拉出来操练一下。

三、利用principle做交互效果的难点

第一、就我目前而言，难点应该是理清principle每一个功能上的逻辑，以及细节上的正确高效的解决方法。

第二、思维的局限，简单来说看的东西太少了，思维不够跳跃，再加上学习途径的局限性，刚开始入门就进入瓶颈期。。。（b站关注principle的的，更多的是入门教程，相对比较基础，学习意义不大）

解决办法：花时间深入每一个细节，吃透每一个逻辑。分析优秀作品案例，深挖每一处细节上的处理，思维上的严谨之处。

四、做交互动效的意义

先借用孔晨老师的话：解释交互效果、拉开设计差异、提升用户体验、产品创新

然后就是自己的一些理解：第一、恰当的交互效果可以丰富视觉效果，提升用户体验。第二、新颖的交互效果可以突出产品，打造差异化。第三、随着硬件软件的不断发展，人们的视觉要求不断提高，合适的交互动效是大势所趋。