Learning and using the prototype design
| This work belongs to the curriculum | < Course Link > |
| Where the job requires | < Operational requirements > |
| The target job | Learn a variety of prototyping tools, familiar with common prototyping tools, learn to design prototype |
A prototype design
1. prototyping is an interaction designer with PD , PM , website development engineers the best tools of communication. The design of the block, in principle, must be interaction design product division, interactive user-centered design philosophy will run through the entire product. The use of professional interaction designer vision and experience a direct result of the availability of the product.
2. Comparative common prototyping tools
(1). Blade
Blade is an online collaboration tools and prototyping, with the blade, product managers, designers, developers, sales, operations, and entrepreneurs such as user groups, can set up as a prototype, demonstration project results. Blade is also a collaboration platform, collaboration project members can edit, review , whether the product idea to show, or gather customer feedback to the product, a Demo to show to investors, or communication within the team collaboration, project management.
Feature
- Operation is relatively simple, simple drag and drop can produce prototypes, also can be used as a template
- Library, components rich
- Preview, there are real machine Andrews show more clearly show the effect after completion of the prototype design
- Prototype can share and exchange
- Prototyping easy to lose in the cloud save
(2) .Axure RP
Feature
- It is a professional rapid prototyping tool, to be responsible for defining requirements and specifications, design features and interface to quickly create wireframe software application or Web site, flow diagrams, prototypes and specifications document.
- As a professional prototype design tool, it can create prototypes quickly and efficiently, while supporting multiplayer collaborative design management and version control
-
axure In addition to fast and efficient output prototype map, and also supports dynamic effects of production, product manager would like to express dynamic efficiency, then this software is very convenient.
- axure supports multiplayer online collaborative design
（3）.Mockplus
Mockplus (G-off) is a simple map design rapid prototyping tool. Software for the team, for personal use in the design phase of software development. Its lo-fi, without having to learn, fast to use, functional enough. And be able to express myself very well designed.
Feature
- It provides a common component of many basic components, interactive components, such as the layout of components
- As a professional prototype design tool, it can create prototypes quickly and efficiently, while supporting multiplayer collaborative design management and version control
- It provides the official website a lot of instructional videos to guide the novice how to quickly learn to use the software to work, but it also provides the official QQ group, there are internal employees for the user Q & A
- MockPlus的云同步功能也是它的一个亮点，这个功能可以使得原型设计的工作更加灵活，可以轻松的在不同设备上进行工作，也可以用来协作完成原型设计工作
- 原型预览方面的功能也是十分强大的。MockPlus上设计的原型可以通过mp文件、图片、html在PC或移动端进行预览，既可以在线浏览,也可以离线观看，这就可以更好的将自己设计的原型给相关人观看，以获得及时反馈
（4）个人总结：原型设计可以更快的帮助我们查看软件系统的布局，可以更直观的看到我们产品，可以做一些修改，交互设计以用户为中心的理念会贯穿整个产品，原型设计可以让后端程序员与前端设计者有更好的沟通，原型工具的建立耗费时间少，经济低，可以很快制作出来，对不满意的地方可以立即修改。
对三个工具的使用对比：墨刀和Axure RP，Mockplus都是支持多人同时编辑、协作完成。都可以拖拽组件，快速构成界面、就能实现页面跳转效果。
Axure RP由于是专业的设计工具，所以个人感觉没有墨刀和Mockplus轻便，在拖动方面选区很麻烦，但是在具体每个细节也更专业，而且它的动态控件比较多，唯独他有中继器。它在交互这块功能很占优势，它是可以对单个元件设置活动的，Axure RP不支持规格说明文档的设计。Mockplus支持线框图、流程图、原型和规格说明文档。
墨刀则完全不支持线框图、流程图、原型和规格说明文档，但是在向客户展示自己做的产品时，墨刀又是最快速，最直接能展示出产品具体的工具。墨刀也是一个特别适合新手使用的原型设计工具。
个人本次原型设计工具选择：墨刀
二.需求分析
1.社团管理
项目需求如下：
面向普通学生和社团管理员，集合了各个社团的信息，特色功能是活动的浏览和报名，以及活动的发布、审核与通知，同时还具有加入社团、发送站内信等功能。
项目背景和解决的痛点：
学生刚入西南石油大学时缺乏了解社团的长期的、便利的渠道；社团公众号文章分散各处；群里发的活动报名问卷容易被水过去，而且每次要填的信息都差不多。
社团管理员在管理社员时没有一个很好的工具，来发布活动、统计报名人员、通知活动变更等。
社联在管理所有社团时，在审核活动申请、审核场地申请、星级评定、材料收取等方面也存在一些困难。
因此，我们希望能打造一款软件连接学生、社团和社联，根据用户不同的使用需求，我们计划给将社团展示、活动报名等功能放在手机小程序端，在社团管理的大部分功能放在网页端。
项目面向的用户：
小程序： 主要面向西南石油大学学生，其中的社团管理功能，则面向社长等社团管理员。
网页端： 主要面向社长等社团管理员，还能面向社联。
2.需求分析
(1)业务需求
新学生不能清楚的了解社团，社团管理人员也没有一个工具，来发布活动、统计报名人员、通知活动变更等。在审核活动申请、审核场地申请、星级评定、材料收取等方面也存在一些困难。
(2)用户需求
社团管理员：一个工具，可以发布活动、统计报名人员、通知活动变更等
学生：能够长期、便利的渠道来了解学校的社团，能够清楚的了解每一份问卷是干什么的
社联：要能够简单的管理社团，审核活动申请、审核场地申请、星级评定、材料收取等方面要能够做到更加便捷
(3)功能需求
注册登录功能、填表功能、发布社团活动、更改发出的信息、统计报名人员、审核活动功能、社团展示、社团报名功能
(4)非功能需求
系统要能容纳多台设备同时在线，并对数进行处理、由于学校用户过多，所以容量必须要大、操作不应该繁琐复杂，应该快捷，简便、软件也应该具有可靠性、健壮性、可使用性。
三.原型设计结果展示
项目链接
小程序端链接：
网页端链接：
原型设计的目的就是短时间内看到产品的样子，对不符合的就要立即修改，所以在对产品进行需求分析时，要把分析详细确定出来，原型设计出来之后的界面也要注意不能高于实际做出效果，不然产品达不到预期要求，毕竟开发工作和简单的原型建立是两回事，应该实事求是来建立原型，然后根据需求来进行下一步的开发工作