Google Web App开发指南第三章:案例研究

2012-02-24 10:05  来源: webapptrend.com

旅程计划应用(Wayfindit: Trip Planner App)

在大多数情况下,Wayfindit的应用必须有很好的易用性。旅行是一件很复杂的事情,不管是商业旅行还是休假旅行,一个顺利的旅程要求从家门到目的都没有意外之忧。Wayfindit的应用要能给旅行者提供所需信息,并且要快而准确。这意味着它需要一个最小的、直观的、响应式界面,能在前端提供有关内容的重要信息——HTML5的地理感知和离线存储特性实现。

一个完美的袖珍指南

它就装在你的口袋里或者包里,即时提供信息。它拥有本地存储和地理感知功能,只需要检查下当天时间,Wayfindit Trip Planner app就能显示出你的日程表,并在你有时间剩余时给出建议,在你靠近一个美丽景点时给出提醒,以及一个智能地图和方位指示。

Wayfindit Trip Planner app利用HTML5的特性给人们提供了一个方便的、随时随地提供服务的、智能的旅程伴侣。它具有很好的交互能力——视觉上清晰,性能优异,能明白旅行者的需求和所处环境。它能让假期更为愉快,使用起来也让人倍觉乐趣。

到达服务

飞机刚刚降落?基于旅客的位置和最后一次访问互联网时的信息,Wayfindit Trip Planner app就能立即提供一辆出租车,以及附近的餐厅或活动信息,或到酒店的路径(以及酒店距离此处的距离)。

所有这些信息的到达都以以毫秒为单位——这个应用由内而外都设计精巧,各部分功能都尽量压缩,以确保它给人感觉迅速。

住房服务

旅行者这时候驾着租来的车驶向了旅馆。应用了解这一点,并会在随后提供停车位数目。所有这些信息都是存储在本地的——不管是否有网络连接,这些信息都是即刻可用的。

多种选择

Wayfindit Trip Planner App采用了HTML5和CSS的响应式设计。在一个较大的屏幕上,比如笔记本或平板电脑,它能提供更多信息。除了酒店入住和出租车租赁信息,还会提供一些周边信息,例如酒店和活动推荐。(在手机上也能看到相同信息,但是需要向下滚动页面。)

酒店和活动推荐是基于旅行者的地点和当日时间。

饭店服务

想要知道去饭店怎么走?Wayfindit的Trip Planner知道怎么到那儿——步行、打车或者使用公共交通(如果它知道那儿没有可租用的车,就采用公共交通)。如果旅行者正在使用这个应用,他只需要一次点击就能呼叫正确的电话号码找到交通工具。

由于这个应用是可感知地理位置的,它能提供周边的景点信息,这些信息存储于本地数据库,Wayfindit Trip Planner App能根据数据库信息作出智能推荐。

总结功能

一日结束后的回顾总结能让旅行者留下更深刻的旅行记忆,这同时也能提升Wayfindit Trip Planner App的明日推荐。Wayfindit Trip Planner App提供了一些漂亮的HTML5表单,让用户可以很方便地为当天活动作出评级。

Khan学院(Khan Academy)

Khan Academy以视频课堂的形式提供了丰富的教育资源,这些资源富于教育性,容易获取,并且完全免费。Khan Academy还提供了一个“知识地图”和一些统计数据,引导你学习课程,并且记录你的进度。这对世界各地的学生而言都是非常好的资源,无论是在校内还是校外,无论是出于教学目的还是仅仅出于兴趣。它值得使用web上最好的展现技术,所以我们将Khan Academy作为一个例子,将其引入HTML5的时代。

焦点集中在教学内容

Khan Academy的视频内容是其网站的焦点,我们做了重新设计,使视频处于前端,免于干扰。视频占满屏幕,辅助信息在不需要的时候都消失了,以提供沉浸体验。当导航出现的时候,它也是最小化的——一切都是为了学生更好地学习。评论和提问部分都是最小化的,并且除非用户需要,评论和提问部分的内容是不会加载的,以节约加载时间。键盘上的一些快捷键让导航更为容易。

界面本身遵循响应式设计的思想,通过使用HTML5的meta viewport tag和CSS的媒体查询功能,移动设备用户在他们的设备上可以看到相同内容,但这些内容都是以最适于他们设备的布局呈现。

