Axure9.0原型设计实战.doc

PAGE 2 第1章 从0认识Axure 9.0 1.1 原型设计入门 1.1.1 原型的定义 在产品经理的日常工作中，原型设计是必不可少的工作之一。原型设计可以用于产品设计方案，也是用于开发、测试中项目组成员工作交付的重要文件。 原型是用线条、图形描绘出的产品框架，也称线框图。原型是页面级别的信息架构、文案设计、页面之间的产品流程，是产品功能与内容的展示页，阅读者可通过原型快速了解产品经理的设计思路，了解产品经理最终想把产品表现成什么样子，实现了哪些功能。 如图1-1所示，最简单的原型包含了原型的形态展示，通过图表、文字、布局来展示产品经理希望表达的产品形态。 图1-1 1.1.2 原型的重要性 1.抽象转具象 原型设计在整个产品方案输出流程中处于最重要的位置，起着承上启下的作用。原型设计之前的需求或功能信息都是相对抽象的。原型设计的过程就是将抽象信息转化为具象信息的过程。完成产品原型之后，产品需求文档即对原型设计中的版块、界面、元素及它们之间的执行逻辑进行的描述和说明。 2.避免疏漏 原型最大的好处在于它可以有效地避免重要元素被忽略，也能够预防设计人员做出不准确、不合理的假设。 3.多维度优化设计 一个可用、可交互的原型可以帮助开发和设计人员从不同的维度上来规划和设计产品，是帮助网站与APP设计最终完成标准化和系统化的最好手段。 1.1.3 原型的特征 原型应该尽可能模拟最终产品，尽量在体验上和最终产品保持一致。但是，原型背后的逻辑不要依赖交互形式，以减少制作原型的成本，加快开发速度。 产品经理在使用Axure设计原型时，要选择适合自己工作需要的原型保真程度。 1.1.4 原型保真程度 原型保真程度是设计的原型对于最终上线的品的仿真程度。按保真程度，原型可分为低保真原型、高保真原型。下面我们分别介绍一下它们的优缺点。 1.低保真原型 低保真原型对原型进行简单的模拟，大多使用黑、白、灰三种颜色，简单地表达产品的页面形态和功能架构，页面之间的关联使用连接线连接，以表达清楚产品流程。 低保真原型的优点。 ①快速产出：实现成本较低，可以快速产出页面形态，表达清楚产品思路。 ②快速迭代：在开发过程中，遇到问题需要修改原型时，可快速修改，修改成本低。 低保真原型的缺点。 交互细节表达不清楚，只能依赖于文字或文档。 产品流程依赖于连接线，容易造成误解，复杂的页面流程无法清晰表达页面之间的关系。 如图1-2所示，以黑、白、灰三种颜色进行色彩设计，应用简单的线框图与默认样式表达产品形态，并且使用连接线表达了页面之间的逻辑关系，这种原型称为低保真原型。 图1-2 2.高保真原型 高保真原型是还原程度比较高的原型设计，布局更加合理，应用简单的色彩搭配、图片、图标来表达产品设计思路，按钮具有鼠标悬浮、按下、选中效果，转场动画还原度更高，如图1-3所示。 高保真原型可以在以下五个维度进行考虑和评估。 完整性：主要指业务和功能方面的； 准确性：数据量，文案描述； 操作性：原型的跳转和亮点； 易用性：看起来清晰，操作的链条简单； 美观性：界面布局，版式，颜色搭配。 （1）完整性。 ①角色权限：同一个个系统或者同一个任务，不同的用户角色进入界面可能会不一样，流程可能也会不一样，进行原型制作时一定要考虑，系统中会不会出现这种情况，如何合理的安排布局； ②任务的流程：我们进行原型制作考虑流程时，通产会趋于理想化的流程，原型很顺利，但做出来的系统上线以后会出现各种各样的问题（例如：当前公司的考勤系统，正常每日一天，正常写周报就没有问题，但是偶尔出现要补填之前的考勤和周报的时候，就会出现各种问题），我们要考虑系统中不同的流程线和各种场景，进行多方面的分析和展现。 ③异常事件：每个系统在运行时都可能会出现异常情况，我们再进行原型设计时想到，就会为后续上线避免很多问题；例如：（1、设计支付的系统，会不会出现断网等其他异常情况；2、在利用OCR读取图片的文字进行回填时，回填准确度的考虑，就好像需要回填一个电话号码，但是文档中出现了两个或者三个电话号码，此时回填只有一个文本框必然会出现异常情况，就可以考虑，同时读取到可以点击的复选框中，让用户可以进行勾选填写） （2）准确性。 ①真实内容：各种内容数据尽量保持真实性（例如:曾经的一个系统中下拉列表中的选项有自然人和法人，但是在如果只考虑到法人的情况，那么在角色是自然人是可能整个的布局和界面都是不合理的） ②真实的数据量：在制作原型时，我们需要考虑到系统中数据量的极多或者极少的情况下，会不会出现显示异常的问题（例如：在存在柱状图的情况下，会不会一类数据时几十万，一类数据只有几条，导致界面的图形对比性极差，这个时候也许可以用数学上的方程什么的来解决；手机页面显示几千条记录，下滑翻看，这样真的会很可怕，可以通