图1 模拟丁香园的高保真原型

在一般的开发工作之前,我们通常会设计产品原型,大部分为axure绘制的线框图作为产品的PRD文档,供UI和开发进行前期工作,但是有的时候客户、领导想在开发之前,看到产品的概貌,就必须做产品的高保真原型进行模拟,这时如果做出来的原型能运行在手机端,那再好不过,如图1(注:上图是仿照丁香园的家庭用药,做的一个高保真原型,算是免费给丁香园打广告,是不是考虑给我点广告费?哈哈)。

原型制作软件有挺多,不过个人使用之后,最后还是依然坚持使用Axure,优点颇多,也可能是先入为主,这个教程Axure也是必须软件之一,适配为iphone5s。

1、首选是制作高保真原型,如图2:

图2 高保真的原型图

(注:高保真原型最好不要用太多内部框架嵌套,加载速度有点慢,还是用动态面板慢慢做,层级多了要有耐心)

iOS的屏幕尺寸目前是有限的几种,原型尺寸要和其一致。比如iphone5s视网膜下像素为640*1136(The default full screen size of the iPhone 5 is 320 x 568 px (w x h).就是说320*568已经可以铺满全屏,不过,由于Axure导出的原型在iOS上处理status bar时有问题,需要在高度上减去status bar的高度20,就为320*548,所以保证原型的高宽为320和548,如图3整体高度为548px:

图3 高宽为320*548

2、F8进行生成设置,设置如下图4:

图4 配置设置

按照上图,设置参数(注:不过闪屏页面一直无法出现,这个问题我也没得到解决,有解决的可以回复我)

3、生成原型文件,上传到axureshare或者放置在EasyWebSevr的根目录下,用本机IP替代电脑名称,获得完整路径。(不清楚的点击上期内容如何用EasyWebSvr搭建axure本地环境)

4、复制生成的html中原型链接,选择without Sitemap,如图5:

图5 复制链接

5、在safari中粘贴链接,并打开,已经可以看到和屏幕宽度的界面,并添加到主屏幕,如图6:。

图6 添加到主屏幕

6、可以通过桌面的快捷icon,进入原型,这个时候已经适配了手机,躺着桌面的icon,丝毫不会让人看得出是原型,下图7:

图7 test桌面icon快捷启动

end!

rp文件转换成html,Axure产品原型在手机上运行的方法相关推荐

  1. 如何将CAJ文件转换成PDF格式?分享两种实用的方法

    CAJ是一种特定的文献格式,通常用于中国学术期刊和学位论文等.在学习生活中我们查阅一些文献资料,一些权威文献报刊通常情况下都是CAJ文件格式,打开它需要使用专业的阅读工具 ,这时候就需要将它转换成PD ...

  2. 怎么把swf文件转换成mp4?分享三种简便易学的方法

    怎么把swf文件转换成mp4?什么是SWF格式的文件?SWF是动画设计软件Flash的专用格式,也被称为Flash文件,该格式被广泛应用于网页设计.动画制作等领域.另外,这种格式的文件可以用浏览器打开 ...

  3. CAD文件版本怎么转换?怎么将高版本文件转换成低版本

    CAD文件版本怎么转换?CAD文件是我们经常使用的文件之一,在使用CAD文件时,不少小伙伴经常会遇到CAD文件版本问题,而导致CAD文件无法打开,遇到这种情况最简单的方法就是对CAD文件版本进行转换, ...

  4. vs 如何将源文件转换成可执行文件_如何将图片文件转换成PDF文件?

    小编的一个朋友是做室内设计的,大家都知道做室内设计或者其它一些关于设计方面的工作都少不了画图.他每天会画很多张图并且还会反复修改,非常麻烦.有的图会因为不小心鼠标或者键盘误点了,导致一些图的数据错误, ...

  5. python文件转换成jar包_Python一键转Jar包,Java调用Python新姿势!

    粉丝朋友们,不知道大家看故事看腻了没(要是没腻可一定留言告诉我^_^),今天这篇文章换换口味,正经的来写写技术文.言归正传,咱们开始吧! 今天的这篇文章,聊一个轩辕君之前工作中遇到的需求:如何在Jav ...

  6. OFD怎么转换成PDF? OFD文件转换成Word方法推荐

    随着当前办公系统的不断优化,也衍生出很多特殊的文件格式.像之前我们聊过的caj文件,是针对论文打造的特殊文件格式,即对文件有了强大的安全系数保护,又可以满足用户的阅读需求.这一次我们要为广大用户们带来 ...

  7. CAD文件转换成图片的方法分享

    什么是CAD?CAD又叫作计算机辅助设计,是利用计算机以及图形设备复制设计员进行设计的一种设计软件,可以用来分析.比较和计算设计信息中的数据,减少设计员对设计图的修改,提高设计员的工作效率. 一.为什 ...

  8. xpdf将pdf转换为html,(WordExcelPDF文件转换成HTML整理.docx

    (WordExcelPDF文件转换成HTML整理 项目开发过程中,需求涉及到了各种文档转换为HTML或者网页易显示格式,现在将实现方式整理如下:?一.使用Jacob转换Word,Excel为HTML? ...

  9. Python图片操作-psd_tools:将psd文件转换成BMP

    §01 转换psd文件   psd文件是Phtoshop图片格式,使用Python的库psd-tools将它进行转换.最近由逐飞科技提供的 第十六届智能汽车竞赛AI视觉组分赛区数据集 所有的图片输出的 ...

  10. mpp文件转换excel_怎么将pdf文件转换成excel表格格式呢?

    在我们的日常工作当中,有的时候偶尔会出现一些商业E-Mail的发送,但是在发送之前我们是需要将PDF文档中的数据内容转换成Excel表格的形式.所以学会将PDF转Excel的方法很重要,那不知道小伙伴 ...

最新文章

  1. java 苹果vcf解析_VCF文件格式解析
  2. 用scheme重写Python的三大函数map reduce 和filter
  3. superset设置自动刷新
  4. 买房为什么要少出首付,多贷款?
  5. vue的基本项目结构
  6. 一文读懂云上DevOps能力体系
  7. Spring 整合 Junit4 进行单元测试
  8. linux上的 heartbeat 双机热备服务架设
  9. L1-034 点赞 (20 分)
  10. 程序员提高编程能力万无一失的办法
  11. oracle聚合函数
  12. WindowsXP系统主题成Windows7风格windowsxp主题包
  13. 数学建模之斯皮尔曼相关系数的假设检验
  14. 小程序 40163_小程序获取openid 出现null,{errcode:40163,errmsg:code been used, hints: [ req_id: WNUzlA0105t...
  15. 各类邮箱谷歌邮箱、Outlook邮箱、雅虎邮箱的购买养号策略
  16. win10无网络安装.Net Framework3.5
  17. bzoj 4987 Tree - dp
  18. 从零开始学习NLP - 综述与论文查找指南(待更新)
  19. 浅谈在软件开发中的开发与测试 - 下
  20. CSS Day02学习

热门文章

  1. 联想电脑杜比音效--低音炮配置图
  2. 三菱PLC定位控制2
  3. r语言中trifit怎么用_用R语言做非参数
  4. oracle存储过程实例
  5. 浮点数计算机组成原理问题,计算机组成原理习题及答案
  6. 计算机辅助翻译入门第十章课后答案,计算机辅助翻译入门
  7. python 自动化办公 随机生成题库文档
  8. 安卓开发3d模型展示源码_Android(安卓)全套开发资料视频+源码
  9. Android9怎么剪辑音频,音频剪辑铃声制作
  10. VBXtraLib 1.0 下载