绝!50个Axure画原型技巧,产品经理速学速用

王大鹿
7 评论 15354 浏览 197 收藏 29 分钟
大厂导师团亲自授课,超过200小时的精品课程,从0到1为你构建“产品+业务”的复合型知识体系,让你在职场竞争中脱颖而出。

为什么别人的原型画起来又快又高级,效率极高;而我们画起原型来,又慢又比较简单,效率极差,问题的根源在哪?这篇文章,作者总结了Axure的50个小技巧,相信你看完学习上,你也能画得又快又好。

一、偏好配置,把能配置的都配置上

Mac 使用快捷键 「Cmd + ,」,Win 使用「F9」,调出「偏好配置」弹窗。

1、启用自动备份

可以在调出的「偏好配置」弹窗中选择「备份」;

也可以点击「文件 」,选择「自动备份设置」。

勾选启用备份,备份间隔 5 分钟。

如果系统崩溃后,再次进入时,系统一般会提示恢复最近备份的文件。

也可以通过「文件→从“备份中恢复”」找回最新的版本。

2、画布配置

把「单快捷键、画布负空间」都勾上,如果喜欢暗黑风格,也可以选择「黑暗模式」。

3、网格配置

把「网格对齐」勾上,间距设置成 10 即可。

元件将会按照网格进行吸附,可以快速对齐。

如果想在「画布」中展示出网格,可以使用快捷键「Ctrl+’」

或者在画布的空白区域,鼠标右键,勾上「显示网格」,将会把网格显示出来。

不过展示出网格并不好看,可以不展示网格,只要能自动网格对齐就行了。

4、辅助线配置

使用辅助线快速对齐,将「辅助线对齐」勾上。

在画布空白区域「鼠标右键」,设置标尺。

然后把「显示标尺」「显示全局辅助线」、「显示页面辅助线」都勾上,就可以从画布左边、上边,拖出辅助线,帮助我们快速对齐。

5、元件对齐配置

把「元件对齐」「边缘对齐」勾上,垂直和水平设置成 10 即可。

这样在拖拽元件时将会展示出对齐辅助线与元件之间的间距数字,帮助元件快速对齐。

按住 Alt 键(Wins)/Option 键(Mac),鼠标放在元件上可展示出元件之间的距离。

二、复制粘贴很厉害

使用 Ctrl+C、Ctrl+V,快速复制内容。

6、复制粘贴图片

可以将图片直接复制粘贴进 Axure;Axure 中的组件可以选中后,可以复制粘贴成图片到微信去发送。

7、复制粘贴样式

选择元件后,Ctrl+C,然后选中要粘贴样式的元件。

快捷键 Alt+Ctrl+V(Mac 则是 Option +Cmd+V),即可复制样式。

也可以通过「右键—粘贴选项—粘贴样式」。

8、复制粘贴表格

在 Excel 中写的内容 Ctrl+ C 后,进入到 Axure 中,「鼠标右键 – 粘贴选项 — 粘贴为表格」,即可按照表格进行粘贴。

当我们在画后台表格页面时,想快速填充内容时,可以采用这种方式。

Axure 表格不支持合并单元格。

9、快速复制元件

除了 Ctrl+C、Ctrl+V 复制粘贴元件

还可以选中元件后,按住 Ctrl + 鼠标拖动(Mac 按住 Option 拖拽),即可拖出一个相同的组件。

还有「Ctrl+D」,直接复制出来。

10、快速复制页面

在 Axure 的页面里,选择要复制的页面后,可以使用 Ctrl+C、Ctrl+V 复制粘贴出页面。

也直接「Ctrl + D」,即可快速复制出相同的页面。

如果想复制整个文件夹下的全部页面,选中文件夹后,「鼠标右键-重复-分支」,可复制出文件夹下的全部页面。

11、复制粘贴交互事件

选中交互事件后,Ctrl+C、Ctrl+V,即可实现复制。

三、快捷键 ——提效利器

12、单快捷键

单快捷键是Axure 9 的特色,在「偏好配置 – 画布」里,勾上「启用单快捷键」,即可实现单快捷键的使用。

常用的有:

  • 按一下「O」, 快速画圆形。
  • 按一下「T 」,快速拉出文本。
  • 按一下「L」, 快速拉出线段。
  • 按下「O」后,直接使用鼠标左键,即可拖出圆形;在按一下「O」,即可取消;
  • 对于「T」「L」都是一样的操作。
  • 按一下「E」,快速画连接线,元件中将会出现连接点,可以直接用鼠标画连接线,再按下「E」,即可取消。
  • 按一下「>」 ,可快速预览原型。

