1. 什么是网站/应用程序原型 (HTML Prototype)?
2. 输出网站原型/格式设定
3. 展示与操作网站原型
4. 分享原型档案给其它人
5. 秘技(Quick Tips)
1. 什么是网站/应用程序原型 (HTML Prototype)?
在Axure中完成有批注的Wireframe和Interaction之后,您可以产生可交互且支持多种浏览器的Web/AP原型(HTML Prototype)。(注: AP是Application的缩写,通常指的是应用程序)
Axure RP网站原型是由HTML和Javascript组成,可以在IE 6(或以上的版本)、Mozilla或Firefox中浏览。换句话说,观看网站原型的人仅需要一般浏览器,不需要安装Axure RP。如下图范例所示。

解除IE中的Active X 警告讯息:使用IE开启在自己计算机里头的HTML Prototype档案时,浏览器中可能会出现Active X 警告讯息,想要暂时解除IE中的警告讯息,请点选IE浏览器出现的Active X警示讯息,接着选择"允许被封锁的内容",这样子就可以在IE浏览器上看到自己计算机里头的HTML Prototype了。
想要永久解除Active X警告讯息,请参考秘技一。
2. 输出网站原型/格式设定
想要输出原型或设定(Configure HMTL Prototype)输出格式的话,请按下Axure RP软件上方主功能选单「Generate」菜单,选择「Prototype(F5)」。
或是按下工具列中的「Prototype」钮,系统会开启「Configure HTML Prototype」对话框,并显示预设的原型输出格式设定,您可透过这个对话框来设定输出原型的格式。

格式设定中的选项可分成下面几区:
General:在「Destination Folder」处输入网站原型的HTML档案的存放位置,因为Axure RP的网站原型包含许多档案,最好指定一个windows档案系统内的档案夹来存放。
Notes(网页说明):选择和排序想要显示在网站原型中的网页层级说明。
Annotations(物件批注):选择和排序想要显示在网站原型中的批注字段。
Interactions (交互):指定交互的行为,例如:指定是否需要预设显示条件描述(case),或是只在多个条件存在的情形才显示。
Distribution:选择是否产生CHM 檔。
Advanced:选择是否将Text Panel转成影像,这是一个旧版本的功能,现在很少有需要这样处理。

初次输出原型,您可以直接使用预设的设定值,除了指定输出的档案夹之外,不用费心去调整。或者当您完成网站原型输出格式的设定,只要按一下【Generate】钮就可将这个Prototype输出了。
如果您越来越熟练,您可以两个动作就完成网站原型的输出了,第一个动作是按下【F5】,接着再按下【Generate】。
3.展示与操作网站原型
Axure RP输出的网站原型(HTML Prototype) 总共可区分成三个框架。
左侧: Sitemap 框架
您可以按Sitemap中的网页列表,循序展示网站原型中的任何一个网页。如果您不需要显示左侧的Sitemap,那么就应该
底部: 网页说明(Page Notes)框架
这个框架显示该网页的文字说明,这些文字说明来自于您写在网页批注(Page Notes)的文字。
中间: 主框架
主框架包含了Wireframe和流程图,Wireframe是可以交互的,举例来说,按一下设定有网页连结的按钮,那么就会连结到所设定的网页。
您也可以按一下加有附注的Widget旁边的黄色便利贴小Icon图示来检视批注。
4. 分享原型档案给其它人
因为Axure RP的Prototype是标准的HTML、Javascript和影像文件,所以您的同事和客户不需要安装Axure RP或任何播放器就可以直接检视Prototype。
发布Prototype的方式有很多种,以下是三种不同的分享方式的介绍。
a. 放到网站服务器
第一种方式是发布网站原型的HTML Prototype到Web Server上,您只要将网址给客户或工作伙伴其它人,他们在他们的浏览器上浏览Prototype。
b. 压缩成Zip檔
第二种方式是将包含Prototype档案的档案夹压缩成Zip档,然后将Zip档寄给相关的人。收到档案的人,将Zip档解压缩后,便可以直接在自己的计算机浏览HTML Prototype,通常是开启 index.html或从 XXX_Start.html档开始浏览 (XXX指的是该RP Project的名称)。
c. CHM 檔
第三种方式是产生包含Prototype的CHM档,就像zip档一样,这种方式让您可以档案的方式发布Prototype,而且不需要安装任何软件来检视。CHM是Microsoft HTML Help档的格式,所以大多数的Windows计算机已经安装了浏览器,使用者只要在档案上连续按两下鼠标左键就可以检视它。
想要将Prototype输出成CHM档的话,请在「Configure HTML Prototype」对话框中,进入「Distribute」区,勾选「Create HTML Help File(.chm)」选项。
如果您目前已经安装的Microsoft系统中没有HTML Help Workshop的话,就必须安装它才能产生CHM档,您可从这里免费下载,一旦完成安装以后,所安装的数据夹中将会出现一个hhc.exe的档案,按一下「Locate hhc.exe」来告诉Axure RP这个程序在计算机中的位置。
一旦Prototype和.chm档产生之后,您将会在存放Prototype的数据夹中找到一个 .chm档,您现在就可以将 .chm档发布出去,让接收者在HTML Help检视器中检视。
秘技(Quick Tips)
秘技一. 只更新现在开启的页面到网站原型:
当您设计网站原型的技巧越纯熟,网站项目会越来越大,导致输出网站原型的时间会随着项目而变大。万一您只是调整其中的某一页,却得等待整个网站重新全部输出,那就太浪费时间了。
想要重新产生某一页网页,只要在Axure RP打开该页Wireframe,接着按下Axure RP主功能选单「Generate」菜单,选择「Regenerate Current Page to Prototype(CTRL+F5)」(如下图)。
当您选择这个动作,或者直接按下热键CTRL+F5,Axure RP不会产生任何对话窗口,您只会感觉到鼠标指针闪了一下,此时,再回到网站原型(HTML Prototype)上去reload这一页,或click这一页网页名称,就会看到已经更新的页面了。

