写在前面:在哔哩哔哩上面找到的Axure自学教程0基础入门课程,播放量最高,5个多小时。课程主要分为4个部分,快速入门、动态面板、常用动效、项目设计。UP主账号【Song老师产品经理课堂】。做个有素质的白嫖er,一键三连必须的~
课前提示:
教程使用Axure9汉化版,与10有区别的地方会单独提示。
00Axure9汉化版下载、安装、汉化、注册
1.下载
-
Axure RP 9.0: 百度网盘 请输入提取码 提取码: vgqy
-
Axure8.0: 百度网盘 请输入提取码 提取码: uvjk
-
Axure7.0: 百度网盘 请输入提取码 提取码: 3bqj
-
来源:哔哩哔哩UP主账号【 修行者1314520】
2.安装
-
详细安装教程参考 Axure RP 9.0安装教程
-
注意事项: 以管理员身份运行【 AxureRP-安装程序.exe 】
3.汉化
-
安装完成后关闭所有界面,打开【汉化文件-软件装好先不要启动】文件夹中,复制【lang】文件夹至Axure所在的安装文件夹。
4.注册
-
在Licensee下方的框中随意输入,然后点击【Generate】, 将注册机上的【 Licensee 】和【Key】分别复制到管理授权界面上的【被授权人】和【授权密钥】。
5.基础设置
-
自定义工具栏:工具栏右键单击-自定义工具栏
![](https://img-blog.csdnimg.cn/direct/30d8576f304b48869fae7ee26245a31b.png)
![](https://img-blog.csdnimg.cn/direct/e40d0fb93dba47308bb4ee4cd468bb74.png)
-
快捷键:ctrl+鼠标滚轮,快速放大缩小
-
小技巧:编辑时填充颜色为灰色,便于识别边框
![](https://img-blog.csdnimg.cn/direct/b0f78c153ce74e7e998a165a725c832c.png)
01制作线框图
1.什么是产品原型图
(1)产品原型图(prototype)的作用
-
产品研发前,用于描述产品设计的文档(UI样式、交互动作)
-
沟通需求的工具(客户、领导、研发团队)
(2)种类
-
线框图
-
通过【线段+色块+文字】描述产品页面。
-
优点:制作快速。缺点:传递信息容易遗漏。
-
应用:早期方案讨论,需要快速输出的场景,团队配合度高。
![](https://img-blog.csdnimg.cn/direct/63ea86f29e0645a59f3afcdf555d9ee4.png)
-
高保真图
-
高度还原产品运行效果,包括【设计+交互】的保真度。
-
优点:还原度高。缺点:制作耗时长。
-
应用:客户/大领导沟通,产品设计思路的完整展示,求职能力体现。
![](https://img-blog.csdnimg.cn/direct/1652a311e35b4854b4f85a421f3828a7.png)
-
简易需求文档(PRD)
-
除了页面外,描述更多业务逻辑与辅助说明,指导产品研发。
![](https://img-blog.csdnimg.cn/direct/eeed9be174dc41d096c7ec707e66c0d4.png)
2.演示:制作线框图(朋友圈)
-
拖动原件
-
通过样式改变尺寸(可以锁定宽高比例或者按shift再拖动均可实现等比例改变尺寸)
-
通过填充改变颜色(点击吸管图标吸取颜色)
-
选中元件进行对齐
-
运用标尺进行定位
-
修改标题文字格式
![](https://img-blog.csdnimg.cn/direct/eb79b22299e647d092f481217f14010f.png)
-
更多形状:拖动元件-右键单击元件-选择形状
-
旋转元件:Ctrl+拖动元件边框
![](https://img-blog.csdnimg.cn/direct/88d73ee5a056477faced6764951f9a3f.png)
![](https://img-blog.csdnimg.cn/direct/2e07006e89c14038b2000f1473602e5b.png)
-
设置圆角
![](https://img-blog.csdnimg.cn/direct/b1b4b1a2ab2a49f0a13c7d57eb8f51ea.png)
![](https://img-blog.csdnimg.cn/direct/4431186b03ef462da5a8c53a0b7d1f16.png)
3.小作业
-
用Axure绘制线框图
![](https://img-blog.csdnimg.cn/direct/d61ae161c04b4985a7d3388c1e21efee.png)
![](https://img-blog.csdnimg.cn/direct/813b7a09f0184317bea4fddb1d6b340f.png)
PS:科技公司最大的成本并不是人力,而是研发了一堆无用的“伪需求”。 制作高质量的产品原型图,可以尽早的识别"伪需求",从而降低成本。