产品特色
编辑推荐
这是一本轻松教你掌握Axure原型设计技术的教程。
更是一本将产品经理设计思路融入其中的方法论。
它用经典的案例教给你现实工作中必须要掌握的模型。
将案例“据为己有”,因为模仿就是学习方式和**旁人的前奏。
同时本书本身就是一个产品,而你将会是这阅读体验的受益者,因为它带给你的将不止是简单的思考。
内容简介
原型设计已经是互联网行业产品设计过程中不可缺少的环节,也是检验互联网产品经理能力的标配指 标。本书以Windows系统下流行的快速原型设计工具Axure RP为基础,以丰富的案例展示了Axure强大的原型设计能力。
本书首先介绍为什么要进行原型设计?它到底能给我们带来什么样的好处?然后了解工作环境的构成;从第3章开始进入原型设计操作阶段,从简单的元件命名开始,到一些高级技巧的应用,提炼了原型设计过程中的常用操作;第4章介绍预览操作,随时查看你的设计效果;第5章变量与函数的内容是学习第6章“事件处理”的基础,“事件处理”是Axure原型设计中的精髓,同时配合第7章的动画效果,让你的原型更加生动;动态面板在Axure中无处不在,第8章单独介绍它的使用方法;第9章的中继器是一个有趣且有用的元件,通过编辑数据和布局样式,可以实现丰富的列表展示样式;元件库为提高生产效率而存在,因此在第10章会详细介绍如何设计自己的元件库;在后两章里,我们以实际案例为基础,针对不同的场景,全面介绍如何使用 Axure工具,涵盖Axure的大部分知识点,其中第12章更是将多场景完整衔接,通过练习你将学会如何在实际项目中综合应用软件。
本书附赠资源包括书中所有案例的素材文件、效果文件以及案例的操作演示视频,读者可结合视频进行学习,提高学习效率。本书主要适合互联网和移动互联网产品经理、需求分析师、UI/UE设计师以及交互设计师等学习和使用。如果你有志于从事产品经理行业,希望本书能对提升你的产品原型设计能力有所帮助。
作者简介
朱传明,先后就职于亚信联创和北京思特奇科技,目前任职思特奇公司电子商务和互联网支撑产品线电子渠道部门产品经理角色,关注移动互联网、交互设计和用户体验方面的内容,多年的开发和需求分析经验,熟悉Axure原型设计工具,在公司产品线内部做了系列Axure原型培训教程,有着扎实的理论知识和丰富的实践经验。
目录
01 原型设计的基本知识/017
1.1 Axure RP 介绍/018
1.1.1 当前版本/018
1.1.2 主要功能/018
1.1.3 其他原型设计工具/019
1.2 原型设计的概念/020
1.3 原型设计的重要性/022
1.4 我如何才能开始/022
1.5 组件化的设计思路/023
1.6 学习路径/023
1.7 小结/024
02 Axure工作空间的介绍/025
2.1 概述/026
2.2 工具栏/026
2.2.1 选择、连接和画笔/026
2.2.2 排列顺序/027
2.2.3 编组与打散/028
2.2.4 对齐与分布/028
2.2.5 锁定与解锁/029
2.2.6 样式工具栏/029
2.3 左侧面板/030
2.3.1 站点地图/030
2.3.2 元件库/030
2.3.3 母版库/031
2.4 右侧面板/032
2.4.1 属性和样式/032
2.4.2 页面元素大纲/032
2.5 设计区域/033
2.5.1 右键菜单/033
2.5.2 用例编辑/034
2.5.3 变量与函数编辑/036
2.6 小结/036
03 Axure原型设计的操作技巧与解析/037
3.1 关于元件命名/038
3.2 怎样让内容屏幕居中/039
3.3 背景适应宽度/039
3.4 交互样式设置/040
3.5 矩形的基本样式设置/040
3.5.1 选择形状/040
3.5.2 背景颜色/041
3.5.3 文字颜色/041
3.5.4 边框大小、颜色和线段类型/041
3.5.5 圆角/042
3.5.6 边距/042
3.5.7 阴影/042
3.6 吸管工具的使用/042
3.7 自定义元件的设置/044
3.8 动态面板的特性/045
3.8.1 容器性/045
3.8.2 多状态性/046
3.8.3 整体性/046
3.8.4 固定到浏览器/046
3.9 如何设置选项组/046
3.10 选中属性的应用/048
3.11 母版的使用/049
3.12 响应式页面设计/049
3.13 图片Scale-9属性的应用/052
3.14 如何显示草图效果/054
3.15 发布到移动终端/054
3.16 小结/056
04 预览与发布/057
4.1 关于预览/058
4.2 关于发布/058
4.2.1 导出HTML文件/059
4.2.2 发布到AxShare/059
4.3 查看原型/060
4.3.1 安装chrome插件/060
4.3.2 从home.html开始/061
4.4 综合实例:Hello Axure!/061
4.5 小结/066
05 变量与函数的设置 067
5.1 概述/068
5.2 变量和函数的常用类型/068
5.3 插入变量或函数/069
实例:转换输入内容为大写/069
5.4 全局变量的添加与使用/070
5.4.1 添加方法/070
5.4.2 如何使用/070
实例:通过变量给按钮标签赋值/072
5.5 局部变量的添加与使用/073
5.5.1 添加方法/073
5.5.2 如何使用/074
实例:给按钮设置标签/075
5.6 综合实例:手机拨号盘/076
5.7 小结/080
06 事件处理/081
6.1 概述/082
6.2 普通元件/082
实例:普通事件/083
6.3 动态面板/085
实例:动态面板事件/085
6.4 文本/088
实例:文本事件/088
6.5 页面/092
实例:页面事件/092
6.6 事件分支/097
6.6.1 事件分支的产生/097
6.6.2 事件分支的命名/09 7
实例:事件分支与事件命名/098
6.7 事件动作介绍/100
6.7.1 链接动作/100
实例:不同的链接打开方式/101
6.7.2 元件动作/104
实例:显示/隐藏弹出窗口/104
实例:自动水平幻灯片/107
实例:文本设置/109
实例:设置图片按钮/111
实例:性别选择/114
实例:用户注册/116
实例:滑动验证码/117
实例:幸运大转盘/120
实例:动态进度条/122
实例:图片透明度调整/123
6.7.3 全局变量动作/125
实例:转换输入内容为大写/125
6.7.4 中继器动作/127
实例:dribbble网站的作品显示与过滤/130
6.7.5 其他动作/137
实例:设置等待时间/138
6.8 小结/140
07 动画效果的设置/141
7.1 动画效果的应用范围/142
7.2 显示/隐藏元件/142
实例:显示/隐藏按钮气泡提示信息/143
7.3 设置动态面板状态/145
实例:自动垂直幻灯片/145
7.4 移动元件/147
实例:显示/隐藏动态浮动气泡/147
7.5 旋转元件/148
实例:制作旋转的风车/149
7.6 设置尺寸/152
实例:设置图片缩放效果/152
7.7 小结/154
08 动态面板的设置/155
8.1 概述/156
8.2 动态面板的属性/156
实例:自动调整为内容尺寸/156
实例:固定到浏览器/158
8.3 动态面板事件/160
8.3.1 载入事件/160
8.3.2 拖动开始时/160
8.3.3 拖动进行时/161
8.3.4 拖动结束时/161
实例:移动滑块,实时显示当前滑块位置/161
8.4 综合实例:“人人都是产品经理”之
8.5 小结/172
09 中继器的操作/173
9.1 概述/174
9.2 中继器的基本操作方法/174
9.2.1 添加排序/174
9.2.2 移除排序/175
9.2.3 添加筛选/175
9.2.4 移除筛选/175
9.2.5 设置当前显示页面/176
9.2.6 设置每页显示数量/176
9.2.7 添加行/176
9.2.8 标记行、取消标记/176
9.2.9 更新行/177
9.2.10 删除行/177
实例:中继器样式设置/177
9.3 综合实例:用户列表的数据操作 /179
9.4 小结/188
10 元件库的设计与应用/189
10.1 概述/190
10.2 元件库设计的作用和意义/191
10.2.1 提高原型设计效率/191
10.2.2 保持原型设计的一致性/191
10.3 综合实例:Android元件库的设计/192
10.4 小结/196
11 综合实例的操作与应用/197
11. 1 综合实例:“淘宝网”首页自动幻灯片/198
11.2 综合实例:“网易云音乐”分享弹出
11. 3 综合实例:“美团网”导航菜单的制作/205
11.4 综合实例:“人人都是产品经理”网站
11.5 综合实例:“新浪微博”下拉刷新/216
11.6 综合实例:“雷锋网”浮动菜单栏/223
11.7 综合实例:“京东网”手机品牌的选择/228
11.8 综合实例:“UC浏览器”文件下载
11.9 综合实例:“淘宝网”商品搜索结果/241
11.10 综合实例:“创业邦”登录和注册
11.11 小结/258
12 微信Android客户端原型设计/259
12.1 概述/260
12.2 准备工作/261
12.2.1 截图功能的应用/261
12.2.2 吸管工具的应用/262
12.2.3 客户端截图准备/262
12.3 设计公共元件库 /263
12.3.1 新建元件库/263
12.3.2 设计元件库内容/264
实例:制作绿色按钮/264
实例:制作浅灰色按钮/265
实例:制作返回箭头图标/266
实例:制作输入框/267
实例:制作标题栏/270
实例:制作白色/绿色文字气泡背景/271
实例:制作提示信息弹出框/273
实例:制作输入法键盘/274
实例:制作照片选择列表/278
实例:设置“开关”选项/281
实例:设置“扫一扫”功能/283
12.3.3 加载元件库/287
12.4 综合实例:微信登录和首页设计/288
12.4.1 设置启动界面/288
12.4.2 设置登录界面/289
12.4.3 首页布局/292
12.4.4 制作主导航/293
12.4.5 设置“搜索”功能/295
12.4.6 设置微信菜单/296
12.4.7 设置“添加朋友”功能/298
12.4.8 “扫一扫”功能的应用/299
12.4.9 设置消息列表/301
1 2 .4.10 设置“好友聊天”功能/305
12.4.11 预览/310
12.5 小结/312
附录:函数与属性/313
元件属性/313
窗口属性/313
光标属性/314
数字函数/314
数学函数/314
字符串函数和属性/314
日期函数/315
《Axure RP8网站与App原型设计经典实例教程》图书简介 在当今快节奏的数字化浪潮中,高效、精准的原型设计已成为产品从概念走向落地的关键环节。它不仅是设计师与客户、开发者之间沟通的桥梁,更是验证产品设想、优化用户体验、降低开发风险的利器。而Axure RP,作为业界公认的强大原型设计工具,以其深度与广度,赢得了无数专业人士的青睐。 本书——《Axure RP8网站与App原型设计经典实例教程》,正是为了帮助广大设计师、产品经理、项目开发者以及任何对交互原型设计感兴趣的读者,系统掌握Axure RP8的强大功能,并将其应用于实际项目,从而创作出令人眼前一亮的、高保真、可交互的原型。我们深知,理论的学习固然重要,但只有通过大量、贴合实际的项目演练,才能真正将知识内化,转化为解决问题的能力。因此,本书将重心放在了“经典实例”的剖析与实践上,力求让每一位读者都能在跟随教程的过程中,如同亲手打造项目一般,深入理解Axure RP8的每一个核心功能及其在真实场景下的应用。 本书的独特价值与核心亮点: 案例为王,实战导向: 本书并非堆砌零散的知识点,而是精选了一系列来自真实项目、具有代表性的网站与App原型设计案例。从简单的注册登录页面,到复杂的电商产品详情页、社交媒体动态流,再到功能丰富的后台管理系统,本书涵盖了多种常见且重要的产品交互场景。每一个案例都经过精心设计,既有普遍性,又不失独特性,能够帮助读者触类旁通。 Axure RP8核心功能深度解析: 我们将Axure RP8的关键功能,如母版、动态面板、中继器、变量、条件、函数、事件(如单击、鼠标悬停、键盘输入等)、页面跳转、部件交互、变量控制、条件显示与隐藏、动画效果等,巧妙地融入到每一个案例的讲解中。读者在完成案例的同时,自然而然地掌握了这些核心工具的使用技巧,并理解其背后的逻辑。 由浅入深,循序渐进: 本书的章节安排遵循由易到难、由简到繁的原则。从最基础的页面构建、元件添加,到复杂的交互逻辑设计,再到高级的元件库管理、团队协作,每一个步骤都力求清晰明了。即使是初次接触Axure RP8的读者,也能通过本书快速入门,并逐步进阶。 “为什么”与“怎么做”并重: 在讲解“如何操作”的同时,本书更加注重“为什么这样做”。对于每一个交互设计决策,我们都会进行分析,解释其背后的设计理念,以及这样做能够达到的效果。这有助于读者建立起独立思考和解决问题的能力,而不仅仅是机械地模仿。 细节决定成败: 在原型设计中,细节是提升真实感和用户体验的关键。本书将不遗余力地展示如何通过精细的元件对齐、尺寸调整、颜色运用、字体设置,以及巧妙的交互动画,来打造一个高度仿真的原型。例如,如何实现下拉菜单的平滑展开、轮播图的自动切换、表单输入的实时校验反馈等,都将得到详细的演示。 拥抱Axure RP8的最新特性: 本书基于Axure RP8版本进行编写,确保讲解的内容都是最新、最实用的。对于8.0版本中新增或优化的功能,我们将进行重点介绍和演示,帮助读者充分利用新版本带来的便利。 不仅仅是“设计”,更是“思考”: 原型设计不仅仅是绘制界面,更是对用户需求、产品逻辑、交互流程的深刻理解与表达。本书将引导读者在设计过程中,不断思考“用户为什么会这么做?”、“这样做是否最方便?”、“如何让用户更直观地理解?”等问题,从而提升整体的产品设计能力。 为复杂项目打下坚实基础: 通过本书的学习,读者将能够独立完成各种复杂的产品原型设计。无论是需要大量数据展示和动态更新的中继器应用,还是涉及多层级逻辑和条件判断的复杂流程,亦或是需要高度自定义的交互效果,本书都将提供相应的解决方案和实践指导。 掌握“一次性”的投入,带来“持续性”的收益: 学习Axure RP8是一项具有长远价值的投资。掌握了其强大的原型设计能力,意味着在未来的产品开发过程中,能够更有效地沟通、更快速地验证、更精准地实现,从而极大地提高工作效率,缩短产品上线周期,降低开发成本。 本书的结构与内容概览(部分): 全书将围绕网站与App两大类原型设计展开,采用“理论讲解 + 案例实操”的模式,逐步深入。 第一部分:Axure RP8基础与核心概念 Axure RP8界面概览与常用工具介绍 页面与页面属性的设置 常用元件库的使用与定制 母版(Master)的应用:实现页面元素的统一管理与复用 动态面板(Dynamic Panel):构建页面状态切换与复杂交互的基础 部件交互(Widget Interactions):定义元件的响应事件与动作 第二部分:网站原型设计实战 实例一:响应式网站导航栏设计。 学习如何利用动态面板和条件,实现不同设备尺寸下的导航栏自适应。 实例二:电商网站商品列表与详情页。 重点掌握商品筛选、排序、加入购物车、查看详情等核心交互流程,以及商品图片的轮播、放大镜效果。 实例三:信息展示类网站的内容分页与搜索功能。 学习如何使用中继器(Repeater)加载和展示大量数据,并实现搜索过滤功能。 实例四:用户登录与注册表单原型。 演示如何实现表单的校验、密码显示/隐藏、验证码交互等。 实例五:简单的后台管理系统仪表盘。 学习如何布局复杂的数据图表、表格,并实现部分交互联动。 第三部分:App原型设计实战 实例六:移动App登录注册流程。 专注于移动端的交互习惯,如滑动解锁、人脸识别模拟、手机号验证等。 实例七:社交App动态列表与发布功能。 演示如何使用中继器实现无限下拉加载、点赞、评论交互,以及内容发布时的图片上传、文本输入等。 实例八:电商App商品详情页与购物车。 强调移动端的触摸交互,如商品规格选择、数量增减、滑动查看图片、添加到购物车动画等。 实例九:地图App的地点搜索与导航。 学习如何模拟地图的缩放、拖拽,以及搜索结果的展示和路线规划的简单模拟。 实例十:音乐App的播放器界面与列表。 演示如何实现音乐播放、暂停、进度条拖拽、歌词滚动、列表切换等。 第四部分:Axure RP8高级技巧与团队协作 变量(Variables)与函数(Functions):实现更智能、动态的原型 条件(Conditions)与逻辑(Logic):构建复杂交互分支 Axure RP8的条件逻辑语句详解 部件库(Widget Library)的创建与管理 使用Axure RP8进行团队协作与版本控制 导出与分享原型:生成可交互原型链接、生成报告 提升原型可读性与维护性的设计原则 本书并非一本枯燥的技术手册,而是一本陪伴您从新手成长为Axure RP8高手的实用指南。我们相信,通过深入学习本书的每一个章节,细致研读每一个案例,动手完成每一个练习,您将不仅能够熟练运用Axure RP8,更能深刻理解交互设计的本质,从而在产品设计的道路上,迈出坚实而自信的步伐。 拿起《Axure RP8网站与App原型设计经典实例教程》,开启您的原型设计之旅,让您的创意在指尖化为触手可及的现实!