秘技二. 关闭IE中的Active X 警告讯息:
使用IE浏览器在自己的计算机上开启存放于档案夹中的HTML Prototype时,浏览器中可能会出现Active X 警告讯息,想要永久解除IE中的警告讯息,请点选「工具」菜单中的「Internet选项」,切换到「高级」标签页中,找到「安全」的设定中,勾选「允许活动内容在我的计算机上的文件中运行*」选项即可 (如上图)。
秘技三. 嵌入外部Flash档案Inline Frame
Inline Frame Widget可用来加入Axure RP 目前不支持的内容,例如:Flash物件;只要在Inline Frame Widget上连续鼠标左键两下就可以让您指定想要加载到框架的网页,如果您要建立一个包含Flash对象的HTML 文件,您可以将档案嵌入到Inline Frame中,这样他就可以在Prototype中呈现了。
秘技四. 快速绘制网站架构图:
以"Generate Flow Diagram"的功能,请看快速绘制网站架构图 (Sitemap)教学影片。
(版权声明:欢迎引用及复制Axure RP 中文教学内容,必须注明出处为悠识数位顾问有限公司及原始文章网址 UserXper.com)


学习了
chm 输出时候,菜单是乱码???怎么解决?
dd,
输出chm左侧的page list会出现乱码,这个问题可以解决。相关说明跟方法在此:
http://cn.userxper.com/blog/archives/355
我没有英文基础,庆幸有了个汉化,只是有些要与原版本对应起来挺困难,这个软件以后会成为主导。坚持学习中。。。XD
学习了,谢谢你们啊!
非常感谢你,之前对该软件一直都很感兴趣,但苦于没有一个好的教程。在你的教程知道下,我慢慢已经入门,越来越感兴趣,加油!
http://cn.userxper.com/blog/archives/355
我提的问题几天了,都没有人解答过。。。
看到这里了,写的非常棒
呵呵,有个小小建议
就是是否能够使用一个案例来帮我们进行一些练习。
实践出真知嘛,非常感谢编辑同志们写的东西。
为什么我的文件是RP格式的?而输出HTML的时候有这个框框?HTML complier could not be found……的提示呢?
hi Mable,
您遇到的情况很特殊,请把rp文档寄给我们 (service@userxper.com) 检查,以利于判断问题。或者把信息画面寄给我们。
相同的rp文档,在其他人的电脑上也会出现同样的信息吗?