axure查看html,2、移动端查看 —— Axure使用交互

写在开头：

相信许多产品新人在用Axure做完原型之后，都会遇到过这样一个问题：想在手机移动端做展示，但是却因为各种原因无法正常显示出来，本次教程就以 iphone 6 作为材料进行讲解(因为本人用的就是iphone 6，其他品牌机可以按照下面原型尺寸进行设计试用)

开始原型设计

一、确定原型尺寸

就像ios系统的iphone一样，虽然所分的系列、分辨率不同，可原型尺寸却很有规律(原型尺寸即为在Axure中要画出的图形大小范围)

下图为目前市面上比较常用的机型系统以及原型尺寸

(1)首先，打开Axure软件，在画板上用矩形框画出需要机型的原型尺寸，以我的手机为例，先画出375*667的矩形框。(最好是画在0,0的位置，要是不愿意画在零点处，也可以画在y=0的任意处。注意：要保证矩形框的y=0)

(2)点击创建好的矩形框，把它命名为手机屏幕，并右键点击它，选择转化为母版。

右键点击矩形框

转换为母版

提示：可以设置新母版的名称为“手机屏幕”，拖放行为为固定位置。选择固定位置可以有效的增强设计画面的整齐度，为原型的设计做好铺垫。

灵活使用母版也可以大大提升工作效率、节约时间，这样就不需要每画一张图就要重复一遍所有的操作。

二、设置页面排列水平居中

当完成上述创建操作后，就可以在矩形方框内开始你的原型设计了。当设计完内容后，点击画板空白处，确保右侧功能栏上面的对象为检视：页面，选择“样式”一项，并在下面的页面排列一项中选择水平居中。

注意：如果原型不止当前这一页，之后每页的原型图的页面都要设置排列水平居中。

三、设置生成HTML的移动设备

当完成上面的步骤后，键盘点击F8或者点击屏幕右上角的“发布”按钮，选择生成HTML文件。

打开后选择“移动设备”

并选中“包含视口标签”，点击生成按钮即可

四、发布到Axure Share网站

首先你需要创建一个账号，点击屏幕右上角的“共享”按钮，按照上面流程完成注册以及登录步骤，这样你就拥有了一个可以分享原型的账号以及专属的原型浏览网址。

可以设置名称、密码以及存放的文件夹

注意：点击“发布”会生成一个原型页面链接，可以选择“不加载工具栏”，不加载或者加载会生成两个不同的网址，可以根据需求进行设置。

五、用移动端进行查看

发送网址到移动端，然后使用手机浏览器或者用微信打开网址，即可正常浏览原型设计。

至此，移动端展示讲演结束，期待与您的交流沟通！