一个进度条(使用HTML5的《progress》元素)为学生的学习进度提供了一个直观的视觉反馈。本地存储的使用使得查询学习进度十分方便——无需登录存储或者记录数据,未来,这一应用还将大幅度提升其性能。

学习树

在“学习”标签下,有一个内容明细,Khan Academy的上千学习课程和联系都分成目录和子目录,易于检索。在这里也有一个进度条,提示学生各个标签下课程的学习进度。

在目录和子目录之外,会提供一个课程清单,一门课程中的一组视频是通过栈来指明的。和Khan Academy网站的已有组织不同,Khan Academy的HTML5应用中的视频课程和内容是以相关度进行分组的,这样相关内容都可以在一个地方就可以访问到。

Khan Academy web app使用了HTML5为学生提供了一个设计精良、永远在线的资源,他们可以学习、练习、跟踪所学内容。鼓励学生去学习可能是比较困难的,但是Khan Academy尽可能多地去除了障碍。它速度快,可以交互,并且提供了大量有着直观导航的学习资源,所有资源都可以无干扰使用。

美图(Picture Page)

Picture Page给了人们以一种全新的方式去看发生在世界上的事情。如果说一幅图相当于1000个词,那么Picture Page比世界上大多数出版物提供的都多,情感和细节都得以展现。Picture Page上只是一系列图片,附带有很小的、简单的不显眼的标题,这个站点的强大之处正在这里——它让图片作为焦点,让图片去讲述它们自己的故事。没有弹框,没有难以导航的幻灯片,没有微缩图。这个HTML5 Picture Page app给现有的很多图片新闻网站提供了一个创新的方式,将它们带入了一个全新的web app世界。

顺其自然

Picture Page这个应用名字本身就很好地描述了它——大的图片是它成功的关键。Picture Page的HTML5的re-imagining功能让图片可以以更大方式展现。通过使用CSS的background-size性质来自动缩放照片,照片可以占满全屏,成为焦点。

响应式设计使得移动设备用户能看到大小合适的小版图片;CSS3的媒体查询语句使得图片可以全屏展现而又不影响性能。它还能够像native mobile app一样检测挥动和触屏动作。Picture Page在任何设备上感觉都十分自然。

把用户体验放在第一位

Javascript让用户可以通过键盘快捷键对Picture Page.进行导航。使用左右箭头或者自己约定的J\K键可以向前或向后翻动图片,这样就减少了用鼠标导航时寻找光标带来的干扰。当不需要的时候,箭头是被隐藏的,这样图片就不会受到影响。

使用HTML5的《progress》 tag,可以展现相册访问者的进度。

Picture Page是应用时代没有使用背景构建(ground-up reconstruction)的一个很好的例子。它优雅,视觉效果好,备受喜爱。因此我们可以在合适的地方应用HTML5提供的特性,将现有网站和新鲜的技术结合,展现出更好更大的图片。

本文编译自ling,原文地址

译文出处:webapptrend.com,转载请注明出处链接。

周鸿祎:用360的开放推动大平台的开放

2012-01-09 14:08 来源: 新浪科技

奇虎360董事长兼CEO周鸿祎

奇虎360董事长兼CEO周鸿祎

新浪科技讯 1月9日消息,2011年度中国游戏产业年会今日在西安拉开帷幕,奇虎360董事长兼CEO周鸿祎在会上发表演讲。新浪科技全程直播此次大会。

以下为演讲实录:

很高兴能跟大家交流,把我安排到最后一个,可能会议主办方希望我放点炮,但是每次到网游的年会上来发言,我都觉得特别紧张,因为我是一个网游的外行,从来不玩游戏。我今天上来想讲一讲在网游的行业里360能做点什么。

2011年中国互联网最大的一个变化,就是大家开始谈论开放,谈论开放平台这个概念,在2011年之前,可能整个互联网大家日子都不好过,但2011年有了360的开放之后,也推动着很多巨头不得不开放,或者被开方,或者半开放,但是不管怎么样,总比不开放要强。所以有了开放,过去被垄断的流量会被释放出来,过去被垄断的用户也不得不分享出来,这样就给我们很多年轻的创业公司,年轻的创业者至少降低了创业的成本,至少提供了很多发展的机会。

