Axure_RP_Pro_中、高级交互实例教程

Axure 中级互动设计 1——控制 Dynamic Panal 1. Axure RP 实现更丰富的互动设计 网站开发技术越来越丰富了，这是我们正在经历的过程，也是未来的趋势。不管是AJAX 或JavaScript，甚至是 Flash、Silverlight、JavaFX，这些都被归类为 RIA(Rich Internet Application)的技术，能够让网站介面更丰富，展现更优质的人机互动。 同时，这个趋势也挑战了传统的文书软体或绘图软体，当这些软体受限于仅能表现单一画面与单一状态的情况下，您很难把心目中最友善的互动方式表达清楚并设计出来。 Axure RP 与其他的wireframe 软体，最大的差异在于能够进行互动设计(Interaction Design)，且可以立即将结果呈现于prototype 上，而不是只有文字叙述。更棒的一点是，学习 Axure RP 的互动设计，您并不需要学习 HTML 或Java Script 语法，只要透过一些设定与操作，便可以完成多样而创新的互动介面设计。 在Axure RP 设计出来的Prototype 中，最简单的互动设计是网页连结，透过滑鼠的click 来串起使用者与网站的互动流程。然而，真正发挥 Axure RP 在互动设计上的惊人特色，并不是只有连结这么简单的互动，您可以藉由学习 Dynamic Panel (动态面板)物件的操作与控制，来做到更丰富更友善的互动介面设计。 2. 认识 Dynamic Panel Widget Dynamic Panel (动态面板) 这种物件是专门用在设计Prototype 动态功能的Widget，Dynamic Panel 可以包含一或多个状态(State)，每个状态本身是一个小页面，藉由控制状态(State)的顺序或隐藏/显示 Dynamic Panel 来达成互动介面的整个表现。 就像其他 Widget 一样，Dynamic Panel 可以用拖放的方式从 Wireframe 窗格加入到画布中。 学习 Dynamic Panel 的互动设计之前，有 2 个重要的概念必须先认识： (1) Dynamic Panel (动态面板)：一种透明的物件，本身可以包含很多个状态 (State)，而每个状态都是一个小网页。被放置在最上层的状态就是该面板的长相。 (2) State (状态)：每个状态都是一个小网页，而这个小网页的边界与大小，与所属的 Dynamic Panel大小相同。不同的 State 可以重叠在同一个 Dynamic Panel 里头，唯有被控制放在最上层的 State，才会呈现于 Prototype 的画面中。以 Axure RP 所设计出来的多样互动介面，大多藉由各种触发事件(Event)来控制 Dynamic Panel 显示或消失，或控制哪个 State 在最上层来模拟出实际的...