利用axure进行响应式自适应网站的设计

在axure 8发布以后,可以利用几项技术(axure自动生成自适应html、前后端分离、响应式网站设计、restful接口、json或xml等)进一步简化网站的开发,该设计模式的主要流程如下:

1. 产品经理利用axure设计原型。

2. 原型讨论定型后由UI人员设计图标,更新到axure原型中。

3. 由axure生成自适应的响应式网站设计的html文件。

参考:http://www.woshipm.com/rp/696039.html

注意:axure发布项目生成html时,在左侧的“移动设备”这个设置页,需要勾选“包含视口标签”,不勾选“禁止页面垂直滚动”,宽度设置为“device-width”,高度留空不设置,初始缩放倍数绝对不能设置,最小缩放倍数设置为“0.1”,最大缩放倍数设置为10,允许用户缩放留空不设置,ios部分可以不理默认即可。另外需要axure 8以上版本才能普遍适配手机屏幕。

4a. 前端开发人员全盘使用上面生成的html文件、资源文件、axure的js文件,在各个页面上以前后端分离方式添加业务逻辑的实现(比如在html中加入jquery的ajax,和后端交互数据)。

4b. 后端开发人员设计和实现业务逻辑和前后端接口(4b可以和3、4a步骤同步进行),比如前后端使用restful的json封装作为前后端接口的数据交互。

5. 单元测试、集成测试、灰度测试,bug修复,发布上线。

该模式问题: 一旦axure原型有修改,前端怎么能更快适配该修改(现在是文件比较方式,类似git的merge)。

这里有个例子:

http://www.car-ocean.com/app-download/news.html

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 89,545评论 13 124
  • 一直以来Axure在对移动端原型设计方面的支持都不是十分理想,它没有像目前其它几类原型设计工具(Justinmin...
    AllenBan阅读 2,594评论 0 1
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 140,023评论 20 594
  • 秋之夜, 风之瑟, 影晃枝摇花亦落。 月挂枯枝寞。 思之过, 念之错, 引得相思与秋和, 触景惹泪堕。
    ZXD天空阅读 70评论 0 1
  • 我通过我的灵魂与肉体得知,堕落乃为必需。我必然经历贪欲,我必然去追逐财富,体验恶心,陷于绝望的深渊,并由此学会去抵...
    木卯丁阅读 53评论 0 0