所以我觉得从2011年开始,开放已经成为整个行业的共识,也是大势所趋,虽然开放还做得不是特别的彻底,还不能一步到位,但是我相信只要有360继续在这儿扛着开放的大旗,包括360像一个鲶鱼一样,把整个水搅活,我们坚持给予最好的分享平台,我觉得我们虽然很小,但是我们像一个秤砣一样,我觉得我们会推动互联网这些大佬和巨头,他们也不得不选择在开放的路上继续走下去。

具体到网游行业,在去年因为360的浏览器,360的桌面还有360的网址导航都已经成为在中国应该是最大的上网入口,特别是360浏览器从使用时长来看,已经变成中国最大的平均使用时间最长的浏览器,所以在去年我们先尝试了面对网页游戏的开放平台,因为大家都在浏览器上玩网页游戏,360自己我们没有做游戏的DNA,因为周鸿祎自己不懂游戏,也不玩游戏,我们相信放弃自己做网页游戏,但是我们跟中国近百家大大小小页游展开了全面的合作,我们背后站着近百家游戏厂商,在我们平台上也提供了近百家各种形形色色丰富多彩的游戏。

我觉得从2011年来看,页游的开放平台策略应该说效果非常的,也非常的成功,举一个最简单的例子,比如说现在别人自己有铸币权,自己能发行货币,经常说用我的软件给你送俩币,或者说送点狗粮,360没有狗粮可送怎么办?360有这么多的合作伙伴,我们可以送合作伙伴的道具,可以送合作伙伴的游戏币,同样可以给360的用户创造有价值感的体验。所以,我经常在内部跟我的团队讲,我说开放不是一句口号,开放也不是标榜对外的公关姿态,开放实际上是我们360存活下来必须走的路。

如果我们不开放,在我们平台上有浏览器,没有多彩的应用,光有桌面,没有各种娱乐化好玩的东西,这些东西是没有竞争力的,到了今年我们开放的路子应该可以迈的更大一些,所以我们也开始考虑一个问题,就是传统的有端游戏,或者游戏年会的主教,MMRPT,这些传统的游戏,我们也觉得大家面临很多的挑战,刚才我也在下面听大家讲了那么多,太细节的我也不懂,但是我听明白了,有人说一半是海水一半是火焰,我觉得应该说一家是火焰,其他家都是海水。还有大家说到底是冬天还是春天,我听了好像只有少数厂商觉得日子过的很红火,其他人大家都在说用户获取成本在增高,今年由于整个产业新增长了几十亿的收入,好像自己没拿到多少,大家都觉得日子越来越难过,而且新的游戏,新的厂商真正涌现出来的也不多。这里面的问题大家可以去谈创新,刚才淘米的汪海兵说创新,我个人觉得在目前谈创新都在给别人做样板,因为你创新的都被别人一夜之间拿走了,都拷贝了,我们没办法,但是说自己的游戏品质提高。

举一个比喻,我们做游戏跟做电影不太一样,拍了一部大片,真的有明星,真的有好的演员,有好的内容,确实能异军突起,但是假设一下,您今年做了大作,但是院线都被别人控制了,院线不给你上这个片子,你怎么办?实际上很多网游厂商今天在这个问题上都挺痛苦的,360我们觉得在这个局里,360也可以扮演鲶鱼的角色,我们今年跟游久做了一个合作,我们也投资了他们,我们做了一个合资公司,我们把我们用户差不多9000万的产品叫“保险箱”把它放进来,我们想做什么呢?很简单,360的保险箱应该说在所有的网游用户玩家中都是使用率非常高的,再加上360其他安全的产品,我们今天有超过3亿的用户,我就在想我怎么把我的3亿用户贡献出来给公司用,但是我们不懂游戏,我们去年用游览器做了一些页游的尝试,但是水太深了,我们希望找一些合作伙伴,我们把我们的资源注入给他,我们把我们的用户,把我们的产品给他,我们希望把游九打造成一个面对游戏厂商的新的开放平台,我们希望能用这个开放平台解决我们现在众多游戏的几个问题。

第一是获取用户成本高,第二是获取新用户非常困难,包括老用户维持的成本也非常高,就像当年的《联众棋牌》一样,为什么快速被打掉?因为你的用户都挂着别人的传呼机,每天被人做定向营销,在这种情况下,你的用户不断被别人召唤,而你很难获得这种能力。

