Axure培训教程.pptx

Axure培训教程纲要CONTENTS PAGECONTENTS PAGE第 2 页简介1 12 2RP引入第 3 页过渡页TRANSITION PAGETRANSITION PAGERP引入1RP引入 通过何种方式表达原型设计最好？ 纸质原型很难充分表达各种交互行为 而静态页面，会增加沟通成本 我们需要的也许是针对交互设计的专业软件 RapidPrototyping-快速原型RP引入 容易理解，不用猜，减少项目失败的风险，降低沟通时间 不用等到网页程序都开发好, Axure RP产出的原型页面就可以让使用者提早进行测试了 页面可直接连结，动线容易理解, 直接体验原型 以清楚的网站原型来确认所有需求，不担心执行团队没搞懂AXURE将注定改变我的工作方式 决策层： 更加直观的理解系统行为，帮助决策 产品经理： 提高了各岗位间的沟通效率，降低沟通成本，保证项目进程 需求人员： 更加有效的与用户沟通，减少误解，保证需求质量 设计开发： 更加有效的协作沟通，降低沟通成本，减少误解，避免返工 用户： 更加直观的感受系统，尽早反馈用户的需求与系统的不足。学习容易，不需要有HTML技能 会使用PowerPoint的人, 大约只要30-60分钟就会使用Axure RP 以拖拉方式建立常用对象, 跟PowerPoint / Visio操作方式接近，容易上手不同职位，不同要求 设计师、程序员 要能够读懂交付物，并根据所提供的交付物来完成手头工作 需求提出部门 能够利用Axure RP的各个工具，画出简单的页面布局，并能根据页面布局，进行口述 销售 只要知道如何拿这些文档去忽悠客户就好了第 9 页过渡页TRANSITION PAGETRANSITION PAGE简介2Page.03Page.03Axure RP软件界面介绍工作区页面注释页面交互动态面板管理控件交互面板站点地图组件模块位置与大小Page.01Page.01站点地图 站点地图是一个页面导航面板, 在这里面可以对所设计的页面进行添加、删除、重命名和组织Page.01Page.01组件库 组件面板中有线框图组件和流程图组件，用这些组件进行线框图和流程图的设计。这里显示的是所有的组件,后面的一部分是流程图组件 Page.01Page.01常用组件图片双击 图片的操作比较简单，双击，选择一张图片打开即可。 需要重新添加图片是，在原来的图片上双击再选择。Page.01Page.01常用组件 这几个组件的操作都比较简单，直接拖入到工作区域使用即可。 可以改变尺寸、颜色、边框，可以输入文字。由于Axure对中文支持不好,所以有时在矩形、占位符里输入中文时会出现问题。 矩形、占位符、形状按钮都有很多形状可以变化、彼此之间也可以相互转换。 Page.01Page.01常用组件文字编辑组合、顺序对齐、分布填充、边框文字分布锁定控件改变形状右键菜单Page.01Page.01常用组件 矩形的形状变化，其中，圆角的大小是可以控制的，使用不同的形状得到一些组合形状。Page.01Page.01模块面板 模块是一种可重复利用的页面，比如页面的模板、导航栏、页首、页脚等这些类似的元素都可以通过模块来调用。 使用模块的好处是：修改模块时，原型中所有使用该模块的地方都会跟着一起修改。这样在设计时可以提高效率并且易于管理。 模块的面板和站点地图有点类似。可以添加、组织、编辑。Page.01Page.01模块面板模块的行为有三种：正常、作为背景、自定义组件 正常：这是默认状态，就是修改模块时，引用到页面的模块会跟着一起修改。 作为背景：当把模块调用到页面时会放置底层并且锁定。 自定义：这种模块可以在页面中进行修改而不会引起其他模块变化，类似于复制。根据不同版本不一定有这个行为Page.01Page.01简单交互Axure里的交互大致有四种： 定义连接 设置动作 多个条件场景 页面上的交互目前Axure RP 6 支持的事件如下： OnClick：鼠标点击 OnMouseEnter：鼠标的指针移动到对象上 OnMouseOut：鼠标的指针移动出对象外 OnFocus：鼠标的指针进入文字输入状态（获得焦点） OnLostFocus：鼠标的指针离开文字输入状态 （失去焦点） OnPageLoad：页面或模块载入 OnKeyUp: 释放按键Page.01Page.01简单交互Page.01Page.01简单交互定义链接 定义链接可以让一个组件响应一个动作时（如鼠标点击、飘过）链接到其他页面。在Axure里提供了四种链接方式：1.链接到设计中的页面2.连接到外部网址或文件3.重新载入当前页面4返回上个页面设计中的页面外部网址重新载入返回Page.01Page.01简单交互方法1方法2Page.01Page.01简单交互 除了定义链接之外，Axure里还可以设置丰富的动作，在Axure里，任何可以出发的事件中都可以执行这些动作。点击后打开高级编辑器Page.01Page.01简单交互添加动作编辑动作顺序 Axure里提供的动作在执行时是自上而下顺序执行的，在基本编辑器里，勾选一些动作后，Axure会按照默认的方法生成动作的执行顺序。当这些顺序不能满足需求时，可以尝试使用高级编辑器，可以自定义添加动作、改变执行顺序。Page.01Page.01简单交互Open Link in Current Window：在当前窗口打开一个页面 Open Link in Popup Window：在弹出的窗口中打开一个页面 Open Link in Parent Window：在父窗口中打开一个页面 Close Current Window：关闭当前窗口 Open Link in Frame：在框架中打开链接Open Link in Parent Frame：在父框架中打开链接Set Panel state(s) to State(s)：设置动态面板的状态转换Show Panel(s)：显示动态面板 Hide Panel(s)：隐藏动态面板 Toggle Visibility for Panel(s)：切换动态面板的可见属性（显示/隐藏） Move Panel(s)：根据绝对坐标或相对坐标来移动动态面板 Page.01Page.01简单交互Bring Panel to Front：将动态面板置为最前端Set Variable and Widget value(s) equal to Value(s)：设定变量值或控件值 Open Link in Parent Frame：在父页面的嵌框架中打开一个页面 Scroll to Image Map Region：滚动页面到Image Map所在位置 Enable Widget(s)：把对象状态变成可用状态 Disable Widget(s)：把对象状态变成不可用状态 Set Focus on Widget：设置焦点Wait Time(s)：等待多少毫秒(ms)后再进行这个动作Expand Tree Node：展开树状节点Collapse Tree Node：折叠树状节点 Other：显示动作的文字说明 Page.01Page.01简单交互 一个事件的发生在不同的场景中结果是不一样的，比如发送信息，发送失败和发送成功返回的结果是不一样的。 在Axure里，这样的多个场景的事件，可以通过条件设置来编辑，不同的条件会触发不同的场景。添加删除条件Page.01Page.01简单交互 在发送信息时，有“发送成功”和“发送失败”两个场景：对于“发送成功”来说，有这样的一连串事件：显示“正在发送”、输入框变为空白、等待一段时间后、显示“发送成功”。 类似的，发送失败时也有这样一串动作。 而判断消息发送是否成功则是根据实际应用中发送的情况而定。Page.01Page.01简单交互 Axure还支持页面层级的触发事件，当载入一个页面时，就会触发OnPageLoad事件。 OnPageLoad事件可以为我们设置页面在载入时的初始状态，并可以触发一些我们需要的场景的条件。 例如，一个导航会有一个初始状态和一个选中状态，当我们从一个入口进入到一个页面时，我们希望那个对应的导航按钮时处于选中状态，此时就需要使用OnPageLoad事件来设置。Page.01Page.01简单交互动态面板 Axure中很多的交互是由动态面板来实现的。 动态面板里面可以包含多个状态，所以通过一些事件可以对动态面板的状态进行切换，以此来实现交互效果。但任何时候都是只有一个状态是可见的，或者整个动态面板是被隐藏的。Page.01Page.01简单交互 双击动态面板的线框图，会有一个动态面板状态管理的对话框，在这里可以添加、删除、重命名、组织动态面板。 动态面板的第一个状态时它的默认状态。选择编辑之后可以对其进行设计，像画线框图一样。 动态面板的显示范围是在一个蓝色的虚线框内，这个也是动态面板对事件的响应范围。Page.01Page.01简单交互 动态面板管理面板。在这里也可以对动态面板进行添加、删除、组织等操作。双击可以对其进行编辑。 有时，动态面板较多时，在屏幕上的显示会让人觉得不方便，此时可以通过点击蓝色的方块对其取消显示（不会改变它的可见属性）。不显示显 示Page.01Page.01简单交互 动态面板有6种动作：1. 设置动态面板的转换状态2. 显示动态面板3. 隐藏动态面板4. 切换动态面板可见属性5. 移动动态面板6. 将动态面板置为最前 其中前3个用到的最多。第5个经常配合“等待时间”一起使用。可以制作一些动态效果。Page.01Page.01不足l中文输入法支持不好l遇到不能输入时，请立马放弃尝试l表格功能比较弱，不支持合并单元格l控件属性编辑不方便Page.01Page.01心得体会l有些交互设计师会对一些布局细节担忧，害怕自己会一直调整对齐和细节。记住，我们出的是可交互的原型，不是最终产品，不需要考虑太多的视觉细节，这些会由前端开发去进行标准的把控l不执着于Axure RP不能实现的业务需求Page.01Page.01心得体会lAxure RP软件也在不断的完善，有不能实现的效果l一个不能实现的效果，只要不影响项目的进度，不影响与执行人员的沟通，在工作中就不要过分的追求Page.01Page.01文档说明 在每一个文档首页写上文档说明，包括版本号、完成的部分、名词注释、较上一版更新生成CHM文档有乱码 将生成html文档目录下的后缀为hhc的文件,通过文本文件打开,选择ascii编码的格式另存. 将同目录下的hhp文件,用文本文件打开.将Language键值改为:中文(RPC). 打开cmd窗口,然后定位到C:Program FilesHTML Help Workshophhc.exe. 如果没有hhc.exe文件,请到微软上下载htmlhelp.exe文件安装. hhc.exe命令后带的参数是:hhp文件的路径.第 39 页