简介这份《Axure RP 9 使用详解》面向产品经理、交互设计师及原型设计初学者针对只会基础绘图、备注堆叠、原型难以向客户完整演示的问题系统梳理从界面认知到高保真交互的进阶用法并兼顾投标演示与客户沟通场景。资源包共1个docx文档约2.54MB目录按页面简介、工具简介、设计过程及方法、演示文件生成等模块展开便于按章节查阅与专项练习。内容涵盖元件样式与部件库、下拉列表、文本框、多选框、内链框架、热区、动态面板、水平与垂直菜单、隐藏显示顺序、右键效果、函数运算、图形外显批注和取色工具并说明如何生成HTML演示文件供团队与客户查看。已有6587人学习适合希望提升原型专业度、投标展示效果与团队协作效率的读者参考也可作为日常设计工作的查阅手册帮助减少需求沟通中的理解偏差。1. 从“画得像”到“点得动”Axure RP 9 原型方案要解决的真正问题很多人做原型卡住的地方往往在于交付不出去页面画得挺漂亮可一到评审现场下拉框展不开、菜单点不动、面板不会切换只能一边讲一边翻备注。更麻烦的是甲方或测试同学拿到文件自己一点全是死图。投标、评审、交接这几个场合原型能不能“自己会动”直接决定对方信不信你已经想清楚了。这份《Axure RP 9 使用详解》要解决的就是这件事把工具栏、原件样式、下拉列表、文本框、多选、内联框架、动态面板、交互、函数、批注、取色、演示文件生成这一整套东西按“能做出可点击演示稿”的目标串起来。它适合三类人赶毕设或课设需要交一份可运行原型的学生、要把需求讲清楚的产品方向从业者以及拿着原型去对需求的开发同学。2. 需求与选型为什么要用 Axure RP 9 做可交互演示稿2.1 先把“原型给谁看”定下来原型做多大、做多细取决于谁来看。同一个项目给导师看、给客户看、给开发看要求完全不同。我在动手前一般会先填一张简单的目标表把后续所有的元件选择和交互深度都锁在这张表里避免做着做着变成“越画越复杂但谁也点不动”。观看对象关注点交互深度交付形态导师或评审流程是否完整、逻辑是否自洽主干流程可点击分支可静态本地 HTML 现场演示甲方或客户界面观感、操作是否顺关键操作全部可点含悬停与右键生成演示文件对方自己点开发同学字段、跳转、显示规则交互说明 批注不必全部动画源文件 演示文件双份这张表的用法很直接只要某个交互不服务于表中“交互深度”这一列就先不做。很多人翻车就是因为把每个按钮都加了动画结果演示时一个卡顿全场等你加载。把范围收窄才能把关键路径做扎实。2.2 一个文件里怎么组织页面和命名页面结构乱是原型做不下去的头号原因。通常的做法是按“模块 - 页面 - 状态”三级划分命名统一用英文短词加下划线中文标题写在页面备注里。原因是 Axure 生成演示文件后左侧页面树会直接暴露给观看者命名一乱对方第一眼就觉得不专业。01_Login 登录 02_Home 首页 03_Order 订单模块 03_01_List 订单列表 03_02_Detail 订单详情 03_03_Popup 弹窗层用作动态面板状态编号前缀的作用不只是好看拖动调整顺序时编号不变页面树顺序稳定讲的时候可以直接说“看 03_02”。弹窗、浮层这类不占独立页面的内容统一收进对应页面的动态面板状态里别开一堆零散页面否则演示时来回跳页节奏全断。提示页面命名和元件命名要同步做。演示阶段排查问题先看名字能不能一眼定位比看坐标快得多。3. 总体设计控件、交互与函数的三层落地结构3.1 控件层原件样式、部件库与热区的分工控件层的核心判断只有一句能用基础元件解决的不要上动态面板。按钮、文本框、下拉列表、单选多选这些Axure 的部件库本身就带默认样式和状态直接拖出来改样式属性最快。原件样式里管颜色、边框、圆角、字号交互属性里挂点击与悬停。热区是容易被低估的一个元件。它本身不可见只负责定义点击范围。当你的图标是不规则图形、或者按钮视觉区和可点区不一致时用一个透明热区盖上去比去改图形本身省事得多。我一般把热区放在图层面板最上层命名成hot_xxx方便后面挂交互时快速找到。下拉列表控件、文本框、多选列表这三个属性面板里都有“默认值”和“选项”配置。文本框可以设置输入类型和提示文字多选列表直接勾选多个选项即可不需要自己拼装。这些东西做对了原型才像个能用的表单而不是一排装饰。3.2 交互层动态面板、内联框架与显示规则交互层是整个方案的主干。动态面板的本质是“一个容器多个状态”双击进入编辑每个状态是一整套独立的界面。选项卡、折叠展开、轮播、弹窗全靠它。关键动作有三个添加状态、设置默认状态、在交互里指定“设置面板状态”。内联框架则是“页面里嵌页面”。先选中框架给它命名再在交互里指向目标页面。它适合做侧边导航内容区、嵌入一段独立的流程演示。命名这一步不能省没命名的框架在交互列表里根本选不中这是新手最常见的卡点。显示与隐藏、显示顺序属于同一套逻辑在交互里用“显示/隐藏”动作控制元件可见性用“置于顶层/底层”控制遮挡关系。做弹窗时顺序很重要遮罩层在下、弹窗在上顺序反了就会出现“弹窗被遮罩盖住”的经典画面。3.3 函数层条件判断与动态计算函数用在需要“运行时才算出来”的地方比如根据输入值显示不同提示、按选项累加价格、判断必填项是否为空。写法是在交互的“添加条件”里组合判断或在设置文本时用表达式。// 判断文本框是否为空为空则显示提示元件 if [[ LVAR1 ]] 显示 提示_请输入内容 else 隐藏 提示_请输入内容 设置 文本_结果 [[LVAR1]] // 简单计价单价 × 数量 设置 文本_总价 [[ LVAR1 * LVAR2 ]]LVAR1、LVAR2是局部变量在同一个交互动作里通过“添加局部变量”绑定到具体元件或页面属性上。要点在于变量必须先绑定再引用顺序错了表达式就是空的。数学运算和逻辑判断够用就行别在原型里写复杂算法那是开发的活原型只需要证明“这个逻辑走得通”。4. 关键模块实现从主界面到右键菜单的可点击细节4.1 主界面骨架与水平/垂直菜单主界面先搭骨架顶部放水平菜单左侧放垂直菜单中间留内容区用内联框架承载。菜单项用矩形或文本元件加悬停样式选中态单独做一个样式变体通过“设置选中”动作切换。交互设置菜单项_订单 鼠标单击时 → 设置选中 当前元件 true 设置面板状态 内容区 订单列表 隐藏 提示_空状态这里的顺序有意义先切选中态再切内容最后清空状态提示视觉上才连贯。垂直菜单同理只是把目标面板换成另一组状态。菜单项一多建议给每个菜单项统一命名规则menu_模块名后面批量挂交互时不至于点错。4.2 下拉列表、文本框与多选的联动表单区最容易做出“死图感”。三个控件串起来就能验证联动选了下拉列表的某个值文本框的可编辑状态跟着变多选框的选项跟着过滤。下拉列表_类型 选项改变时 → if [[ LVAR1 企业 ]] 显示 文本框_税号 隐藏 文本_个人提示 else 隐藏 文本框_税号 显示 文本_个人提示这套联动做完评审时对方自己点两下就能理解业务规则比讲十分钟管用。多选列表的取值在函数里是集合做“至少选一项”的校验时用长度判断比逐项判断省事。4.3 动态面板做弹窗与选项卡弹窗的标准做法一个铺满屏幕的半透明遮罩 一个居中的动态面板面板里放多个状态对应不同弹窗内容。触发时同时显示遮罩和面板关闭时一起隐藏。按钮_删除 鼠标单击时 → 显示 遮罩层逐渐显示 200ms 显示 面板_弹窗置于顶层 设置面板状态 面板_弹窗 确认删除 按钮_取消 鼠标单击时 → 隐藏 遮罩层 隐藏 面板_弹窗选项卡用同一个面板的不同状态即可切换时只改状态名不改位置视觉上就是内容在换。渐变时间建议控制在 200ms 以内现场演示时过长的动画会拖节奏。4.4 内联框架交互、右键效果与悬浮说明内联框架先命名再挂交互这一步前面强调过。框架内嵌的页面可以独立设置交互主页面通过“在框架中打开链接”切换内容做左侧导航 右侧内容的经典布局最合适。右键效果靠“鼠标右键单击时”这个触发事件弹出一个定位在鼠标附近的面板。它能让演示稿一下子“像真的”但要克制只给列表行、画布这类确实需要右键菜单的区域加加多了反而干扰。原件悬浮说明用“鼠标移入时显示、移出时隐藏”控制一个小提示元件适合字段解释和操作引导。图形外显批注则是另一种思路插入批注图形写好备注命名后右键设为隐藏需要讲解时再显示。批注内容和演示界面分离讲的时候干净讲完能收起来。4.5 取色与视觉一致性取色工具解决的是“颜色到处不一样”的问题。我一般先定三个基础色主色、辅色、文字灰做元件时全部用取色工具从参考图或品牌色板上取而不是手输十六进制。手输的问题是每次都会有细微偏差页面一多整体观感就散了。取色之后把颜色记在页面备注里后面别人接手也能对上。5. 避坑与排查原型演示现场最容易翻车的五个点5.1 演示文件打开是白屏或图片缺失现象生成的 HTML 在别人电脑上打开图全丢了。原因通常是生成时选择了“图片单独存文件夹”而复制时只拷了 HTML。解决生成演示文件时确认输出目录完整整个文件夹一起打包别只发单个文件。5.2 交互点了没反应现象按钮设了交互点下去毫无动静。原因多为元件被上层透明元件挡住或者交互挂在了错误的元件上比如挂在组上而非组内元件。解决图层面板从上往下看一遍确认点击目标在最上层热区命名后逐个核对交互绑定对象。5.3 动态面板切换后状态错乱现象切了几次选项卡内容对不上了。原因是没有设置默认状态或者交互里写的是“下一状态”而不是指定状态。解决统一改为指定具体状态名并给每个面板设一个明确的默认状态别依赖顺序。5.4 函数表达式结果为空现象总价、提示文字一直是空的。原因是局部变量没绑定或引用的元件名拼错。解决先检查交互里的局部变量列表是否为空再核对元件名大小写表达式先用固定值测通再换成变量。5.5 批注和说明在演示时全露出来现象现场演示满屏批注框。原因是批注图形设了隐藏但没在页面载入时执行隐藏或干脆忘了设。解决把批注统一放进一个组页面载入时隐藏整组讲解时用一个按钮切显示。6. 验收与答辩用一份检查清单把原型交出去原型做完不等于能交。我习惯在交付前走一遍固定检查流程顺序是从“别人能不能打开”到“别人能不能看懂”最后才是“讲得好不好”。先做可运行性验收。生成演示文件后换一台没装 Axure 的电脑打开逐项点主流程能不能走通、每个按钮是否有反馈、弹窗能否关闭、菜单切换是否稳定。这一步经常出问题血泪经验是别在自己机器上测完就发出去。再做完整性验收。对照页面树数一遍主干页面齐不齐、空状态和异常提示有没有、必填校验有没有。做一个简单表格自查检查项判定标准结果主流程从登录到核心操作全程可点通过 / 不通过表单校验空值、格式错误有提示通过 / 不通过弹窗能打开、能关闭、层级正确通过 / 不通过导航菜单选中态与内容区同步通过 / 不通过批注默认隐藏可切换显示通过 / 不通过最后是答辩环节的技巧。讲原型不要按页面顺序平铺按“一个用户从进入到完成目标”的路径讲边讲边点让对方看到状态变化。遇到对方临时提的需求别急着现场改文件先口头确认逻辑记在批注里演示结束再改。现场改文件是最大的时间黑洞改一处漏三处节奏直接崩。从那以后我每次交原型前都强制走一遍“换机器打开 主流程点一遍 批注全隐藏”这三步哪怕时间再紧也不跳。这套动作花不了十分钟但能挡掉绝大部分现场尴尬。希望帮到你。本文还有配套的精品资源点击获取