大的道理我谈不拢,我做客户端出身,我理解网游最痛苦的,就是你游戏再牛,用户也不可能每天开机就启动,用户也不可能每天都上你的游戏平台玩,它有一个频度,我们没有常驻在用户电脑里的客户端,我们没有跟用户保持能够顺畅沟通的途径,其实我们网游厂商就非常被动,比如说你有新的版本更新,用户是不知道的,只有用户哪一天进来玩你的游戏了,你才告诉他说我这有更新了,我这有活动了,送你两把刀,给你三把剑,但是可能非常被动,我们推出新的游戏,推出新的一些产品,我们只能被动等着用户来用我们的产品或者登陆我们的官网,我们不能主动的去呼叫用户,这就是一个特别本质的差别。

而网游市场里的第一名知道他们家把数据展现了出来,您的数据很刺激大家,非常骄人的业绩,我也觉得他们做的很好,但是不能否认,因为别人有一个跟用户保持永远连接的能力,这样一种信息沟通和推从的能力,360就在想,我们就在想我们的保险箱,我们的桌面,我们通过跟游九合作,我们能不能把我们这种能力释放出来,帮助中国所有的网游厂商,使得你们对用户有更强的影响力,跟用户有更多的互动,包括把你们新的产品可以让用户频繁的知道,可以提高老用户的访问频度,能维持老用户,同时在用户许可下,帮助你们挖掘更多定向用户,这个世界不应该有人修围墙,我觉得用户是你的,也是我的,是大家的,他既可以玩张三家的游戏,也可以玩李四家的游戏,凭什么最后所有的用户被人定向推送,拉到一家玩,如果这样的话,这个会也不用开了,只要一家厂商开就好了。所以我觉得整个行业有这些大树能够活的很好,我们非常恭喜他们,但是我们也需要一个健康的产业链,大树之下不能寸草不生,更多的网游公司以合理的成本,获得用户,有良好的发展,这样才会有更多的创新,否则在有创新,没有用户的推广,没有用户的获取,你对创新用户根本不知道,最后被人抄袭了,人家还以为抄袭者才是原创者,我觉得我们中国网游行业就没有创新的动力。

360我们有我们的优点,我们有我们的缺点,我们的优点我们的用户可以排到前三名,无论360桌面还是360浏览器,还有我们的保险箱,我们有非常多的高转换率的用户,我们希望把这些用户奉献给大家,弱点就是我们不懂游戏,我们跟完美、跟巨人聊了很多次,大家有时候觉得跟我对话有点鸡同鸭讲,所以我经常说我来看游戏年会有点像太监上青楼,找不到感觉,但是我们这次跟游九合作,我觉得我们找到了懂游戏的团队。

我们希望通过他们加强我们跟游戏行业的合作,能弥补过去360的不足,同样对178等等过去做游戏媒体的,我们想讲我们跟游九合作,不是为了跟大家竞争,我们想把我们的保险箱打造成聚合平台,我们希望帮助你们推广,帮助你们带流量,360在这儿只有一个希望,希望网游行业我们通过给大家做这些事情,我们也能分享一些收入,但是更重要的是我们真的不希望中国互联网在各个行业里面360一看,自己孤零零一家面对一个巨头,我们也没啥可玩的,但是我们背后如果有几十家,上百家网游厂商,你们活的很滋润,可以给360平台上提供有意思好玩的产品,我们也可以给用户说我给你发点狗粮,发点猫粮,这是我最大的希望。

驳《Web已死》:App不是未来

有人说这是一个App的时代,到处流行的都是Web大势已去,App才是王道。

第一次提出这种说法是在1997年的《连线杂志》中,在2010这种概念又再次来袭,当时克里斯·安德森写了一篇文章叫《Web已死》。

在《Web已死》文章中,克里斯·安德森说从诞生到现在,万维网(World Wide Web)已经走过了20个年头。相比当年的流行,如今它已经开始衰落,逐渐让位于更简单且时髦的服务——例如应用。这些服务更关注的不是搜索,而是获取。我们正在逐渐抛弃开放而自由Web,寻找更加简单、时髦、用起来更舒服的服务,这丝毫不亚于我们当初对它的喜爱之情。

