使用Axure制作完成移动端原型以后，如果需要在手机上进行演示，该如何进行操作呢？普通的方法就是将原型文件上传到托管平台上面，然后生成一个URL链接发送到手机上用浏览器打开。如果能将URL链接生成一个二维码，直接用微信或QQ等应用直接扫描就能打开原型，这样访问体验能有很大的提升。所以今天这篇分享就是教大家如何将Axure制作的移动端原型生成二维码。
下面这个就是我用原型链接生成的二维码图片，直接用微信或QQ扫描这个二维码就能体验到效果。
链接地址：http://www.axureux.com/demo/ResumeTemplatePro/mobresume3.html
01移动端原型的设计规范
为了达到在手机端访问原型时最佳的演示效果，我们在使用Axure制作移动端原型时需要遵守相关的设计规范。这部分我有在之前的分享《使用Axure打造最佳的移动端交互原型教程》中有过详细的介绍，大家可以访问网站上的教程分享栏目查看这篇文章，本篇分享的重点是关于生成二维码的方法，所以对设计规范不再进行展开的介绍。
关于移动端原型的设计规范重要的部分就是内容区域的定义，我个人推荐的内容区域宽度尺寸为375px，我所制作的所有移动端原型全部是按照这个尺寸设计的。大家在制作移动端原型时可以根据需要进行调整设计尺寸，但是一旦确定下来以后需要当作一个标准进行延续。
02移动端原型的导出设置
原型设计完成以后进行进行生成HTML的导出设置，这项设置主要是争对在移动端设备上的适配效果。设置位置：发布菜单—生成HTML-移动设备，在界面中勾选“包含视口标签”，设置宽度为：375，设置缩放为：no，其它选项为空就可以了。
03将原型打包上传至托管平台
原型生成HTML文件以后我们需要打包上传至原型托管平台上，上传以后会生成一个对应的URL链接。关于原型托管平台我比较推荐国内的产品大牛，百度搜索“产品大牛”便可以找到这个平台。下面的这个演示链接就是我上传到产品大牛以后生成的。
产品大牛演示链接：http://www.pmdaniu.com/storage/51693/af729afa027d093d63fc46962c5f11be-2316/mobresume3.html
需要注意的是，HTML文件打包上传到产品大牛以后生成链接的默认结尾是start.html，我手动将它修改成了mobresume3.html。因为start.html是Axure生成HTML文件后的框架页面，我们在用URL链接生成二维码时是不能直接用这个默认地址的，需要用指定的页面链接来生成。例如你的原型的第一个页面的名称是moblie，那么需要将生成的链接地址的结尾由start.html改成moblie.html。如果你的原型中包含多个页面，你也可以将start.html改成任何想要直接跳转到的页面。
除了产品大牛这个原型托管平台之外，也可以使用Axure自带的原型托管平台Axshare。在Axure的发布菜单下有一个“发布到Axshare”的功能，通过快捷键F6也可以直接打开这个功能，点击发布按纽就可以将原型直接发布到Axshare了。如果你没有注册和登录Axshare，点击发布的时候会弹出一个登录界面，你只需要按步骤完成注册和登录就可以了。Axshare的托管服务是完全免费的，不过有时候在国内访问会有点慢。
原型发布完成以后同样会生成一个URL链接，我们在生成二维码的时候不能直接用这个链接地址，也需要在链接后面加上对应的页面名称，原因跟上面描述的一样。
Axshare演示链接：https://i5rs48.axshare.com/mobresume3.html
04将链接地址生成二维码
原型发布到托管平台并生成URL链接以后，最后一步将就是对应的URL链接生成为二维码。生成的方式有两种，一种是使用火狐浏览器的二维码插件进行生成，另一种是使用专门的二维码生成工具。
使用火狐浏览器的生成二维码的方式非常简单，使用火狐浏览器打开需要生成的链接地址，点击地址栏右边的二维码图标就可以将链接生成对应的二维码了。下面这个截图就是使用产品大牛的演示链接地址生成的效果，截图保存这个图片就可以用微信或QQ手机应用扫描进行访问了。火狐浏览器的这个二维码生成插件是自带的，其它浏览器我没有使用过，有的可能需要安装一个生成插件。
使用专门的二维码生成工具的方式也很简单，百度“二维码生成器”就可以找到很多类似的工具，例如下面这个草料二维码生成工具，将链接地址粘贴进去，点击生成二维码就可以了。
草料二维码生成器：https://cli.im/
05Web型简历导航效果实现
-
如果你有自己的FTP空间也可以将原型打包上传以后用对应的链接来生成二维码，原理上是相同的。
-
如果你需要更新原型的内容，需要在原来的文件上进行更新，对应的页面名称也不能删除，否则生成的二维码也会失效。
-
只要原型的链接地址是固定的，二维码都是一直有效的。但是如果你使用托管平台生成的链接地址是动态的，那么生成的二维码可能会随时失效。
-
使用Axshare的链接生成的二维码在使用部分应用扫描时无法访问，具体原因未知。
交互原型模板及元件库分享平台
www.AxureUX.com
长按二维码
关注AxureUX
原创文章，作者：交互精选，如若转载，请注明出处：https://www.iamue.com/36045/
