WAT (">Web App Template) 是微软所开发,专门设计将既有的网站转成 App 的免费 Visual Studio 扩充组件,此前的文章已有简介: WAT- 将既有网站快速转为 Windows 8.1 App 或 Windows Phone App 的免费工具。上个月也刚推出了 Universal Apps v2.0 的版本 (http://wat.codeplex.com/)。
WAT 的目标定义明确,即是要让企业能完全延用在既有网站上的投资、同时还能以直觉简易的 config 方式让 App 实作出平台功能 (如 Windows Live Tile、App Bar 等)、而且无需每次网站改版即需重新编译。
WAT 实作
在 Visual Studio 2013 中开启 Web App Template for Universal Apps- JavaScript 范本
可以看到此方案已预设包含 Windows 8.1 及 Windows Phone 8.1 的 Universal Apps 项目
要快速将 Web 转为 App,需要 config 的地方只有一个,就是 Shared 中的 config.json 檔。
将其中的 homeURL 改为 Bill Gates 的网址 (http://www.gatesnotes.com/) 之后,同时以 Windows Phone 及 Windows 8.1 仿真器执行的画面如下,可见到已符合 Responsive Web Design (RWD) 规范的网站转为 App 之后,即能因应不同尺寸屏幕大小作适当的版面配置:
透过 config.json 客制化 App
所有 App 功能面的实作,全部是透过修改这个 config.json 档来完成的,包含最重要的无因特网时的脱机 Offline 支持、给定 RSS Feed 即能达到 Live Tile 的效果、给定 Search URL 即实作出 Search Charm Bar、给定外部连结即可实作 App Bar 及 Navigation Bar 等等。
完整的说明文件可见: http://wat-docs.azurewebsites.net/JsonWindows
目前能透过 config 方式即能实现的 App 功能如以下,未来能实现的功能还会不断增加。
除了功能面外,WAT 也提供了让您修改 CSS 档以改变 App 呈现时的版型 (但不影响原有网站的版型)
实际案例
有愈来愈多的国外网站在维护网站的同时、经由 WAT 建置 App 以因应行动化的需求,除了前文中介绍的 Low’s 及 Zoopla Property 之外,我们再以著名旅游规划网站 Expedia.com 为例。
以下可看到其网站及在 Windows Phone App 上各自的呈现:
1 of 3 2 of 3 3 of 3
回馈及讨论
利用 WAT 将既有网站转为 App 的过程可说是最简单的,config 的方式易于操作、维护及侦错门坎也低。
但最最重要的一点是,网站作了任何更新或变动,其 App 即能立即反应最新的内容;也就是企业本来即正常运行的网站维运流程几乎不用作调整,在最大化既有投资的同时还能以 App 打开另一个市场。
当然,为了因应各种不同尺寸的行动装置,亦强烈建议实行此方法的网站符合 Responsive Web Design (RWD) 的设计准则,以达到最好的使用者经验。
WAT 的未来
微软设计 WAT 的原始精神是将 Web Experience 作优化的运用,短期目标即是让各客户能延用在人力、技术及维护上的既有投资、同时能满足市场行动化的需求;长远而言微软会在 Web Experience 上作更进一步的投资!
由 Web 到 App 之路小结
简单来说,无论是否要走向 App 化,建议各网站可先行实作「钉选」的功能,毕竟简单又容易测试。
往 App 发展之路,若跨平台是现阶段的急迫性需求,可走 Apache Cordova 的方式,但其客制化及维运成本就相对高些;若无跨平台的急迫需求,建议可先走 WAT 的方式,对未来整体维运考虑上应能达到最好的 ROI 成效。