MockPlus原型设计介绍

  在第八周的课堂上，王文娟老师在校园系统上发布了对于自行选择的原型设计软件进行资料查找以及自学的任务。因为之前的课程学习需要，我们已经大概掌握了原型设计软件Axure的使用，因此在这里，我选择了另一原型设计进行介绍，与Axure有很高相似度的原型设计软件：Mockplus。

 

引言：

    Mockplus（摹客）是一款简洁快速的原型图设计工具。适合软件团队、个人在软件开发的设计阶段使用。其低保真、无需学习、快速上手、功能够用。并能够很好地表达自己的设计。

    了解一点Axure后，为何许多人仍转而使用Mockplus呢？主要是关于Axure和Mockplus比较的两句话：

     如果你是一名设计师，需要的是高仿真、像素级的原型设计，选择Axure；

      如果你是一名程序员，需要的是一款方便和同事更精确、高效地讨论交互设计的工具，选择Mockplus。

产品理念介绍：

1、审阅协作

  创建原型图、邀请、批注图钉，之后就可以协同工作了。所有的讨论、意见、版本，都会保留。

2、无缝真机预览

   可直接实现设计和移动设备之间的通讯，直接预览，不需要任何第三方设备。在设计过程中，设计者拿出手机就可以随时和Mockplus对接，将原型传递到移动设备，观察原型在移动设备中的真实状态。

    其拥有200多个组件、海量图标，全部支持手绘素描风格。更好地强调传递一种设计原则即：“我这是草图，仅仅是原型，不是最终的产品，需要你的确认”。对于团队交流、客户沟通，这会有好的效果，也非常重要。

3、组件交互

    视觉上定位于低保真，但致力于高保真的组件交互能力。表达交互时依然能够准确、完整，并同样简单上手。Mockplus支持基于页面的交互和动画效果。MockplusV2版本，将支持基于组件级别的交互和动画，可即时观察交互效果，大大降低学习成本。

4、模版重用

   支持模版功能，可以把当前的设计存入模版库，下次使用时，直接拖入工作区即可。模版还可以分享到团队的其他成员已经所有Mockplus所有注册用户，从而提高整个团队乃至所有用户群的生产力。V2版本支持组件、页面、图片素材三个方面的模版和重用。

产品基本功能介绍（自学后制作）

新建项目初始页面（选择需要交互的机型和客户端）

首先一拖一拽将左下角工具栏中的移动部分拖拽至目标位置（并选择你想要的版本）

     —————>    

接着拖拉工具栏中的方形方框（形状）将其添加至目标位置 （并可以在右上角选择你喜欢的样式）

   —————>   ——————>

同样在工具栏中选择label（包含单行输入框、多行输入框等等）拖拉至目标位置，并进行文字添加以及样式更改

 

  ——————>——————>

根据自己的需求可以对界面进行图像的布局与绘制（其中工具栏有图标库供挑选）

——————>

继续对界面进行填充（多行文字等辅助）

为页面底部添加扩展中的热区（Hotspot）若找不到可以在搜索框直接输入，并配上点击图标（同时可以完成点击按钮爱心消失的功能）

第一张界面设置完毕后：

在左边空白处新建一个页面，使页面和页面之间可以互相点击交互

点击Account上方小按钮并拖动线条并可以使其和页面链接

页面2布置完后，页面如图：

 

 

如果用户希望能够自行学习，在产品上便有直接的模板可以提供下载，直接使用并查阅他人模板，便可以学习到如何制作一个良好的界面

在制作完成后，如果想观看效果，可以点击上方按钮：（进入预览模式进行观看）

 

使用自学后感想：

  它关注设计，而非工具，是它带给设计人员的理念。Mockplus的主要价值是：在正式制作真实软件产品前，通过原型给大家一个产品的模型展示，而这个模型你可以通过非常简单快速的方式得到。所以，Mockplus的适用人群是比较广的，只要你有产品（范围很广，可以是某网站，某功能，某个策划案，某个广告模型，某个创意等）模型的展示需要。总之，任何软件公司、软件从业者，能利用到Mockplus提高效能，并替自己加分。Mockplus是一款快速原型设计工具，支持包括APP原型在内的多种原型与线框图设计。除了快速，Mockplus广受欢迎更因为它极低的上手门槛。所以就算是新手也能很快掌握。