13、必会的快捷键

Axure 中的快捷键和其他工具,如 word、PPT 等,都有很多通用的,像 Ctrl+C、Ctrl+V、Ctrl+X 等等。

而且快捷键很多,我们不需要记住那么多,因为一些快捷键还不如用鼠标点击的快。

以下是以下常用的,能提高效率的快捷键:

  • Ctrl+S ,保存
  • Ctrl+A,全选
  • Ctrl+Z,撤销
  • Ctrl+Y,重做(比如撤销多了,在使用 Ctrl+Y 恢复过来)
  • Ctrl + G,合并成组,选中多个元件后,可以合并成组
  • Shift + Ctrl + G,取消成组
  • 按空格键,鼠标左键拖动画布
  • Ctrl + -,缩小画布
  • Ctrl + +,放大画布
  • 按住 Ctrl,移动方向键,可以一次移动 10px;如果开启网格对齐,则会先对齐最近的网格,然后才开始 10px 移动。
  • Ctrl + B,加粗字体,但并不支持全部字体。
  • Ctrl + T,修改字体
  • Ctrl + Alt + -,缩小字号,MAC 对应 Cmd + option + –
  • Ctrl + Alt + +,放大字号,MAC 对应 Cmd + option + +
  • Ctrl + Shift + X,添加交互
  • 快速新建页面文件夹与页面:
  • 除了点击右上方的新建页面、新建文件夹,还有对应的快捷键:
  • Shift + Ctrl+Enter 可以快速新建文件夹
  • Ctrl + Enter 可以快速新建页面
  • 快速移动层级关系:只要按一下「Tab」键,将会自动移入文件夹层级下,相当方便。
  • 按「Shift + Enter」则可以移出层级。

以上 Ctrl 对应 Mac 的 Command 键。

三、能提效的功能

14、自适应文本大小

在使用文字时,可能会出现元件尺寸大。

想按照文字进行调整的情况,选中元件,在「样式」里,有 2 个小按钮,点击即可自适应文本高度、宽度。

15、同比例放大/缩小尺寸

有 2 种方式:

第1种:鼠标放在元件边缘的编辑点上,按住 Shift+鼠标左键拖,可以锁定长宽比来放大缩小元件。

都2种:手动调节尺寸,将锁勾上,即可锁定长宽比。

16、多种类型的文本框

拖拽「文本框」元件后,在「交互」面板里可选择 11 种文本框类型,不同的类型可以达到不同的效果。

如:

  • 密码格式:输入的内容会被隐藏
  • 数字格式:只能输入数字
  • 文件格式:可以选择文件
  • 日期格式:可以直接选择日期
  • ……

样式将会使用浏览器的对应样式。

17、文本框里的预置文字

在表单填写时,经常会在输入框中填写提示内容。

Axure 的文本框可以直接在右侧“提示文字”框输入文字,预置文字将会显示出来,在输入内容时将会隐藏。

(可以在「隐藏提示」中设置是输入内容就隐藏,还是有了光标就隐藏)。

同时可以填写文本框内可以输入的最大长度。

18、替换、查找文字

Axure 也支持替换、查找文字,直接「 Ctrl+F」,输入文字进行查找;

当元件内容过多时,可使用「查找」,快速定位到具体元件。

替换的操作和其他工具一样,MAC 快捷键是「 Cmd+R」,Windows 是「Ctrl+H」,直接替换即可。

19、不常移动的元件进行锁定

锁定不常移动的元件,比如背景页。锁定的元件位置会固定住,这样就可以避免选中后误移。

可以使用「Ctrl+K」快捷键进行锁定,「Shift+Ctrl+K 」解除锁定。

20、裁剪/切割图片

画原型时有时候会使用到截图,需要对截图进行处理。可以选中图片后,对图片进行裁剪、切割。

通过「右键-裁剪/切割图片」;

也可以通过单快捷键「S」:快速分割,「C」:快速裁剪。

21、旋转元件

按住 Ctrl,将鼠标放在元件的边缘,鼠标变成旋转样式,即可旋转。

也可以在「样式」中调整旋转角度。

22、引用页面

引用页面,元件引用页面后元件文案将会线上成页面的名称,点击元件可快速跳转到引用的页面。

这个在画原型时的具体应用场景我没有找到。

