产品小白如何由浅到深学习动态面板？

经常使用Axure制作原型的朋友可能有会发现，动态面板是我们日常使用当中非常常用，也相对重要的部件。

确实是的。所以我们在进行axure的学习时，关于动态面板的学习是我们重要的一部分。

在我们所有进行Axure学习的同学当中，当然一定会安排关于动态面板的学习，虽然每个人所作的原型是不一样的。

比如，有的同学做的是某个知名电商网站的导航和轮播图等。

通常如果没有接触过的同学，老师会给同学进行直播学习，然后同学可以通过官网的点播课程进行巩固，进而完成案例的制作。

通过基础内容的学习，吸收和掌握，同时结合实际案例（如网站轮播图），同学们可以由浅入深地学习动态面板地相关知识。

首先，认识动态面板。

知道什么是动态面板，什么情况下使用动态面板。比如我们前面提到的，网站轮播图。

又比如，导航的切换。

包括移动端的导航，一样也是使用动态面板制作。

其次，学会使用动态面板的动作设置。

知道如何创建动态面板，动态面板的状态怎么设置切换，并且通过设置状态切换，去实现交互的效果。

在Axure中，动态面板的专属动作很少-设置面板状态。通过这个简单的动作，我们却能够做出不同的交互效果。以前面说过的焦点轮播图为例，简单看看同学们是如何实现这部分内容的学习的。

在动态面板载入的时候，设置动态面板的状态切换到next，并且设置好切换时间，循环方式。在预览与生成的时候就可以看到自动切换的效果了。

有多少广告就将动态面板设置多少状态即可。

在用例事件的选择上，也可以选择页面事件-页面载入时，效果是一样的。

再次，综合使用动态面板的用例事件。

动态面板有一些自己专用的特定事件：动态面板状态改变时、尺寸改变时、拖动时、滚动时和载入时。

比如前面说的例子，用到的就是动态面板的特定事件之一：载入时。

还有一些事件是通过其他用例中的动作设置从而触发进行，比如显示或移动动态面板。我们可以使用这些事件来创建高级交互，比如在轮播图的基础上再进行完善。移动端的轮播图再图片上进行滑动可以进行上一个或下一个广告，可以使用它的哪个特定事件呢？

这里同学们使用到的是向左/向右滑动时，这是非常正确的。

这位同学除了做到滑动切换之外，还多设置了一个交互，就是滑动切换之后，再次进行了自动的轮播。同样可以看到，应用的还是它特定的动作-设置面板状态，和特定事件-向左/向右滑动时，综合应用达到想要的效果。

关于动态面板其他的特定事件，这里就不一一将同学的学习过程展示出来。在基础学习的基础上，在进行举一反三，变化出各种交互效果。

上面讲述的是同学在进行动态面板学习时候的情况。简单说明了动态面板的使用，实际上动态面板能够实现的交互效果远非与此，更多的交互动画等待着我们一起去探索研究，希望大家能够挖掘出更大的价值，使得原型保真效果在上一个新台阶。

不管是动态面板的学习也好，其他内容的学习也好，都可以遵循这样的一个学习过程。学习理论内容的时候，由浅入深，从基础再到深入应用，一步一步。在过程中再辅以实践，就能掌握学习的内容。

PS：图片来自网络和陪学网《产品解析与实战》学员，后一种图片未经允许请勿使用。

下方查看历史文章