5分钟掌握8个常用交互组件，轻松进阶原型设计
原型设计(Design)离不开组件，如果原型是房子，那么组件就是水泥和砖块。本文将为您介绍八个最常用的交互(each other)组件，现在就打开Mockplus试试吧！
一、弹出菜单
弹出菜单是原型设计(Design)中最常用的组件，许多组件的使用方法也与它类似，熟练使用弹出菜单将会给您带来莫大的帮助。接下来我们从实际案例来看一看如何使用弹出菜单。
1. 随意拖出一个组件，这里我们以Mockplus中的按钮组件为例。
2.拖出弹出菜单组件，将按钮右上角的链接点与菜单组件相连。UI视觉设计一个软件产品在编码之前需要做的就是交互设计，并且确立交互模型，交互规范。三是用户测试/研究，这里所谓的“测试”，其目标恰在于测试交互设计的合理性及图形设计的美观性，主要通过以目标用户问卷的形式衡量UI设计的合理性。如果没有这方面的测试研究，UI设计的好坏只能凭借设计师的经验或者领导的审美来评判，这样就会给企业带来极大的风险。
3.双击弹出菜单以编辑(Editor)菜单位置（position )及网站内容。UI视觉设计承担的不是单纯意义上美术工人的工作，而是软件产品的产品“外形”设计。二是交互设计，主要在于设计软件的操作流程、树状结构、操作规范等。
二、弹窗
弹窗与弹出面板的操作(operate)步骤基本一致，区别在于弹出菜单的四个菜单项都可再设置(set up)交互动作，而弹窗仅有“是”、“否”两个选项可供设置交互动作，同时，弹窗网站内容的格式也与弹出面板略有区别。UI设计教程具体还包括：可用性分析、GUI（Graphic User Interface即图形用户界面）设计、用户测试等。好的UI设计不只是让软件变得有个性有品味而已，更重要的是让软件的操作变得舒适、简单、易用，并且充分体现软件的定位和特点。
三、抽屉
抽屉是一个常用的容器型组件，其特点为高度封装、高度可调节(adjust)性、高度可容纳性，换句话说，您无需自行设计抽屉的细节，只需简单设置(set up)几下即可的到一个以多种方式滑出、能装入绝大多数组件的抽屉。
在将按钮的链接点与抽屉连接后，双击抽屉图标即可添加组件。
四、图片轮播
图片轮播组件支持数张图片的乱转展示，同样操作简单。先将图片轮播组件拖入工作(job)区内，双击添加图片即可。
五、面板
面板其实就是一个可供放置组件的容器。
将能容面板拖至需要的地方，调整大小，双击进入编辑(Editor)模式(pattern)，拖入需要的组件即可。注意(attention)，组件超出面板边界的地方不会显示。你会发现：因为是容器，面板是有边界的，子组件超过边界的部分会被“切掉” 。另外有意思的是：和“组”不同，设置交互(each other)的时候，可以将面板中的子组件作为交互目标(cause)，但“组”不行，只能将整个组设为交互目标，因为组是几个组件编组而成，编组之后，就被视为一个整体。
六、弹出面板
弹出面板是最为灵活的交互(each other)组件。拖入一个弹出面板，双击打开，你会发现它里面什么也没有，但是利用它，我们完全可以自己制作(Make)出需要的弹窗、消息框、提示框等许多交互组件。
七、网站内容面板
网站内容面板主要用来实现内容的快速切换。但是它一般不会单独使用(use)，你可以使用它和菜单栏、列表、选项卡等具有多选性质的组件来配合，共同完成内容切换。
首先在网站内容面板中设置(set up)三个层，分别连接到三个目标(cause)页面上。然后将选项卡上的链接一一对应地与三个层相连，内容切换就完成了。
八、滚动区
当屏幕大小不足以容纳我们需要展示的网站内容时，我们可以使用滚动区组件在有限的空间(Space)内展示更多内容。
将滚动区组件拖入工作区后，调整大小，然后双击进入编辑(Editor)模式(pattern)。在编辑模式中拖入需要加入滚动区的组件，鼠标点击“ ”来扩展滚动区大小，点击“-”来收缩滚动区大小，如果你同时按下Ctrl键，可加速扩展或收缩。
交互是原型设计(Design)中非常重要的部分，灵活使用以上八个交互组件，足以满足你常用的交互设计！除了交互组件，Mockplus中还有近两百个封装组件，现在就去试试吧！