原型设计工具比较及实践

一、目录

1、原型设计工具比较

1. 墨刀
2. Axure
3. Mockplus

2、原型设计

 

二、原型设计工具比较

·墨刀

墨刀对于APP的原型设计真的是体验非常好。其控件的拖拉、大小的调整，都会自然的去匹配相应的母版大小。无需去担心有多移动一点或多 选择一点。并且墨刀的系统控件都是基于APP，以及系统平台IOS和安卓，因此在里面可以首先选择相应的设备布局，减少了不少工作环节。墨刀的缺点就是相应的就是不自由啦，首先这也于墨刀的产品定位有关，清晰定位为移动端原型设计工具，因此在交互效果上、控件组合上，操作面板的选择上都不如AXURE 灵活，并且效果切换因为是采用连线的方式，有时候会让使用者脑子错乱的感觉。并且目前原型的交互效果系统自带的还比较少，但基本满足日常所有原型的使用。另外需要充费才能够使用更强大的共享创建功能。

·Axure

Axure作为老牌的原型图工具，功能最齐全，交互最多样，基本任何想要的效果都可以实现，尤其在制作PC端原型图上有优势。Axure缺点同样也相当明显，Axure的动态面板、中继器等功能都是强大的，但是不容易搞懂。大部分PM 都会在Axure原型库、素材库去寻找相应的第三方素材库，进行载入，需要花费相应的时间。

·Mockplus

拥有Axure RP类似的界面、操作方式，但提供了与时俱进的组件，去掉了如今永远用不上的互动方式。这样，它能像Axure RP那样，通过简洁便利的组件设置，初期只专注功能，快速完成页面功能设计，并模拟互动。等功能布局精确定型，又能通过样式设置，实现和Sketch派系一致的最终成果。基础版免费使用，操作简单，上手快，交互简单(只需拖曳就可以)，功能多样，组件资源丰富，预览方式和导出类型多样，支持团队协作。有原型演示，可以帮助前端设计师、后端程序员更好地理解你的原型产品。mockplus有组件库和图标库，界面设计较为方便。缺点有不支持鼠标悬停，手机预览不是很清楚，日历表组件是静态的。表格功能还需要完善。

三、原型设计

1、主题

·名称

高校二手交易平台

·功能

·登录注册账户。

·同学可以将自己的闲置物品发布到二手交易平台。

·在平台浏览二手物品，与卖家联系聊天，出价等。

·接收通知消息。

·界面设计考虑因素

界面设计考虑到要实现用户登录，参考咸鱼等二手交易平台，设计一款界面功能完整，能实现发布闲置，与商家沟通等，能使用户找到所需要的功能。

2、界面切换

·主界面

 ·界面功能：用户可浏览二手商品。

·界面组成：搜索框，商品图片，商品名称及转卖原因介绍。

·前置条件：点击进入app。

·后置条件：进入商品介绍界面。

·操作步骤：点击商品图片。

·商品详情页

 

·界面功能：用户可浏览二手商品详情信息以及卖家出价。

·界面组成：搜索框，商品图片，商品名称详情介绍及转卖原因介绍。

·前置条件：点击商品图片。

·后置条件：与商家沟通，出价给出价格。

·操作步骤：点击我想要，点击出价。

·聊天界面

 

·界面功能：用户可与卖家沟通。

·界面组成：输入框，键盘，表情。

·前置条件：点击我想要。

·后置条件：退出到商品页。

·操作步骤：点击我想要，进入与卖家沟通。

·商品出价界面

 

·界面功能：给出想收购的理想价格。

·界面组成：搜索框，数字键盘，出价按钮，删除按钮。

·前置条件：点击出价。

·后置条件：退出到商品页。

·操作步骤：点击出价，给出想收购此商品的理想价格。

3、界面切换流程图