Axure RP 8.0 网站产品原型设计全程揭秘

第1 章 网站产品原型设计概述
1.1　网站产品原型设计的概念 1
1.2　参与网站产品原型设计的人员 1
1.2.1　UI 设计师 2
1.2.2　UE 设计师 2
1.2.3　产品经理 2
1.3　创建网站产品原型的方法 3
1.3.1　纸张描绘网站原型 3
1.3.2　使用PowerPoint 和Visio 绘制网站原型 3
1.3.3　专业网站产品原型设计软件 4
1.4　网站产品原型设计的重要性 4
1.5　网站产品原型设计的作用 5
1.6　用户体验在网站原型设计中的表现 6
1.6.1　用户体验内容概述 7
1.6.2　用户体验产出过程 8
1.7　网站产品原型设计中的用户体验 10
1.7.1　网站原型设计中的用户体验层面 10
1.7.2　原型设计中的用户体验层面分析 12
1.8　网站产品原型设计中用户体验的原则 12
1.8.1　标志引导设计 12
1.8.2　设置期望并提供反馈 13
1.8.3　基于人类工程学设计 14
1.8.4　页面元素保持一致 14
1.8.5　提供纠错渠道 14
1.8.6　靠机器辨识而非人力记忆 15
1.8.7　考虑到不同水平的用户 15
1.8.8　提供上下衔接文档 15
1.8.9　争取特性展示 16
1.8.10　技巧留白 16
1.9　网站产品原型设计流程 17
第2 章 初识Axure RP
2.1　初步了解Axure RP 18
2.2　Axure RP 的下载与安装 19
2.2.1　安装与下载软件 19
实例01—— 安装Axure RP 19
2.2.2　汉化及启动Axure RP 21
2.3　Axure RP 工作界面简介 22
2.4　Axure RP 的菜单栏 23
2.4.1　“文件”和“编辑”菜单 23
2.4.2　“视图”菜单 23
2.4.3　“项目”菜单 23
2.4.4　“布局”菜单 24
2.4.5　“发布”菜单 24
2.4.6　“团队”“账户”和“帮助”菜单 24
2.5　Axure RP 的工具栏 25
2.5.1　基本工具 25
2.5.2　样式工具 29
2.6　Axure RP 的面板和工作区 29
2.6.1　面板 29
2.6.2　工作区 31
2.7　自定义工作界面 32
2.7.1　自定义工具栏 32
实例02—— 自定义工作列表 32
2.7.2　自定义工作面板 33
2.8　使用Axure RP 的帮助资源 33
2.9　Axure RP 的主要功能 34
2.9.1　绘制网站结构图 34
2.9.2　绘制网页示意图 35
2.9.3　绘制流程图 35
2.9.4　实现交互设计 35
2.9.5　原型输出 36
第3 章 页面设置与自适应视图
3.1　使用欢迎界面 37
3.2　新建和设置Axure RP 文件 38
3.2.1　纸张尺寸与设置 38
3.2.2　文件储存 39
3.2.3　启动和回复自动备份 39
实例03—— 使用自动备份恢复数据 39
3.2.4　储存格式 40
3.3　“页面”面板 40
3.3.1　添加和删除页面 41
实例04—— 为文件创建和删除页面 41
3.3.2　移动页面 42
3.3.3　查找页面 42
3.4　“检视”面板 43
3.4.1　页面属性 43
3.4.2　页面说明 44
3.4.3　页面样式 45
3.5　辅助线和网格的使用 46
3.5.1　辅助线的种类 46
3.5.2　创建辅助线 48
实例05—— 辅助线的创建 48
3.5.3　编辑辅助线 49
3.5.4　网格的使用 50
3.6　设置遮罩 51
3.7　使用自适应视图 52
3.7.1　自适应视图的作用 52
3.7.2　编辑自适应视图 52
实例06—— 设置自适应视图 53
第4 章 Axure RP 元件的使用
4.1　了解“元件”面板 56
4.1.1　“元件”面板 56
4.1.2　添加元件到页面 57
4.2　元件的类型 59
4.2.1　基本元件 59
实例07—— 分离网页中的图片 64
4.2.2　表单元件 65
实例08—— 设置网页中文本框的提示文字 68
4.2.3　菜单和表格元件 70
实例09—— 制作垂直菜单 72
4.2.4　标记元件 74
实例10—— 制作标签说明 77
4.2.5　流程图和图标元件 77
实例11—— 绘制流程图 78
4.3　“概要”面板的作用 81
4.4　元件的属性 82
4.4.1　交互事件中的页面交互 82
实例12—— 打开页面链接 84
4.4.2　交互事件中的元件交互 85
实例13—— 设置网页中的文本 90
实例14—— 设置按钮状态 91
4.4.3　设置交互样式 92
4.5　设置元件的样式 93
4.5.1　元件外形样式 93
4.5.2　字体样式 97
4.6　创建和管理样式 98
4.6.1　创建并应用页面样式 98
实例15—— 创建页面样式 98
4.6.2　创建和应用元件样式 99
4.6.3　编辑样式 100
4.6.4　使用格式刷 101
4.7　元件的转换 102
4.7.1　转换为形状 102
4.7.2　转换为自定义形状 102
4.7.3　转换为图片 104
4.8　创建元件库 104
实例16—— 创建元件库 106
4.9　使用外部元件库 107
4.9.1　下载元件库 107
4.9.2　载入元件库 108
第5 章 Axure RP 母版的使用
5.1　母版的基本概念 110
5.2　创建和编辑母版 111
5.2.1　创建母版 111
实例17—— 绘制手机状态栏 111
5.2.2　编辑母版 113
实例18—— 网页线框图 113
5.2.3　删除母版 115
5.3　使用母版 115
5.3.1　拖放行为 115
实例19—— 网站图标摆放位置 117
5.3.2　添加到页面 118
5.3.3　从页面中移除 120
5.4　母版使用情况 120
第6 章 变量、表达式和函数的使用
6.1　使用变量 121
6.1.1　全局变量 121
实例20—— 制作按钮单击效果 122
6.1.2　局部变量 124
6.2　设置条件 125
6.3　使用表达式 127
6.3.1　运算符类型 127
6.3.2　表达式的格式 127
6.4　函数的使用方法 127
实例21—— 制作锁屏界面 128
6.5　常见的函数 130
6.5.1　中继器/ 数据集函数 130
6.5.2　元件函数 130
实例22—— 制作查看商品大图效果 130
6.5.3　页面函数 132
6.5.4　鼠标指针函数 132
实例23—— 制作放大镜效果 132
6.5.5　字符串函数 135
6.5.6　数字函数(Number) 135
6.5.7　数学函数 135
实例24—— 制作商品结算按钮 136
6.5.8　日期函数 138
实例25—— 制作查看实时日期效果 139
第7 章 动态面板元件的使用
7.1　熟悉动态面板元件 143
实例26—— 添加动态面板元件 144
实例27—— 制作导航选中效果 145
实例28—— 制作轮播图效果 147
7.2　转换为动态面板元件 149
实例29—— 登录页面切换 150
7.3　动态面板元件的作用 153
7.3.1　显示与隐藏效果 153
7.3.2　滑动效果 153
7.3.3　拖动效果 153
7.3.4　多状态效果 154
第8 章 中继器元件的使用
8.1　中继器元件的基本组成 155
8.1.1　数据集 155
8.1.2　项目交互 156
8.1.3　样式设置 156
实例30—— 制作商品展示页面 157
8.1.4　属性设置 159
实例31—— 制作单选按钮效果 159
8.2　数据集的操作 161
实例32—— 使用中继器实现自增 162
8.3　项目列表操作 163
实例33—— 使用中继器添加分页1 163
实例34—— 使用中继器添加分页2 165
实例35—— 使用中继器添加分页3 165
实例36—— 使用中继器添加分页4 166
第9 章 网站产品原型的发布与输出
9.1　创建共享位置 169
9.1.1　下载安装SVN 软件 169
9.1.2　创建版本库 173
9.2　TortoiseSVN 客户端应用 178
9.2.1　新建共享文件 178
实例37—— 使用Repository1 共享文档 178
9.2.2　修改共享文档 180
实例38—— 设置Repository1 共享文档 180
9.3　使用团队项目 182
9.3.1　创建团队项目 182
9.3.2　打开团队项目 184
9.4　使用Axure Share 185
9.4.1　创建Axure Share 账号 185
9.4.2　上传原型到 Axure Share 185
9.5　发布和查看原型 187
9.6　使用生成器 189
9.6.1　HTML 生成器 189
9.6.2　Word 生成器 192
9.6.3　CSV 报告生成器 194
9.6.4　打印生成器 195
第10 章 商业性综合案例
10.1　网站登录界面案例 196
10.1.1　案例分析 196
10.1.2　色彩分析 196
10.1.3　设计思路 196
实例39—— 制作按钮的不同状态 197
实例40—— 切换不同的登录页面 199
实例41—— 按钮的不同状态2 201
10.2　购物网站商品筛选案例 202
10.2.1　案例分析 203
10.2.2　色彩分析 203
10.2.3　设计思路 203
实例42—— 自定义复选框 203
实例43—— 商品价格排序 206
实例44—— 商品新款筛选 210
10.3　网页版微博案例 212
10.3.1　案例分析 212
10.3.2　色彩分析 213
10.3.3　设计思路 213
实例45—— 微博首页单条信息 213
实例46—— 微博查看大图 216
实例47—— 微博转发页面 218
10.4　网页版百度首页案例 221
10.4.1　案例分析 221
10.4.2　色彩分析 221
10.4.3　设计思路 221
实例48—— 百度首页搜索框 222
实例49—— 制作链接页面 224
实例50—— 新窗口和弹出窗口 226
实例51—— 父级窗口和内联框架 229