AxureRP,是个古老的软件,它是在开发windows软件的时代的产物,如今来看一切都现得很过时。它自带的组件库非常过时,常用组件欠缺,大量过时组件永远用不上。它的互动设置也是,每个组件,都能够设置大量行为。
打开工程:Ctrl+O新建工程:Ctrl+N保存工程:Ctrl+S查找:Ctrl+F替换:Ctrl+H复制:Ctrl+C剪切:Ctrl+X粘贴:Ctrl+V快速复制:Ctrl+D或者单击拖拽+Ctrl撤销:Ctrl+Z重做:Ctrl+Y全选:Ctrl+A生成原型预览:F5生成原型文件:F8在原型中重新生成当前页面:Ctrl+F8隐藏网格:Ctrl+’对齐网格:Ctrl+Shift+’隐藏全局辅助线:Ctrl+.隐藏页面辅助线:Ctrl+,对齐辅助线:Ctrl+Shift+,
Axure之所以在中国市场有着较高的声望,其原因不仅仅是用户使用惯性,Axure的功能全面也是关键要素之一,比如:判断的设置、变量的设置,交互的设置等等。但是Axure在用户体验上的缺陷也是比较明显的,其设置交互的方式相对繁琐,可视化不足、条件判断、变量、中继器等功能的使用需要比较陡峭的学习曲线;而国内的原型设计人群更加年轻化,虽然开发团队数量众多,但普遍规模小,管理水平还处于起步阶段,对于软件开发的迭代速度的要求远胜过其对流程规范性的要求。这也是axure在国内用户中遇到的困难,希望在之后的版本中能够有所改善。
在打开AxureRP之后,可以在首页选择“新建文件”,这样便可以开始建立一个新的项目。
接着,选择左侧栏中的“page1”,在右边边框中开始创建新的界面内容。在元件库中选择一个新的元件拖拽至右边边框即可。比如拖拽一个矩形框。
针对某一具体部件,可以选中元件,然后在其右侧“属性”栏中设置相应部件属性值即可,比如在矩形框中输入适合的文字。
如果需要跳转至其他界面,可以拖拽一个按钮至界面,并且在相应的按钮中设置链接,点击设置按钮属性值“创建链接”,并且选择相应的跳转界面。
与此同时,我们需要设置跳转界面(新界面)page2内容,选择“page2”添加新的元件并且修饰即可,其操作与page1基本相似。
界面布局完成之后,我们便可以点击右上角“预览”查看效果,效果图会在网页中展示。如果不满意预览图,还可以返回继续修改。
BalsamiqMockups是一款快速创建原型的工具。这款原型工具具有独特的手绘风格。软件的内置组件,拖拽功能的支持为设计带来了便利。该工具有桌面版本,同时也可以作为GoogleDrive,Confluence和JIRA的插件使用。
在同类的工具中,Balsamiq可以说是独树一帜。为什么这么说呢?因为这款原型设计工具跟Axure或者其他工具不同,它不支持线框图模式的,所有的组件均为手绘风格。这对于偏爱“手绘风”的用户来说简直是幸福满满。不过,虽然这样满足了部分用户的体验,但也正是因为这一点,Balsamiq在整体用户体验上付出了相应的代价:其自身组件不足100个。再者,Balsamiq对于移动App原型制作和手机即时预览的支持是没有的。让很多用户望而却步的是,Balsamiq没有交互设计功能,这也让它越来越缺乏竞争力。
(1)BalsamiqMockups使用非常简单,只要拖动上方的控件到下方的设计区域即可。
(2)单击控件即会弹出控件的属性界面,每个控件都有不同的属性。
(3)最上方的一排按钮分别为撤销、还原、重复、剪切、复制、粘贴、删除、组合、取消组合、锁定位置、画面大小。
作为中国的本土选手,它简单得以拖拽为基础的工作方式和操作中高度的可视化,在很大程度上简化交互设计。支持素描(类似手绘)和线框图两种风格。我们在设计原型时,用高保真还是低保真取决于多方面的因素,最重要的考虑我们面对的对象是什么角色,是开发人员,UI设计人员还是最终系统的用户(或者客户),如果是开发人员或者是UI设计人员,低保真就足够,甚至只能用低保真来避免对UI设计的用色干扰。如果我们需要低保真原型,那么用MockPlus非常适合,默认控件,线框等元素都是黑白灰,最大限度突出页面元素,让PM把注意力集中在页面布局,页面切换,交互过程。
主流互联网产品现在已经从PC端走向移动端,MockPlus目前全面覆盖终端,PC,Pad,并且PC端可以选择多种大屏,中屏的浏览器尺寸,同时每个种类都有丰富并且优雅的原型元素控件来选择,封装了约200个组件,3000个以上的素材。
但是,这款工具的在用户体验上也是存在着一定的缺陷的。目前Mockplus对于一些过于复杂的功能,比如:判断和变量,是不支持的。所以在用户体验上也是会造成影响。此外,对于产品文档的支持,也有不足。
选择新建一个项目,也可以看他的一些例子学习一下别人的设计
新建之后,会进入一个选择界面,上面是各种型号的选择,手机还是pad或者网页版,还分为mac和windows,可以自行选择,也可以自定义尺寸
点击mockplus,可以看到有选项部分,可以进入这个选项进行整体上面的设计,比如UI的透明度,背景颜色等。
然后可以看到左边会有两个部分,一个是各种各样的部件,一个编辑的地方。可以根据自己的需要把部件拉到自己需要的地方。
拉好部件之后,可以根据需要进行备注说明,可以点击小闪电进行超链接,也可以进行尺寸上面的设置。
左边是各种各样的页面,我们可以根据自己的需要进行页面链接的设置。注意mockplus只允许页面跳转而不允许部件跳转,好了之后,点击上面的运行,一个APP线框图就生成了
在中国市场上不可忽视的另外一款工具就是Justinmind。它的宣传标语就是“为移动设计而生”,而它也在功能上很好的实践了这一点。就移动设计来讲,可以说是用户体验优越感爆棚,因为这几款软件中只有Justinmind是支持手势的。
Justinmind对负责的交互设置,做了图形化的呈现,力图然设计者更轻松一点,但设计者需要一定的编程逻辑思维,所以一些国内求快求简单的用户就不再选择它。另外,由于Justinmind是基于java开发,其运行速度可以说是这四款工具中相对较慢的一个。
选择新建一个原型[CreateaNewPrototype]
选择想要创建的原型类型,这里选择为iPhone6创建。不同的原型类型,会有不同的绘制画板。
选择原型基于的模板。这里我选择使用“空”模板,方向为“竖-Portrait”。点击“Finish”开始创建原型。
如果你是第一次创建原型的话,会弹出引导窗口。为了便于熟悉整个软件的操作,这里我们选择接受此引导。
控件栏-Widgets,与Axure类似,这里列出了软件默认支持的各种控件。
页面导航-Screens。这里列出所有原型文件中的页面,与Axure的导航类似。
属性栏-Properties。当我们选中某个控件时,可以在这里编辑控件的属性。
事件栏-Events。在这里可以编辑控件的触发事件,类似Axure的事件管理。
预览-Simulation。使用这个功能,可以在浏览器中查看编辑完成的原型。
墨刀是一款在线设计编辑原型的工具,特点短平快,适合一些APP,小型pc工程,以及一些频繁迭代的产品,优点协同办公效率比较高,目前国内个别大公司以及中小企业都有用到,个人版本免费,但是使用页面数量有限,编辑后产品都是保存直接保存在云上,很方便。不会出现文件丢失的情况,但是也有缺点,就是在网络不通畅,延迟比较高的时候,很麻烦,原型编辑操作会有卡顿现象以及版本不一致现象,还有原型模板暂时不像axure那么丰富。
进入墨刀官网,点击“创建空白项目”按钮,进入页面,选择符合需要的版式,在弹出窗口输入名称,选择画布尺寸,点击“创建”即可进入编辑页面。
进入页面,点击“内置组件”按钮,在弹出列表可以添加自己的“图标导航栏”、“轮播图”等,根据需要的页面设置内容,点击导航栏内部文字可修改文字内容、修改颜色等。
点击上面的“素材库”按钮,可以给页面添加图片,还可以上传自己需要的素材来添加和设置自己的页面。
Axure的功能全面,在易用性和复杂性上做到了比较好的平衡。作为老牌工具,用户在中国国内数量众多,使用惯性大,其他同类产品想要取代它还是比较难的。
Balsamiq在手绘风格上独树一帜,可谓剑走偏锋。近几年缓慢的改进使得不少用户另投它门。也许,“不变应万变”也是一种做产品的好思路。
Mockplus上手简单,设置方便,但是它舍弃了一些相对复杂的功能,这也意味着它必然要放弃一部分用户。
Justinmind针对移动端的交互体验有着很强的优势。但对除了对使用者有一定要求之外,运行速度比较慢也是其一大弊端。
墨刀轻量级移动原型设计工具,短平快,适合一些APP,小型pc工程,协同办公效率比较高。几乎不免费,免费帐号只能创建3个项目,最多20个页面。不方便存档,没办法保存到本地。