对不起,安德森,你错了,我们都错了,链接才是王道,这是Web独有的,App不会有,不管它看上去多么丑陋多么怪异,但是你能通过它进出自如。

App想替代Web,还嫩了点儿

喜欢App的人,不过都陷入了创新大佬们为你设置的花钱的东西上,用户陶醉于一个被高度管制的类似迪士尼乐园的App世界,以为从此逃离了看似杂乱无章的,又疯又野的Web世界的威胁,但是,沉浸于App世界的时候,是否想过,你是被束缚起来的。

打个比喻说,你的iPad或者iPhone就像一个筒仓,一个高大的垂直建筑,里边有无数的东西,但是没有什么能真正进入或者出来,这不是由创建应用的人能很好控制的,糟糕透顶。App想替代Web,还嫩了点儿,就像一个人说,我有了浴缸,不再需要海洋那样,荒谬,不管你的浴缸有多美,能和海洋比吗?你能在它旁边造块儿陆地出来吗?

App就像90年代的CD-ROM

Hanselman有一篇文章说,App就像90年代的CD-ROM,我们只能下载更新直到新的CD-ROM发行或者带宽增加。

并且现在的自动更新都只能解决一部分问题,App还只是一个个有着各种功能的独立岛屿,相互没有交流没有来往,不过好的是,这些应用能和云及各类服务联系起来,而遗憾的又是,现在手机上知道这么做的应用几乎没有,他们都认为自己应该是独立的。

App总是向你推荐一些可有可无的功能,让你管理应用,更新产品,储存东西等,做一些毫无意义的事情,相比起来Web就弱爆了。

Web又是什么?两层含义:普通层次的Web指的就是Http Web,是由 Apache, Nginx, node.js,,CouchDB,MySQL, JSON,RSS, OPML,,XML-RPC,及 REST所支撑起来的Web,是本地App与Web App都离不开的后端数据库与API。

高层次的Web就是HTML CSS, 及 JavaScript,是一个可以运行浏览器的Web,是一个在某些方面落后于本地App的而又始终比本地App强大的Web。

Web与本地App,无限循环

来自本地App的压力推动Web向前发展,而来自Web的压力又推动本地App的向前发展。的确,现在JavaScript, HTML 以及 CSS乱成一团,但你要相信,它们不可能永远如此,一切都在发展变化,今年HTML 5不是挺火的吗?当浏览器变得更加智能,本地App怎会想办法推出新的交互模型,新功能,可能会使用到HTML 9或者HTML 10,然后无限循环。

可参考右方的循环图,先有Web Hack,在此基础上形成Web标准,基于标准又开发出Web App,然后有了新的体验,催生了本地 App,接着又出现了浏览器插件,然后再出现新的Web Hack,这样循环下去。

App还不能代表未来,正如Dave Winer所说,Web赢在链接,至少现在是这样。

Via:scripting& inessential& hanselman

来源: 雷锋网(annie 供雷锋网专稿,转载请注明!)

感谢 雷锋网 的投稿

周鸿祎:为什么中国出不了乔布斯

周鸿祎(奇虎公司董事长)口述

成王败寇的文化没法创新

要论聪明,中国有很多人不会逊色于乔布斯;论市场的规模,中国的互联网和IT市场绝对是全球第一大市场,但为什么中国出不了乔布斯?

我觉得乔布斯的核心首先是创新,这是中国文化很难接受的。创新意味着失败的概率比较高,而中国人的文化里非常害怕失败。我们崇拜成功,鄙视失败,害怕失败。结果就是大家都去抄袭别人,让别人先走,然后再跟上,这样最保险。大家都愿意随大流,一块去做事,一块去做团购。但创新就要做别人想不到的事情,一定是少数派,要忍受寂寞和别人的嘲笑。

我认为,乔布斯今天能够得到很多中国人认可,还是因为苹果市值最高。这就跟政府只以GDP为标准一样。不改变这种文化,不可能追求创新。我们很多企业家只想着挣钱,挣很多钱,没有像乔布斯一样,想着去创造一个前所未有的东西,去改变世界。乔布斯的出发点和我们非常不同的。