23、拖动页面名称

鼠标选择页面名称,直接拖入画布里,会出现页面名称的按钮框。

可以用来做流程图,点击页面名称框,会直接跳转到对应页面。

24、页面快照

拖动页面快照到画布里,双击弹出要引用页面选择框,选择引用的页面后,会出现页面预览。

点击可进入对应页面,可用于页面概览图制作。

25、导出原型为图片

除了能通过复制粘贴的方式复制图片,也可以直接将整个页面导出成图片,「点击文件 – 导出为图片」,即可导出 PNG 格式的图片。

26、页面布局可以调整

在Axure中的每个模块都是可以通过拖拽进行调整的,你可以自定义你习惯的布局。

可以通过「视图 – 重置视图」,恢复成默认布局。

27、自定义工具栏

在「视图 – 工具栏」中,你可以设置工具栏的功能内容。

按照你使用的习惯来,把经常用的都放出来。

28、碍眼的遮罩颜色

在 Axure 中当转换成母版、动态面板时,都会有一层颜色遮罩,在预览原型时不会展示出来颜色,但是在画原型时会有。

如果你觉得遮罩干扰你画原型,可以通过「视图 – 遮罩-勾选/取消勾选对应内容」,在画原型则不会再有遮罩颜色。

取消遮罩后,效果如下(隐藏的遮罩还是保留,不然找不到了)。

29、不同的连接线

在使用连接线时,Axure 中有 4 种连接线样式可以使用,选中连接线后,在「样式」面板里,可以选择直线、折线等样式。

30、快速调整表格行高行宽

当使用表格元件时,选中需要修改的表格,然后直接修改宽度与高度,即可批量修改选中表格的尺寸。

如果想修改个别表格,按照 Ctrl 键,再选中即可。接着修改宽度与高度,就可直接修改选中表格的尺寸。

31、画泳道图

Axure 中自带了流程图元件,但是没有提供泳道图的样式。

可以使用「表格」元件,调整一下表格数量、尺寸即可。

32、快速重命名多个页面

当需要对多个页面重命名时,比如批量对页面名称添加编号。

可以先选中一个页面重命名,然后在重命名状态下,使用「键盘上下键」,进到下个页面时还是重命名状态,就可以直接重命名了。

33、合并多个 Axure 文件

当需要将多个 Axure 文件合并到一个文件中时,点击「文件→从 RP 文件导入→选择文件→导入」。

选择文件后,选择需要导入的页面与内容,按照页面操作一直进行即可。

34、重复的元件可以转化成母版

对于多个重复的元件,每次修改一个地方,其它也挨个修改,很麻烦,这个时候我们可以使用「母版」。

选中元件后,「右键 – 选择转换成母版」,转换成母版后,修改母版内容,则整个 Axure 中使用到母版的都会一起调整。

双击母版元件,就会进入到母版编辑窗口,修改后的元件会同步到所有母版元件。

使用到母版元件时,直接在母版区拖进画布使用。

使用母版元件时,元件里所有的样式和交互都是一样的。

可以「点击鼠标右键——脱离母版」,然后对这个元件单独操作。

35、母版可以调整赋值

对于母版中放在不同页面里,可以需要单独调整某些字段;

比如我们把「左侧导航+顶部菜单+面包屑 」整体转成母版,需要修改页面的面包屑。

我们可以选中母版,在「样式」,找到「重写」,选取对应的字段填写新的文字即可修改。

36、元件过多时选中的方法

1)多个元件重叠时,想选中下层元件,选中上层元件,然后等 1 秒左右,在点击一次,就会选中下一层元件

2)在概要中通过搜索找到,元件过多的时候可以通过搜索,这是命名的重要性就出现了。

3) 使用「查找」功能:Ctrl+F,通过搜索元件里的文字来找。

四、一些动态效果

37、鼠标悬浮显示提示内容

添加元件提示后,鼠标悬浮时将会展示出提示内容,可以用使用元件提示来达到鼠标悬浮显示全部内容的效果。

选中元件后,可以「右键-工具提示」填写内容。

也可以在「交互」面板里填写。

38、选项组命名——实现单选效果

将多个可选中的元件设置成相同的选项组后,每次只能选中一个元件,其它元件自动取消选中。

39、快速返回上一页

如果你在画原型时,涉及到页面间的跳转,想直接返回上一页。

进入「交互」面板,点击“打开链接”,选择下方的“返回上一页”就可以了。

40、滚动查看

