原型之美@产品

Axure 8的注释功能还是弱,这款Axure插件强大很多

2016-06-12  本文已影响8618人  有刀8

很多时候,一个看似简单的页面需要更多的版面来标注其中各项的规则,而且还不是单单文字就能说明清楚,配上流程图都是可能的;注释多了,版面就容易混乱,即使逐一排列,也会让页面变得很长,需要来回查看,极不方便;除了程序猿割割,原型还会演示给客户、BOSS查看,一堆注释挂在边上,实在不够简洁。

为此,笔者制作了“AxurePlus Notes”插件,一并解决了以上问题。该插件有以下功能:

· 独立注释区,使用动态面板(Dynamic Panel),支持各种Axure组件用来注释;

· 在生成的HTML文件中,点击标注图标,在注释区中自动显示对应的注释;

· 默认隐藏注释区,点击标注图标才会显示。 

· 额外支持JavaScript/JQuery(如非特殊需要,不建议使用)

下载Demo及AxurePlus Notes:

https://pan.baidu.com/s/1mitxW4S

使用方法:

导入“AxurePlus.rplib”,拖动“Notes”组件到页面中任意位置,打开该组件的第一个Panel State(名称为“Notes HERE”),在该Panel State中使用“Circle Marker”组件,并打上数字,该数字与原型中的“Drop Marker”组件上的数字一致,如:

标注序号一致

在生成的HTML文件中点击"Drop Marker"即会自动显示对应的“Circle Marker”,也即显示对应的注释内容:

注释区显示对应说明

JavaScript/JQuery的使用说明:

使用“Text Area”组件来编写JavaScript/JQuery,并将该组件名称设置为“AxurePlus-Scripts”即可生效,例如:

AxurePlus-Script

安装方法:

>>>>>该插件需修改Axure 8的内部文件才能生效:

· MAC系统:

在Finder中打开应用程序,选择“Axure RP 8”右击选择“显示包内容”,进入“Contents/Resources/DefaultSettings/Prototype_Files/resources/scripts/axure”,编辑“utils.temp.js”文件,在最下方插入内容:

$(function(){

eval($.trim($('[data-label=AxurePlus-Scripts]').text()));

});

· Windows系统:

找到Axure RP 8的安装位置(默认为“C:\Program Files\Axure\Axure RP 8”),进入“\DefaultSettings\Prototype_Files\resources\scripts\axure”,同MAC系统下一样编辑“utils.temp.js”文件。

注意:Axure 8.1版本需在“(Contents/Resources/) DefaultSettings/Prototype_Files/resources/scripts”下编辑“jquery-1.7.1.min.js”文件

上一篇 下一篇

猜你喜欢

热点阅读