中国企业本身没什么创新,更多的是通过抄袭、垄断,然后打压新生的力量,所以我一点都不怀疑以后中国互联网里出现一些市政、高速公路公司。

即使苹果市值没有今天这么高,我依然认为苹果是伟大的。像乔布斯这么创新的一个人,有所长必有所短,性格中有这方面的优点,一定就有那方面的缺点,问题是我们只看着乔布斯优点那一面。我们的文化里面能容忍有这种明显缺点的人吗?能容忍他这种直来直去的说话方式?

中国企业家发展起来以后,就把自己的棱角藏起来,把自己包装起来。但乔布斯获得巨大成功之后,并不掩饰自己,他并不为别人活着,不是刻意去怎么样。他跟癌症较劲,跟自己原来的成功较劲,也跟原来的失败较劲。他就是直来直去,所以很多人受不了,但我认为这是一个真实的人,虽然他有时候脾气不好、独裁、像个暴君。这是一个缺点,也可以说是一个特点。如果他不计较,把什么都放得很松,可能对产品就不会这么精益求精,但要做出世界上最棒的产品,就得鸡蛋里挑骨头。

你能特立独行吗?

我们的文化还反对特立独行,反对与众不同,觉得创新的人是二百五,因为你不是在做大家一窝蜂去做的事。我们太在意别人的提议,我们每个人都活在别人的评价之中。但创新意味着你要比别人看得远,洞察力比别人强,大多数人理解不了,这时候评价可能是完全负面的,或者说完全不理解你的意思,这时候你能承受这种压力吗?你能特立独行吗?一般人做不到。

中国目前价值观是一种实用主义的价值观,或者叫一元化的价值观,就是管你坑蒙拐骗,只要销售高、收入好,就像很多地方政府只要GDP发展了就什么都好。

一个国家跟一个公司是一样的,不能搞一元化的标准。污染环境、浪费能源、破坏不可再生资源,这种GDP没有意义。一个公司如果只用数字衡量,那所有人都会去抄袭,因为抄袭、山寨、拷贝最省事。

对于那些创新但不成功的企业,应该一样承认他们的价值。美国非常崇拜这种白手起家的英雄。我们这个价值观不改不行。今天一个企业做得很大,我们往往会对他锦上添花,但其实创新往往来源于小企业。

我们总是不喜欢挑战和颠覆,实际上,创新在美国就是意味着小公司去颠覆大公司。苹果始终扮演挑战者的角色,但是挑战在我们的文化里往往显得咄咄逼人,显得没事找事。搅局者和破坏者,在我们的文化里全是贬义。

如果中国不花点时间重新去改变这个文化,那我们教育出来的人,大部分都会没有创新能力,不是没有这个智力,是没有颠覆的胆量,也没有这个环境。少数漏网之鱼可能也在成长过程中被扼杀掉了。中国缺乏创业环境和创业文化,如果有了这种文化,再加上中国这么大的市场,这么多的聪明人,我相信一定会出现乔布斯。

制度上该如何保证创新

中国人办创新型高科技公司,基本上都是从美国拿的钱。创业者团队规模很小,只有一帮人,在国内物化的环境里就不被重视。在硅谷,想法创意很多,只要被认可就有人愿意投资。

我们企业上市时,实际上盈利状况并不是很好,但到美国上市,人家需要的是未来的成长。中国上市是审批制,不是市场来决定你的好坏,是由少数人来决定。美国上市很容易,只要能找到承销商愿意帮你卖股票,投资基金愿意买,财务经过四大会计师事务所的审计就行。这对创新是鼓励的。

在美国上市,还有一个好处是与国际接轨,获得一个世界级资本市场的认可,有助于国际化业务拓展,包括在国际上的竞争和合作。虽然说我们创业板弄了很多公司包装上市,但并没有真正解决这些创业者需要解决的问题。我们更喜欢干的是锦上添花,而创业者需要的是雪中送炭。

美国的银行也不会贷款给创新企业,因为没有任何可抵押的东西,所以这种企业发展一定是靠风投来支持。美国的风投已经非常成熟,他们对创业团队认可和尊重,比如投了很多钱只愿意当一个小股东。中国今天很多有钱的老板听说投资很热,拿点钱来投,投了就觉得这个企业是他的了,要控制这个企业。这种事情很多,背后实际就是社会的价值观和文化的问题。