将元件转换成动态面板,然后选中动态面板,「鼠标右键→滚动条→选择滚动方式」即可。

也可以在样式面板中,直接选中滚动方式即可。

41、位置固定到浏览器

比如:将弹窗在屏幕中间显示、导航固定在顶部。都可以通过固定到浏览器实现。

首先将固定的内容转换成动态面板,然后在「样式」中选择固定到浏览器,选择对应的位置即可。

42、使用动态面板达到合并成组的效果

在进行分组时,除了可以使用 Ctrl+G,也可以将元件转化成动态面板,同样可以达到合并成组的效果。43、实现灰底突出弹窗

有 2 种方式:

第1种:加个灰底样式元件,与弹窗一起显示。

多个元件会影响效率,不推荐。

第2种:使用「灯箱效果」,在设置显示时,更多选项选择「灯箱效果」。

背景色选择黑色,不透明度设置成 50%。

在设置显示时,推荐勾选“置于顶层”。

注:当使用灯箱效果时,点击灰底区域,弹窗将会自动消失。

44、实现非模态的效果

比如弹出气泡弹窗后,想实现点击弹窗外的区域关闭弹窗的效果。

可以使用「显示/隐藏」,选择「灯箱效果」,背景颜色选择透明。

45、显示时勾上置于顶层

在做显示/隐藏动效时,当需要显示时,可以将「置于顶层」勾上,这样可以避免要显示的内容被遮挡。

五、还能这样导出与查看原型

46、导出原型为 word

你可以试下「Ctrl+Shift+D」,或者是点击「发布-生成 word 说明书」。

将会把 Axure 原型导出为一个 word 文档,文档里包含内容,排版样式等内容都可以配置。

常规的包含原型图片、功能说明等内容。

原型图片会按照每个画布生成图片,功能说明则是在「说明」面板里填写的内容。

导出Word的主要的使用场景是在将需求描述写到「说明」里,然后直接生成 Word 格式的需求文档。47、快速导出 Excel

使用 「Ctrl+Shift+M」,或者是「发布 – 更多生成器和配置文件」,选择 CSV,点击生成

选择保存文件地址后,创建 CSV 报告,即可将页面和页面中的说明导出成 Excel。

这个导出 Excel,对于我来说最大的用处是导出页面名称,然后使用页面名称去划分功能点,最终用于研发评估功能的工时。

48、查看原型看带交互的元件

浏览器查看原型时,或者是别人看我们带有交互动效的原型时,可以告诉对方,勾上显示热点,让对方知道哪里可以触发动效。

49、查看原型时调整宽度

浏览器查看原型时,原型的宽度是默认的,如果你想看整个页面的原型,可选择不同的原型尺寸。

50、查看原型时快速切换页面

浏览器查看原型时,可以使用<,>这两个快捷键,在多个页面之间来回移动。

本文由人人都是产品经理作者【王大鹿】,微信公众号:【产品大鹿】,原创/授权 发布于人人都是产品经理,未经许可,禁止转载。

题图来自Unsplash,基于 CC0 协议。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 好用,对我新手友好,有些自己在手搓效果,省事了,不错

    来自河南 回复
  2. 总结的好好。好多细节之前都没注意到

    来自浙江 回复
  3. 更多产品落地干货,都在公众号:产品大鹿

    来自中国 回复
  4. 👍

    来自北京 回复
  5. 总结的很精细

    来自江苏 回复
  6. 17,文本框属性 我咋没找到。。。 Windows系统,Axure9

    来自北京 回复
    1. 只有输入框组件有这些属性

      来自山东 回复
专题
12437人已学习12篇文章
在商战中,运营设计是至关重要的一部分。本专题的文章分享了运营设计的那些思路和技巧。
专题
13194人已学习14篇文章
良好的交互规范可以很好的帮助企业、团队提高产出,保证用户体验。本专题的文章分享了交互规范指南。
专题
16473人已学习11篇文章
本专题分享了算法相关的知识,汇总了算法的基础知识和进阶知识。
专题
12653人已学习13篇文章
本专题的文章分享了产品升级迭代应该怎么做,以及其中遇到的问题和思考。
专题
13415人已学习12篇文章
本专题的文章分享了金融产品经理需要知道的金融基础知识和产品观。
专题
13079人已学习13篇文章
通过仪表盘,用户可以查看并分析产品的数据和图表,还可以通过控件来控制数据的显示、过滤等功能。本专题的文章分享了仪表盘设计指南。