Axure RP与APP原型设计完全学习教程

作者简介

李鹏宇，男，1982年4月出生。2006年6毕业于哈尔滨师范大学，获得理学学士学位；2010年4月毕业于哈尔滨理工大学，获得理学硕士学位；2006年至今，从教于哈尔滨铁道职业技术学院，副教授。主要研究方向包括计算机应用技术，物联网应用技术等相关领域。先后参加省重点课题十余项，其中主持黑龙江省教育科学研究规划课题一项，获批实用新型专利五项；在国家级期刊发表十余篇学术研究论文。

内容简介

在了解Axure的使用技巧并实际操作一些简单的案例之后，本章开始我们将学习原型制作重要的一环 节——交互设计。交互设计现在已经衍生为一门学科，是产品设计不能忽略的一部分。本章主要介绍如何利用Axure完成原型图的交互事件。 4.1 Axure RP交互 如果说产品的目的是通过功能帮助用户解决问题，达成目标，那么交互设计就是用户通过操作（行为）与产品进行交互，完成产品流程（任务），达成目标。其中用户为完成目标所进行操作的成本、体验、感受是用户体验，交互设计对用户满意度有着关键的影响。交互设计是通过对产品关键路径和关键操作的规划设计，缩短用户目标达成的路径，或在用户目标达成过程中让用户感受愉悦，至少不困扰或厌烦。交互的目的可通过如下所示的简图来描述。 4.1.1? 交互设计可用性原则 在交互设计上，人机交互博士尼尔森（Jakob Nielsen）析了两百多个可用性问题，分析提炼出十项通用型原则，并在1995年1月1日发表了《十大可用性原则》，是产品设计与用户体验设计的重要参考标准。下面对这十项原则进行简单介绍。 （1）反馈原则 系统应该在合理的时间、用正确的方式向用户提示或反馈目前系统在做什么，发送了什么。让用户和系统之间保持良好的沟通和信息传递；系统要告知用户发生了什么，或了解用户预期的是什么，及时反馈，如下图所示。 （2）回退原则 用户经常会不小心操作错误，需要一个功能让程序迅速恢复错误发生之前的状态。用户 误操作的概率极高，对于误操作，产品应尽量提供“撤销”“回滚”“反悔”功能，让系统返回错误之前的状态。业务流程类产品对于此类操作要考虑周期，比如可以撤销某些状态的订单，但对于某个状态之后的订单是无法撤回的，如下左图所示。 （3）隐喻原则 系统要采用用户熟悉的语句、短语、符号来表达意思。遵循真实世界的认知习惯，让信息的呈现更加自然，易于辨识和接受。产品设计中，采用符合真实世界、习惯认知的元素，让用户可以通过观察、联想、类别等方法轻松理解系统要表达的含义，如下右图所示。 （4）一致原则 同样的情景、环境下，用户进行相同的操作，结果应该是一致的；系统或平台的风格、体 验也应保持一致。可以在设计过程中梳理设计规范，统一设计风格，保持系统的一致感，如下 图所示。 （5）防错原则 系统要尽量避免错误发生，这好过出错后再给提示。在进行设计时，要充分考虑如何避免 错误发生，再考虑如何检查、校验异常，如下左图所示。 （6）记忆原则 让系统的相关信息在需要的时候显示出来，减轻用户的记忆负担。系统的应用应该减轻用 户的负担，而不是加重负担。对于可以帮助用户分担的部分，尽量分担，如下右图所示。 （7）灵活易用原则 系统的用户中，中级用户占据多数，初级和高级用户相对较少。系统应该为大多数人设计， 同时兼顾少数人的需求，做到灵活易用。好的产品是有门槛的，门槛高度覆盖最典型的用户画 像，同时又为跨越门槛提供了平缓的路线，如下左图所示。 （8）简约设计原则 对话中不应包含无关的或没有必要的信息，增加或强化一些信息就意味着弱化另一些信息， 重点太多，等于没有重点。把握好强调、突出的度，保持整体的平衡，如下右图所示。 （9）容错原则 错误信息应该用通俗易懂的语言说明，而不是只向用户返回某个错误代码；提示错误时要 给出解决问题的建议。将错误转化为用户可以理解的语句，并告诉用户该如何解决，如下左图 所示。 （10）帮助原则 对于一个设计良好的系统，用户应该不需要经过培训就可以上手，但提供帮助文档依然是 必要的。帮助信息应该易于检索，通过明确的步骤引导用户解决问题，如下右图所示。 4.1.2? 交互事件 交互，即交流互动。 Axure中交互事件就是用一些用例对产品使用者不同的输入做出反应，当用户对页面或元件进行不同的操作时，都有对应的事件发生。 在Axure中对不同的事件进行用例编辑，通过添加动作、组织动作、配置动作三个步骤，最终完成一个交互事件，如下图所示。 4.1.3? 交互的位置 交互是用户可在产品上进行的操作进行反馈，所以交互的位置就是对产品的每一个页面进行的操作，对页面上的不同元件进行单击、双击等操作，以及输入、跳转等，如下图所示。 以搜索引擎的搜索页为例，页面上有很多可以进行交互的位置。搜索框可以进行输入操作，搜索结果筛选可以进行选择操作。搜索结果、搜索热点等单击后会跳转到其他页面。此外，鼠标悬停在可单击的文字或图片上会从“箭头”变成“小手”。单击后的页面文字会变成紫色，未单击的不变，如下图所示。 4.1.4? 交互的动作? 在发生人机交互时，每一个事件都有响应的动作，这就是交互的动作。不同的事件交互动作有很大的差异，如下左图所示。 以登录界面为例，输入用户名和密码两栏的动作主要有两个，包括文本输入时“手机/邮箱/用户 名”和“密码”两个文本隐藏，并存储用户输入的用户名和密码，作为登录的条件判断，如下右图 所示。 在单击“登录”时，首先判断是否输入用户名和密码，如下左图所示。 用户输入后，首先判断输入的文本是否符合要求，用户名和密码是否匹配。在发生错误时，如 下右图所示。 登录流程中的每一个条件判断、用户提示、帮助等都是交互动作。在Axure中，交互动作基本上涵盖了所有可能的情况，可以保证制作高保真原型图的需要，如下图所示。 4.2 Axure RP事件 Axure RP中事件主要分为页面事件和元件事件，页面与元件可能发生的事件略有差异。而元件事件也分为普通元件事件和特殊元件事件，一些元件本身就需要配置不同的动作和状态，比如动态面板。 4.2.1? 页面事件的发生 写一篇文章需要有时间、地点、人物三大要素，页面事件的发生也有类似的三要素—事件、 地点、发生什么，即when、 where、 what。 When： 什么时候发生交互动作？在Axure术语中，用事件（Events）来表示交互动作发生的时刻，例如，当用户在一个网页上单击切换按钮时。 Where： 交互在哪里发生？任何一个控件都可以建立交互动作，如矩形框、单选按钮或下拉列 表，需选中对应的位置再做交互动作的配置。 What： 将发生什么？在Axure中，将要发生的称为动作（Actions）。动作编辑时定义了交互的结果。例如，光标悬停在一段文字上时，文字更换颜色。 确定了这三大要素之后，页面事件就会准确且恰当地发生。 交互设计师一定会用的原型制作软件！产品经理一定熟知的原型设计方法！不管你是刚入行的交互设计师，或是界面设计师转行交互设计师，还是想成为全能的产品经理，本书均能帮你在短时间内扎实掌握Axure软件的使用方法和设计应用方法。图文并茂，分步详细教学，搞定Axure RP交互原型设计，这一本就GO！