产品经理 原型设计教程

设置交互要多久?最快只需三秒!

0
登录或者登记去做吧。

原型设计分为两种,一种是静态的线框图,我们一般叫wireframing;另一种是动态的原型,一般叫作prototyping。目前在prototyping设计中涉及到的交互主要分为三种:页链接、交互状态和组件之间的交互。而动态原型的设计工具中比较常见的能够包括这三种交互设置功能的也有很多,比如:Axure、Justinmind、Mockplus和Proto.io等等,种类之多,数不胜数。但是,这些工具无一例外,都在宣传自己的过程中说自己是快捷迅速的。我们平时说的Axure,全名叫做Axure RP,而RP代表的意思恰恰就是Rapid Prototyping(快速设计原型);Mockplus也说自己是更快更简单的原型设计工具。既然都说自己是快速简单,我们今天就来比较实际操作一下,你们到底有多快。

页链接设置:速度平分秋色,可视化体现差异

在Axure所有的交互设置中,页面链接是最简单的一种了,只需要点击右侧属性面板中的创建链接,并在下拉菜单中选中需要跳转的页面就可以了。但是Axure在这一过程中有一个明显的不足,就是对于可视化的缺失。如果在这个项目中各个页面的名称比较相近,那么这样使很发生链接错的情况的。

而Justinmind应该是也体会到了Axure的这一问题,它采用的是一种拖拽的方式来实现页链接的设置。但是这似乎并没有真正的解决可视化的问题。因为,这个表示拖拽的图标实在太小了。

justinmind (1)

如果说Axure和Justinmind比较相似,那么Proto.io和Mockplus也应该是一见如故了。两者都采用了拖拽链接点的方式来进行页链接设置的操作,而且这个拖拽的过程是有明显的链接线显示的。这就大大提高了可视化,从而降低了操作的难度。更加可贵的是,Mockplus中组件的链接点在停留在页面上的时候还会显示该页面的缩略图,这使得错误链接的可能性降到了最低。

Mockplus

组件交互设置:速度差异开始变得明显

这里的设置中,四款工具的在交互设置上的速度差别就体现出来一些了。Axure在这里采用的方法是点击添加用例,然后弹出一个设置的面板,在面板中选择对应的命令,交互动作,和动效。Justinmind还是察觉到了Axure这里设置的不方便,但是,就像页链接的设置一样,Justinmind也还是没有拿出更好的解决办法。设置中Justinmind沿用了Axure的模式,只是在选择的过程中采用了下拉菜单。虽然在选择目标时使用了可视化的窗口,但并没有从根本上解决操作繁琐的问题。

Axure

反观两个年轻人,Mockplus和Proto.io在组件交互设置的模式上使用了更加简单快捷的拖拽,也就是在各种工具中流行的Drag-and-Drop。只是简单的对链接点的拖动就可以实现组件之间的交互。Mockplus的命令选择相对更加直接,Proto.io的交互命令可能还需要在进一步的进行调整。这种在交互设置上的拖拽模式和高度的可视化,使得操作中目标更加明确,动作更加清晰,Proto.io的组件大纲的功能也使得组件之间的关系更加有条理。Mockplus也在计划推出相应的功能,这里我们一起期待一下吧。

protoio

组件交互状态设置:Mockplus只需三秒。

作为一款新兴的原型设计工具,Mockplus不断强调自己快速和敏捷。在大部分原型设计工具软件没有为组件的交互状态单独设置功能选项的时候,Mockplus已经有了相对完善的组件交互状态设置的体系。主要的操作体现在属性面板中,这个闪电一样的标志就是交互状态设置的按钮,在弹出的面板中,可以设置鼠标经过和鼠标落下两种状态。而并不是像Axure、Justinmind或者Proto.io那样把交互状态作为一种组件之间的交互来设置。这个功能看似简单,但是它从这一个方向推动着原型设计向着更简单、更快速靠拢。像这样改变颜色的交互状态设置,三秒足够了!

Mockplus2

我们不可否认,Axure和Justinmind在功能的全面性上确实占有优势,但是我们也一样能够像Mockplus这种新兴的力量的崛起。随着行业发展,大家对原型设计工具需求和要求不断提高,希望这样的新力量会带给我们更多的惊喜。

Welcome to the Gutenberg Editor
照虎画虎——简单WeUI模板UX设计学习