axure8基础培训
AxureRP8实战手册
AxureRＰ８实战手册新手必须掌握得基础操作:本篇包含５6种常见得基础操作,初学者应在掌握本篇内容后再进行实战案例篇得学习,以免产生学习障碍。
同时,建议具备一定基础得读者学习本篇中相对生疏得内容,并加以掌握。
一 Axuｒe8.0基础教程(１-1０)***＊＊****＊＊****＊＊＊＊＊＊＊*****＊**＊*＊**本文目录*＊*＊＊＊＊*＊＊＊*＊****＊＊＊*＊＊＊*＊*＊＊*＊＊＊**第1章使用元件基础１。
添加元件到画布基础2。
添加元件名称基础３. 设置元件位置/尺寸基础4. 设置元件默认角度基础5。
设置元件颜色与透明基础6、设置形状或图片圆角基础7. 设置矩形仅显示部分边框基础8. 设置线段/箭头/边框样式基础9、设置元件文字边距/行距基础１0。
设置元件默认隐藏*＊＊＊*＊＊＊＊＊＊＊**＊＊*＊＊＊**＊＊＊**＊**＊＊＊***正文＊＊**＊＊***＊*＊＊*＊*＊＊*＊＊＊*＊＊**＊***＊*＊＊*第1章使用元件基础1. 添加元件到画布在左侧元件库中选择要使用得元件,按住鼠标左键不放,拖动到画布适合得位置上松开。
(图1-１)基础2、添加元件名称在检视面板得元件名称文本框中输入元件得自定义名称,建议采用英文命名、建议格式:ＰａssｗordＩnｐut０1或Passwoｒd０1名称含义:序号０1得密码输入框格式说明:“Password”表示主要用途;“Iｎpｕt”表示元件类型,一般情况下可省略,当有不同类型得同名元件需要区分或名称不能明确表达用途得时候使用;“01”表示出现多个同名元件时得编号;单词首字母大写得书写格式便于阅读、(图1-2)基础3、设置元件位置/尺寸元件得位置与尺寸可以通过鼠标拖拽调整,也可以在快捷功能或元件样式中进行输入调整。
(图1—3)ｘ:指元件在画布中得x轴坐标值。
y:指元件在画布中得y轴坐标值。
w:指元件得宽度值、h:指元件得高度值。
在输入数值调整元件尺寸时,可以在样式中设置,让元件【保持宽高比例】、(图1-4)基础4. 设置元件默认角度方式一:选择需要改变角度得元件,按住〈Ctrｌ＞键得同时,用鼠标拖动元件得节点到合适得角度。
Axure RP 8交互原型设计案例教程第9章 动态面板
Axure RP 8 交互原型设计案例教程
图 9-5 移除状态按钮
第9章
动态面板
9.1 动态面板的基本操作
9.1.3 管理动态面板
5. 移动状态 移动状态顺序可以使用以下两种方法。 （1）通过【动态面板状态管理】对话框排列状态顺序。 在【动态面板状态管理】对话框中，选择要改变顺序的状态，然后单击顶部工具栏中的【上 移】和【下移】按钮。 （2）通过【大纲】面板排列状态顺序。 在【大纲】面板中右击要移动的状态，从弹出的快捷菜单中执行【上移】和【下移】命令， 或直接选择要移动的状态，然后按下左键向上或原型设计案例教程
第9章
动态面板
9.1 动态面板的基本操作
9.1.3 管理动态面板
图 9-7 通过【动态面板状态管理】 对话框编辑状态
图 9-8 通过【大纲】面板编辑状态
Axure RP 8 交互原型设计案例教程
第9章
动态面板
9.1 动态面板的基本操作
9.1.3 管理动态面板
图 9-10 自动调整为内容尺寸
Axure RP 8 交互原型设计案例教程
第9章
动态面板
9.1 动态面板的基本操作
9.1.4 适应内容
也可以在【属性】子面板中找到【自 动调整为内容尺寸】选项，如图9-11 所 示。
图 9-11 【自动调整 为内容尺寸】选项
Axure RP 8 交互原型设计案例教程
Axure RP 8 交互原型设计案例教程
第9章
动态面板
9.1 动态面板的基本操作
9.1.3 管理动态面板
1. 添加状态 默认状态下，打开【动态面板状态管理】 对话框时，已经存在一个状态了，单击工具栏 中的【添加状态】按钮，即可添加新的状态， 如图9-3 所示。也可以通过下列两种方法添加 新状态：在【大纲】面板中右击动态面板元件， 从弹出的快捷菜单中执行【添加状态】或直接 单击【大纲】面板右侧的【添加状态】按钮。
Axure RP 8 交互原型设计案例教程第11章
图 11-6 设置【设置文本】动作
Axure RP 8 交互原型设计案例教程（微课版）
第11章
变量和函数
11.1 变量
11.1.2 全局变量
设置完成后，返回主页并按【F5】键浏览网页，在文本框中输入文本，如图11-7 所示。 单击【提交】按钮，即可弹出如图11-8 所示的弹出窗口。
图 11-7 在文本框中输入文本
全局变量对整个原型都有效，如果想将数据从一个元件传递到另一个元件或者从一个页面传 递到另一个页面中就要用到全局变量。鉴于此，在一个原型中，全局变量的名称不要出现重复的 情况。局部变量只能在某个元件的某个动作中有效，离开这个动作，局部变量就无效了，所以， 在一个原型中，局部变量的名称是可以重复使用的。
图 11-3 设置全局变量参数
Axure RP 8 交互原型设计案例教程（微课版）
第11章
变量和函数
11.1 变量
11.1.2 全局变量
（3）接着上面的对话框继续添加一个新动作【弹出窗口】，在右侧设置打开页为页面1，如 图11-4所示。
图 11-4 设置【弹出窗口】动作
Axure RP 8 交互原型设计案例教程（微课版）
ቤተ መጻሕፍቲ ባይዱ
图 11-11 自定义变量选项
Axure RP 8 交互原型设计案例教程（微课版）
第11章
变量和函数
11.2 函数
11.2.1 元件函数
下面举例说明这两个函数的含义。 （1）在主页页面上创建一个矩形 和一个圆形，分别以其形状命名，如图 11-12 所示。
图 11-12 创建的两个图形元件
Axure RP 8 交互原型设计案例教程（微课版）
图 11-14 添加的两个函数
2024版Axure8.0基础教程
通过设置交互事件和动作，测试原型的交互逻辑 是否正确、流畅。
兼容性测试
在不同设备和浏览器上测试原型的显示效果和交 互功能，确保良好的用户体验。
发布原型到云端或本地服务器
发布到Axure Cloud
通过Axure8.0内置的发布功能，可以将原型发布到Axure Cloud上，方便团队 成员在线查看和评审。
Axure8.0基础教程
目录
• Axure8.0概述与安装 • 基本操作与设置 • 交互设计基础 • 高级交互设计技巧 • 原型测试与发布 • 总结与展望
01 Axure8.0概述与 安装
Axure8.0简介及功能特点
专业的原型设计工具
Axure8.0是一款专业的原型设计 工具，支持快速创建高质量的交
对未来学习的建议与展望
• 深入学习Axure8.0的高级功能：在未来的学习中，建议学员们进一步探索Axure8.0的高级功能，如自定义函数、 复杂条件逻辑等，以应对更加复杂的设计需求。
• 关注行业动态与趋势：鼓励学员们关注UI/UX设计行业的最新动态和趋势，了解前沿的设计理念和技术，不断 提升自己的设计水平和竞争力。
交互样式
通过设置元素的交互样式，实现鼠标悬停、 点击等状态下的视觉效果。
案例：制作一个简单的交互式原型
设计界面布局
使用Axure8.0的组件和布局工具， 设计登录页面的布局和元素。
添加交互效果
为登录按钮添加点击事件，实现
跳转到另一个页面的效果；为输 入框添加输入验证，确保用户输
入正确的信息。
确定需求和目标
率等参数。
点击“保存”按钮，将项目保存在指定位置。建议将项目文件
03
和所有相关素材保存在同一个文件夹中，以便于管理。
Axure RP 8 交互原型设计案例教程第2章
图 2-1 查找元件
第2章
图形元件
2.1 图形元件的基本操作
2.1.2 使用图形元件
与一般的图形处理软件不同，Axure RP 创建图形元件的方法是：使用鼠标从【元件库】面板 中将某个元件拖到页面中。
Axure RP 8 交互原型设计案例教程（微课版）
第2章
图形元件
2.1 图形元件的基本操作
2.1.3 选择图形元件
Axure RP 8 交互原型设计案例教程（微课版）
第2章
图形元件
2.1 图形元件的基本操作
2.1.7 对齐和分布图形元件
对齐至少要选择两个对象，分布至少要选择3 个对象。在Axure RP 中有3 种方法可以完成对 齐和分布。
（1）使用主工具栏的按钮：
图 2-9 主工具栏的【对齐】和【分布】按钮
图2-5 变换对象的方向
Axure RP 8 交互原型设计案例教程（微课版）
第2章
图形元件
2.1 图形元件的基本操作
2.1.4 变换图形元件
2. 使用样式工具栏变换 在样式工具栏中，可以通过设置参数精确变换元件的位置和大小，如图2-6 所示。
图 2-6 样式工具栏的变换参数
Axure RP 8 交互原型设计案例教程（微课版）
Axure RP 8 交互原型 设计案例教程（微课版）
第2章
图形元件
微课版
第2章
图形元件
2.1 图形元件的基本操作
2.1.1 认识元件库面板
Axure RP 将所有与设计原型的相关对象统称为元件（Widgets），并且专门存放于元件库面 板中。Axure RP 提供了三类元件库，分别是：默认、流程图和图标。
第2章
图形元件
Axure RP 8交互原型设计案例教程第4章 文字处理
图 4-9 样式工具栏的文本格式化选项
Axure RP 8 交互原型设计案例教程
第4章
文字处理
4.3 格式化文本
4.3.2 使用【样式】子面板
【样式】子面板包含了样式工具栏中的所 有参数和按钮，还增加了【文字投影】、【行 间距】和【边距】选项，如图4-10 所示。
图 4-10 【样式】子面板中的文本属性设置
Axure RP 8 交互原型设计案例教程
第4章
文字处理
4.2 应用表格
4.2.3 编辑表格
图 4-8 插入行和列按钮
Axure RP 8 交互原型设计案例教程
第4章
文字处理
4.3 格式化文本
4.3.1 使用样式工具栏
设置文本的一般格式，可通过Axure RP 的样式工具栏进行操作，如图4-9 所示。
Axure RP 8 交互原型设计案例教程
第4章
文字处理
4.2 应用表格
4.2.3 编辑表格
编辑表格主要是指改变表格的大小、改变行高和列宽以及插入、删除行和列等。 1. 改变表格大小 2. 改变行高和列宽 3. 插入行和列 如果要在现有的表格中插入行或列，可以右击某个单元格，从弹出的快捷菜单中执行相应的插 入行和列的命令。还可以在【检视】→【属性】子面板中单击插入行和插入列按钮，如图4-8所示。 4. 删除行和列 5. 设置单元格的边框和底色
4.1.4 适合文本大小
适合文本大小是指文本框架的宽度或者高度与框架内文本的宽度或者高度大小匹配。可以双 击文本框架边缘的控制点快速实现框架适合文本的操作。
Axure RP 8 交互原型设计案例教程
第4章
ቤተ መጻሕፍቲ ባይዱ
文字处理
4.2 应用表格
2024版Axure培训资料课件
风格定位
根据项目需求，确定整体风格，如扁平化、拟物化等。
2024/1/29
色彩运用
运用色彩心理学原理，选择合适的色彩搭配，营造特定的氛围和情绪。
26
动画效果添加与优化
动画类型
了解Axure支持的动画类型，如淡入淡出、滑动、旋 转等。
动画设置
通过时间轴面板，精确控制动画的持续时间、延迟等 参数。
动画优化
交互面板
设置控件的交互行为，如点击、 滑动、拖动等
2024/1/29
5
常用操作与快捷键
2024/1/29
新建文件
01
Ctrl+N
打开文件
02
Ctrl+O
保存文件
03
Ctrl+S
6
常用操作与快捷键
预览原型
F5
添加注释
Ctrl+Shift+T
撤销操作
Ctrl+Z
2024/1/29
7
常用操作与快捷键
21
变量与函数应用
01
变量介绍
Axure支持使用变量来存储和管理数据，使得设计更加灵活和可维护。
2024/1/29
02
函数应用
Axure提供一系列内置函数，用户可以在表达式中使用这些函数来处理
数据和实现复杂逻辑。
03
案例演示
通过具体案例演示如何在Axure中使用变量和函数，提升设计的动态性
和交互体验。
制定设计规范
为确保设计的统一性和 可维护性，制定设计规 范，包括字体、颜色、 图标等元素的使用规范。
34
元件设计与复用策略制定
制定复用策略
分析项目中元件的使用场景和复用程度，制 定合理的复用策略，提高设计效率和一致性。
2024年度-Axure8从入门到精通
随着移动互联网的快速发展，产品设计需要适应不同平台和设备的显示需求。Axure8具 备跨平台和多端适配的能力，能够满足这一需求。
智能化与自动化
未来，原型设计工具将更加注重智能化和自动化的发展，以减少人工操作和提高工作效率 。Axure8也在不断升级和改进中，为用户提供更加智能化的设计体验。
24
04
高级功能探索
25
动态面板应用及效果展示
动态面板创建
在Axure8中，通过“动态面板” 工具创建可交互的动态界面元素 ，如滑动效果、弹出菜单等。
状态管理
为每个动态面板定义不同的状态 ，并通过事件触发状态间的切换 ，实现丰富的交互效果。
效果展示
利用Axure8的预览功能，实时查 看动态面板的交互效果，确保设 计符合预期。
10
基本操作与常用快捷键
新建文件
选择“文件”菜单下的“新建”命令 ；
保存文件
选择“文件”菜单下的“保存”命令 或使用快捷键Ctrl+S（Mac上为 Command+S）；
11
基本操作与常用快捷键
导入素材
在控件面板中选择“图片”控件，然 后选择要导入的图片文件；
预览原型
选择“发布”菜单下的“预览”命令 或使用快捷键F5。
4
软件安装与启动
• 安装完成后，在桌面或开始菜单找到Axure8图标，双击启动。
5
软件安装与启动
01
启动方法
02
03
04
通过桌面快捷方式启动；
通过开始菜单找到Axure8程 序启动；
如果是Mac用户，可以在“ 应用程序”文件夹中找到 Axure8启动。
6
界面介绍与功能概览
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
Axure8.0基础教程手册目录基础1.添加元件到画布 ------------------------------------------------------------------------------- 4 基础2.添加元件名称 ---------------------------------------------------------------------------------- 4 基础3.设置元件位置/尺寸--------------------------------------------------------------------------- 5 基础4.设置元件默认角度 ---------------------------------------------------------------------------- 6 基础5.设置元件颜色与透明 ------------------------------------------------------------------------- 6 基础6.设置形状或图片圆角 ------------------------------------------------------------------------- 7 基础7.设置矩形仅显示部分边框 ------------------------------------------------------------------- 7 基础8.设置线段/箭头/边框样式 ------------------------------------------------------------------- 8 基础9.设置元件文字边距/行距 --------------------------------------------------------------------- 8 基础10.设置元件默认隐藏 -------------------------------------------------------------------------- 9 基础11.设置文本框输入为密码 -------------------------------------------------------------------- 9 基础12.设置打开选择文件窗口 ------------------------------------------------------------------ 10 基础13.限制文本框输入字符位数 --------------------------------------------------------------- 11 基础14.设置文本框提示文字 --------------------------------------------------------------------- 11 基础15.设置文本框回车触发事件 --------------------------------------------------------------- 11 基础16.设置鼠标移入元件时的提示------------------------------------------------------------- 12 基础17.设置矩形为其他形状 --------------------------------------------------------------------- 12 基础18.设置自定义形状 --------------------------------------------------------------------------- 13 基础19.设置形状水平/垂直翻转 ----------------------------------------------------------------- 14 基础20.设置列表框的内容 ------------------------------------------------------------------------ 14 基础21.设置元件默认选中/禁用 ----------------------------------------------------------------- 14 基础22.设置单选按钮唯一选中 ------------------------------------------------------------------ 15基础23.设置元件不同状态的交互样式---------------------------------------------------------- 16 基础24.设置图片文本 ------------------------------------------------------------------------------ 16 基础25.切割/裁剪图片 ----------------------------------------------------------------------------- 17 基础26.嵌入多媒体文件/页面 -------------------------------------------------------------------- 18 基础27.调整元件的层级 --------------------------------------------------------------------------- 18 基础28.组合/取消组合元件 ----------------------------------------------------------------------- 19 基础29.转换元件为图片 --------------------------------------------------------------------------- 20 基础30.载入元件库 --------------------------------------------------------------------------------- 20 基础31.切换元件库 --------------------------------------------------------------------------------- 21 基础32.设置页面居中 ------------------------------------------------------------------------------ 21 基础33.设置页面背景（图片/颜色） ----------------------------------------------------------- 22 基础34.设置页面颜色（草图/黑白） ------------------------------------------------------------ 23 基础35.添加条件判断 ------------------------------------------------------------------------------- 24 基础36.设置条件逻辑关系 ------------------------------------------------------------------------- 25 基础37.用例条件转换 ------------------------------------------------------------------------------- 25 基础38.全局变量设置 ------------------------------------------------------------------------------- 26 基础39.局部变量设置 ------------------------------------------------------------------------------- 27 基础40.公式的格式及类型 ------------------------------------------------------------------------- 28 基础41.设置形状并排显示细边框 ---------------------------------------------------------------- 28 基础42.设置画布中的遮罩阴影 ------------------------------------------------------------------- 29 基础43.显示/隐藏交互与说明编号 --------------------------------------------------------------- 29 基础44.显示/隐藏两侧的功能面板 --------------------------------------------------------------- 30 基础45.展开/收起/弹出/停靠/关闭功能面板 ---------------------------------------------------- 30 基础46.关闭/恢复功能面板 ------------------------------------------------------------------------ 31 基础47.文件备份与恢复 ---------------------------------------------------------------------------- 31 基础48.设置自适应视图 ---------------------------------------------------------------------------- 32 基础49.快速预览查看原型 ------------------------------------------------------------------------- 33基础50.生成HTML查看原型--------------------------------------------------------------------- 33 基础51.生成部分原型页面 ------------------------------------------------------------------------- 35 基础52.为原型添加标志 ---------------------------------------------------------------------------- 36 基础53.发布原型到AXSHARE ------------------------------------------------------------------- 36 基础54.重新生成当前页面 ------------------------------------------------------------------------- 38 基础55.移动设备设置 ------------------------------------------------------------------------------- 38 基础56.WEB字体设置 ----------------------------------------------------------------------------- 39基础1.添加元件到画布在左侧元件库中选择要使用的元件，按住鼠标左键不放，拖动到画布适合的位置上松开。