架构师文集100本web应用开发者_W

1、1周云鹏， 毕业于北京邮电大学， 目前就职于D C C I 互联网数据中心， 从事互联网行业与互动营销 研 究 工 作 ， 有 多 年 的 互 联 网 从 业 经 验 ， 在加入D C C I 互联网数据中心前曾在电信行业的相关 研 究 咨 询 机 构 从 事 研 究 和 工 作 ， 对 中 国 互联 网市 场 有 着 广 泛 而 深 入 的 理 解 ， 擅 长 定 性 研究 与 定量 分 析 的 结 合 ， 专 注 于 互 联 网 行 业 市 场竞 争 与 趋势 分 析 和 移 动 互 联 网 、 电 子 商 务 、 社会化媒体等研究领域。如今， 互联网产业正从信息时代过渡到应用时放平台的架

2、构正在 原有的规则和竞争格局， 重新构造一个全新的互联网生态体系。 开放是互联网产业发展的潮流， 各种类型的平台相继开放， 各平台品牌、 应用竞争激烈， 用户需求日渐多样化， 开发者之间竞争日趋激烈， 用户细分和产品细分日益重要， 既为开发者带来了机遇， 也带来了挑战， 开发者将扮演重要的推动者和实践者的角色， 而开放平台将承载起创业平台的重担， 扭转开发者们不尽如人意的生存现状， 构建和谐稳定的产业链生态循环。目前W e b A p p 行业正逐渐从市场快速发展阶段步入应用创新和盈利模式探索阶段， 其特征是平台品牌、应用竞争激烈， 用户需求日渐多样化， 开发者之间竞争日趋激烈， 用户细分和产

3、品细分日益重要， 而根本上开发者和开放平台之间缺乏一种成熟的商业合作模式。 但随着产业链的逐渐丰富和完善， 优质应用的不断浮现和合理化盈利模式的产生， W e b A p p 将会深入走进人们的生活。1 今年中国各大开放平台的开发者大赛和开发者大会等活动纷纷涌现， D C C I 互联网数据中心调研数据显示， 2 0 1 1 年百度W e b A p p 应用创新大赛广泛吸引了开发者的参与， 参与度达到了 4 4 . 4 % ， 远超其他类似的大赛和活动， 不仅因为百度拥有庞大的用户基数， 同时在平台开放程度、 平台应用存活周期、 推荐排名机制和精准的用户定位上都较其他开放平台成熟。D C C

4、 I 互联网数据中心调研发现， W e b A p p 开发者现阶段面临的主要挑战中， 自身技术水平不够成熟是最大挑战， 技术仍是开发者迫切需要得到支持的问题， 而产品如何盈利则是开发者面临的第二大挑战， 其次是如何做出用户认可的应用， 这也从另一方面反映了目前W e b A p p 开发者希望获得的支持服务。 调研发现， 技术支持是开发者们最希望获得开放平台提供的支持服务， 无论是技术文档的完善还是开发过程中的技术问题的辅助解决， 都是开发者们期望的， 其次则是对资金支持和用户体验数据共享的期望。 百度自今年 4 月开始就开始举办技术沙龙并持续至今， 这一平台不仅能很好的满足开发者们对相关技

5、术方面的知识需求， 同时也给予了众多技术人员一个技术沟通交流的机会。2 0 1 1 年即将走向尾声， 迎来新的 2 0 1 2 年， W e b A p p 开发者们需要注意些什么呢？ 、 各开放平台拥有各自独特的平台特性和用户群特征， 随着开放平台的竞争加剧， 最终将会形成 2 3 家大型平台， 而其他平台逐渐差异化， 小型平台会垂直化发展， 应用逐渐细分， 开发者应根据自身的应用特性， 选择最适合的平台， 同时专注于自身的应用， 做好应用。二、 目前国内同质化现象问题严重， 提高自主创新能力， 形成差异化竞争优势将是解决这个问题的有效途径， 开发者应发挥自身的优势， 做出有自身特色的优质应

6、用， 才能在市场上奠定自己的优势地位。三、 百度用户主要以检索信息类用户为主， 分为工作导向型和休闲导向型， 生活/ 工具类应用将会是主要检索对象， D C C I 预测， 百度平台上的生活/ 工具类应用将异军突起， 但游戏类仍是主要应用， 在百度开放平台上的开发者应关注生活/ 工具类应用的开发。新的一年， 新的契机， W e b A p p 开发者们上满枪膛， 随时准备做一只“ 愤怒的小鸟” ！D C C I 研究员 周云鹏 2人物专访/ I n t e r v i e w0 4帮助每个人找到适合的好音乐 专访音悦T V 产品负责人李笋围观平台/ H o t N e w s0 8来自业界对开

7、放平台的看法研发技巧/ D e v T i p s1 0关于软件的体验设计3 总第三期封面报道/ C o v e r S t o r y1 6探索和创新 H T M L 5 在豆瓣中的应用专家门诊/ Q & A2 0热榜排行/ To p L i s t2 4游戏类工具类生活类编辑推荐/ E d i t o r s C h o i c e2 7应用点评/ C o m m e n t s2 8彭胜君付超群鄢学鹍（ 秦歌）用户心声/ R e q u e s t s3 1其实音乐本身并没有好与不好之分， 只是不同的人有不同的音乐喜好而已。具体到我们收录进音悦TV里的标准我们可能会从几个纬度去衡量。首先

8、视频质量要足够清晰， 其次要符合收录的频道主题。为了给用户更好的视听体验， 我们在收录的时候还会去关注视频画面比例是否是16 ： 9 的。 帮助每个人找到适合的好音乐 专访音悦TV产品负责人李笋1 . 先请您谈一下音悦T V 产生的背景， 最初开发的初衷是什么？音悦T V 的产生背景源于同事间一次偶然的聊天。 几位同事在午饭时讨论现在好多音频类的互动电台产品但是却没有针对视频的。 音频的电台还是仅仅满足了背景音乐的需求， 当用户想在大屏幕的显示器甚至电视上根据个人喜好观看音乐视频时， 这个需求几乎是无法得到满足的。 一番讨论后我们决定开发这么一款只针对高清M V 的视频类电台产品。 这个产品要

9、有足够多的M V 内容， 并且要保证画面具备足够的清晰度和流畅度。同时这个产品还要兼具聪明和智慧的个性， 可以根据用户的互动反馈来学习用户的音乐品味。 最终“ 音悦T V ” 诞生了。 42 . 在开发的过程中， 使用了哪些技术和工具， 主要的前端技术有哪些？音悦T V 是基于F l a s h 技术开发的， 开发工具主要采用的是F l e x B u i l d e r 。 前端倒是并没有用到很超前的技术， 只是为不同的页面嵌入做了不同的尺寸适配。 在第一版的音悦T V 里我们用F l a s h 实现了一些很炫的 3 D 翻转效果， 当用户点击换台按钮时， 频道列表会以一种很炫的 3 D

10、效果从一个角落飞出来。 但是到了第二版我们发现用户所需要的仅仅是安安静静不受打扰的观看一个感兴趣的音乐频道， 并且很炫的 3 D 效果会在一定程度上占用一部分用户的系统资源。 于是我们去掉了所有画蛇添足的 3 D 特效， 只保留最简洁最干净的U I 界面， 甚至还大胆的去掉了视频播放控制栏， 只为用户保留简洁的视频播放窗口。3 . 作为音乐类的应用， 您认为应用最应该具备的特质有哪些？ 在做设计时， 您的团队考虑的优先级最高的三个原则是什么？其实音乐类应用根据不同的应用场景所具备的特质应该也不一样。 当用户只是一个随便听听看看的需求， 那么满足这个需求的产品特质一定是简单快速， 最好是还足够智

11、慧， 可以把用户最有可能感兴趣的音乐播放给用户就好。 如果用户是一个淘歌的需求， 那么满足这歌需求的产品特质则需要曲库够大够全， 搜索精准， 分类清晰等等。音悦T V 的定位更偏向满足随便听听看看这类的用户需求， 所以我们在做产品设计的时候确实是花了一番心思的。 第一它要足够的简单， 简单到只要打开不需要做任何操作就可以用。 第二U I 要足够的简洁， 不能有任何干扰用户视听的元素存在。 也正是因为这个原则我们干脆把视频控制条放在了视频画面里， 当用户鼠标移出视频画面就自动隐藏， 只把用户最关心的视频画面呈现给用户。 第三它的频道分类要足够的清晰， 让用户可以用最简单的方式找到自5 己想要看的

12、内容。4 . 在开发的过程中， 遇到了哪些技术难点， 是如何克服的？ 开 发 过 程 中 确 实 遇 到 过 一 些 技 术 上 的 困难， 比如在第一版中我们在F l a s h 中实现的3 D 翻转效果。 由于F l a s h 对 3 D 的处理能力有限， 所以最终的效果总是离我们期望的有些距离。 好在后来尝试了一些其他的非官方F l a s h 3 D 引 擎， 在一定程度上解决了这个问题。 不过最终我们还是砍掉了 3 D 效果， 因为一部分原因是太耗性能， 另外一部分原因也觉得有些画蛇添足了。5 . 现在是否还有哪些问题让团队困惑或要极力克服的。由于音悦T V 实际上也是属于一个互动

13、视频电台类产品， 而决定电台类产品灵魂的莫过于音乐推荐的算法了。 我们的推荐算法来自对音悦台 5 0 0 万注册会员M V 观看收藏以及推荐记录的分析， 通过协同过滤的方式把用户最可能感兴趣的视频内容推荐给用户。 但是目前对这个推荐算法的结果我们还不是特别满意， 我们也在不断的尝试优化， 努力使推荐结果更精准。6 . 对产品的后续发展有哪些规划？ 是否考虑引入新的技术？为了让用户可以随时随地是用音悦T V ， 目前我们已经把它移植到了很多个平台上， 包括在近期我们推出的桌面版和移动版。 下一步我们打算用H T M L 5 对音悦T V 进行一次重构， 使用户在一些不支持F l a s h 的平

14、台上也可以享受音悦T V 带来的高品质音乐服务。67 . 对W e b A p p 开发平台还有哪些期望。百度不光更懂中文也更懂用户。 用户每天在搜什么百度知道， 用户的基础个人信息百度也知道。 如果能把用户喜好相关的关键信息开放给开发者， 开发者就可以根据这些信息为用户提供更精准的个性化服务了。 百度的个性化首页可以为用户推荐用户可能感兴趣的信息， 同样开发者也希望能够通过对用户喜好信息的处理为用户提供更有针对性的个性化服务。 举个例子， 比如用户在第一次打开音悦T V 的时候音悦T V 就可以根据用户的喜好特征来为用户播放一个用户可能感兴趣的频道。李笋， 8 0 后， 热爱音乐， 热爱互联

15、网， 关注数字音乐。 曾做过音乐制作人做过个人站长， 目前身份是音悦台产品负责人。 音悦台开发音悦T V音悦电视台， 只播好音乐。7 12 月7 日， 百度应用开放平台正式发布了2011 年度应用大盘点。截止目前， 百度应用开放平台已经审核上线应用超过3 万个， 平均每天的应用使用人次达到数千万。百度应用开放平台作为开发者施展才华、创新突破的最佳平台， 得到了用户和业内的广泛肯定。 感谢 百度开放平台的大开放战略， 继之前成功加入 百度应用 之后， 好豆网凭借最优质、 最全面、最人性化的# 美食菜谱# 数据， 今天又正式加入了“ 百度开放V 计划” （ 即# 百度数据开放平台# ） ， 由此

16、好豆美食网正式全面成 百度开放平台 大开放伙伴成员！ 摘自新浪微博 好豆美食网文章来源：/1770277210/xA1ifqsW8搜索市场是巨大的， 而百度是国内搜索市场占有市场份额最多的搜索引擎， 因此如何满足平台的过亿网民的需求就是一个很大的难题， 而通过平台开放， 为开发者与网民的需求架起一个桥梁。 开发者即提供应用方通过在开放平台提交应用、 添加应用， 经过百度审核后， 提供给用户使用。而收益方面， 百度通过推出应用成长基金、 应用收费、 应用增值服务等多项措施， 以保障开发者即提供应用方的收益。 通过开放平台可以更多的满足网民的需求， 并吸引更多的网民使

17、用百度一系列服务以及更多的开发者参与开发或提供应用， 还可以完善百度自身的不足。摘自 5 1 C T O 青锋鹿 张建飞： 浅谈百度的开放平台文章来源： /art/201112/306940.htm 8“ 促成这一结果的一个重要原因， 是百度在平台开放程度和开发者盈利变现能力上均处于较优的位置。” D C C I 在调查中发现， 有 4 4 . 9 % 的开发者希望得到技术方面的支持， 并有2 5 . 8 % 的开发者对产品如何盈利感到苦恼， 并希望得到资金支持和盈利辅导， 而有 2 1 . 8 % 的开发者则关注用户体验和数据共享。“ 而在这

18、方面， 基于搜索的百度用户群更为精准， 而且用户量大， 应用推广效果好， 应用排名机制也比较成熟和公平， 同时其对开发者的支持也更多， 在用户细分、 变现模式方面都比较成熟， 而且有基金奖励计划等完善的激励措施。”报告同时强调， 随着开放平台的竞争加剧， 最终将会形成以百度应用开放平台为代表的2 - 3 家大型平台， 而其他平台逐渐差异化， 小型平台会垂直化地发展， 应用逐渐细分， 各个不同类型的平台根据自身特性和用户 群特征专注自身差异化优势。 但无论如何， 开放毫无疑问将会成为未来推进W e b A p p 产业发展的核心动力， 因此不同平台之间通过制定完善的商业规则实现跨平台服务， 从而

19、满足不同用户群的各种实际需求， 将对于提升用户体验和降低成本有着重大意义。 摘自C N E T 科技资讯网 开放平台推动产业链盈利模式清晰化文章来源：/2011/1009/2060343.shtml现在, 用户只需在百度搜索框键入“ 心理测试” “ 爱情测试” “ 智商测试” 和“ 性格测试” 等关键词, 便可直接看到来自于有趣网的交互应用, 获得完验。 交互应用下方配有开发方有趣网的L O G O 和简介, 用户亦可直接从这个入口进入到有趣网的官方页面, 了解更多信息和应用。来自百度方面的数据显示, 每天有多达 4 2 0 0 多万人次通过百

20、度应用开放平台进行应用体验, 应用总体验数已超过 3 2 亿人次。 以此为契机, 百度应用开放平台也成为了优质应用与海量用户直接对接的桥梁, 以及促进整个互联网产业繁荣与进步的重要驱动力量。“ 对于有趣网这样的新生创业团队而言, 百度应用开放平台无疑是贯通我们自身应用与网民需求的最佳通道 , 它不但可以最大限度地将我们应用的价值体现出来, 同时还为有趣网带来了足够的品牌和流量, 并加速了最终向价值的转化。” 李璘强调。 摘自 有趣网： 百度应用开放平台是创业者的新机会文章来源：/jjdoudizhuguanwang/20111117/

21、1289.html9 关于软件的体验设计熊子川我们今天谈的是什么？我们今天谈的是关于软件的体验设计。为什么体验设计会成为一个话题？原来我们谈体验设计的时候， 都把它当成产品设计领域中的一个话题， 比如说怎样设计一个好的椅子， 或者一个令人愉快的榨汁机， 但较少在软件领域谈这个问题。 原因是， 当你爱一把椅子的时候， 你会欣赏它和 你的腰线完美贴和， 那这里的交互是更加基于物理世界的感官； 而在软件世界里， 软件更像是另一个平行世界的入口， 这种感官很难和椅子相提并论， 它更加抽象和难以衡量 这也是为什么我们倾向把产品设计当成一种艺术， 而软件设计当成一种科学。 但事情在发生变化 各种移动终端的

22、使用让我们不再需要一台计算机来完成和软件的交互， 发生交互的场景便得复杂多变， 和日常生活融为一体， 同时交互本身充满现实世界的隐喻， 也参杂着前所未有的现实世界的体验： 手指触感或者震动。 这让线上或下的边界便得异常模糊 那个曾经隐藏在 1 和 0 世界里的软件， 开始变成稀松平常之物。 就像当我们每次打开 10手机应用查询好吃的餐馆时， 如果我们开始习惯这样的动作， 而不去多想： 好吧， 让我使用一个手机软件来查询好吃的餐馆； 就像我们要坐下时不会暗忖： 好吧， 让我来坐到这把椅子上。正是因为软件交互越来越深深植入我们的生活而成为一种习惯， 才使得我们对优秀软件的定义除了功能上的完备， 还

23、体现在对人们使用习惯的完美映射， 让人不加思索。这就是我为什么要谈它的原因， 那些被产品设计广泛使用的体验设计实践， 是不是也可以被， 或者应该被软件设计者们所了解， 理解精髓并加以应用， 设计出更优秀的软件产品， 就像那经典木椅的设计师， 不单单考虑木椅是否牢固可靠， 还去通过了解使用者使用的环境， 巧妙设计， 将功能和设计融入使用环境。你的意思是用产品设计的方法去设计软件， 那这和交互设计有什么不同？当我们设计椅子的时候， 我们考虑的不单单是椅背的弧度、 骨架的强度、 是否有把手、 需要什么样的材质、 接口处的契合等等， 一款优异的产品设计更要考虑， 谁在用这把椅子， 他会不会使用这把椅子

24、进行阅读， 他所处的环境是否干燥， 他放置这把椅子的地点在哪里， 他有没有孩子， 他是不是热爱古典音乐， 他是不是有块可以让他覆身小憩的毛毯等等， 这样的碎片， 还原出一个完整的情境， 当消费者体察到产品背后的语言， 并发现这与他的心境如此契合， 这就是一把令人着迷的椅子。而这， 就是交互设计和体验设计的区别 交互设计的目标是一把功能上完全符合标准的椅子， 而体验设计的目标是一把令人依赖的椅子。 我想你一定知道软件的三重境界： U s e f u l- U s a b l e - D e s i r a b l e ， 而当我在谈体验设计时， 我更多关注的是D e s i r a b l e

25、， 而交互设计关注的是前两者 一把很难折断的椅子。我们谈交互设计时好像也在谈这些东西， 比如说目标人群定位， 用户访谈， 原型设计等等， 这个跟你说的体验设计好像类似？11 定有优秀的实践者像对待艺术品一样对待软件设计， 但就大部分从业者而言， 你说的这些东西只是因为做而做， 并没有找到其中关键的核心价值进行串联， 很多时候这只是让客户感觉安全的方法而已， 能反映到设计上的东西， 其实并不多。软件领域里面， 交互设计团队往往和交付团队区分开， 大部分企业也都习惯采取的方式（ A g e n c y M o d e l ） 。前期交互设计团队传递给交付团队的， 是一些P S D 图片、用户访问结

26、果、设计理念文档、原型设计等。这里的问题是， 交付团队得到的只是一份计划好的功能列表。你也知道， 那些看起来很美的P S D 图片是很容易让客户的， 你也可以很容易找到“ 谁也不知道用户要什么， 所以我们给他们多一点， 让他们自己选择” 的借口， 加上软件上线交付时间普遍较长， 上线之后缺少用户， 你也可以说一年前的设计不满足现在的需求， 并不代表一年前的设计是错的。因为这些原因， 我们倾向于臆想用户的需求， 加上一个看起来很美好的外壳， 结果是， 这个市面上有太多质量低下的软件， 盲目堆砌的功能， 模糊的市场定位， 最后伤害的都是那个为“ 看起来很美好” 的客户。所以说， 这和很多人在做的不

27、一样， 这里提的设计方法是关联的， 有共同目标的， 也是接受变化的。到 底 怎 么 个 不 一 样 法 ？ 你 确 定 这 不 是 个 噱 头吗？ 举一个身边的例子， 我们曾经有一个财务领域的客户， 我们并没有像传统方式那样和客户代表进行所谓需求调研会议， 而是花更多的时间融入他们的工作场景， 对他们的工作行为进行观察， 注意， 绝对不是所谓的问卷调查， 事实上， 我们不进行任何的问卷调查。我们发现了几样有意思的事情， 比如他们喜欢把显示器竖起来， 两个显示器拼在一起； 此外他们也喜欢用不同颜色的贴纸标签在厚厚的各种文件夹中设置书签； 他们对电子表格的热爱超乎想象等等。这样的观察应该在不知情的

28、情况下被我们敏锐地察觉， 并展现在软件的设计当中， 比如竖置的显示器代表着他们不喜欢分页， 或者尽可能长的列表； 我们也会收集他们对标签颜色的理解， 尽量设计一套符合他们情境的色彩编码。这就是体验设计与交互设计的根本区别。 体验设计更多地关注情境（ C o n t e x t ） 而非仅仅关注如何使用。 体验设计认为， 只有情境正确才能导致人真正成为用户， 而交互设计中已经做12了一个危险的假设 你会成为我的用户 而往往这种假设不成立。你说的情境指什么？情境是体验设计的核心部分， 因为了解情境才能设计出一个不被人体察、 自然而然的体验（ 好的体验总是在不知不觉中， 只有坏的体验才总是让你抱怨）

29、 。 就像之前说的例子， 如果我们不去细致地观察使用者的行为， 了解他们工作的情境， 便无法设计出一些很巧妙的细节， 让他们觉得“ 我也说不出来有什么道理， 我只是觉得用起来舒服” 。这里的情境分为外在情境和内在情境， 外在情境指的是消费者外在环境的描述， 以及他们以往如何和外在环境进行信息处理（ 软件大部分情况还是信息处理） ； 内在情境指的是消费者内在心理的描述， 包括对他们社会地位、 心智模型的理解。 只有充分了解了二者， 才能充分建造出一个更加真实的环境， 并在其中进行设计。这样的方法类似于刑侦中还原嫌疑人的碎片分析 把关于嫌疑人的各种不相关信息拼凑出来去寻找相互关系来推断其在特定环境

30、下的行为。 也就是说， 我们对消费者的情境还原得越真实， 越能够设计出最符合消费者使用的应用。你曾说过这里面的实践都是关联的？ 那么它是如何成为一个统一的系统的？如果你对设计领域的D e s i g n T h i n k i n g 有所了解， 你会发现， 这种思维框架对于体验设计的影响非常大。D e s i g n T h i n k i n g 的理念可以这样描述： 寻找一个移情（ E m p a t h y ） 的对象， 变成他， 描述他现在的一个完整的相关体验， 找到那些可以让他的体验更好的地方， 寻找灵感， 设计解决方案， 制作原型， 让他测试， 调优和不停修正， 寻找下一个让他体

31、验更好的地方。为了让你更加清楚这个系统的过程， 让我们来假设一个迷你项目， 看看体验设计的方式是如何进行运作的。第一幕： 客户说， 我们是一家高端的白领医疗保健机构， 客户都是对健康有需求的高端白领， 你们能不能帮我们设计一个客户管理系统， 让我们更好的管理我们的客户？说实话， 对付带着解决方案而来的客户， 最简单的办法就是给他的方案进行扩充， 添加各种形容词和新概念， 比如他要“ 客户管理系统” ， 你就可以给他个“ 物联无限 智能贴身客户管理云13 平台” 的标题， 再加个看起来很美好的外壳， 比如流行的i O S 风。当然我们要说的不是这个。第二幕： 在我们提出“ 系统” 二字前， 让我

32、们先了解你们的客户。 然后我们发现， 很多客户都是那些在 3 0 到 3 2 岁之间的职业女性， 为了更好的了解她们， 我们想了很多办法与她们交流， 试图用更加亲切的手段了解她们的故事， 在收集了许多“ 碎片” 之后， 我们可以很容易地去制造出一个丰满的使用者角色（ P e r s o n a ） 。第三幕 ： 我们使用移情的方法， 去想象作为这样一个使用者， 当她对健康方面有诉求的时候， 她会做什么， 如果目标是让自己保持健康， 每天是不是有一个明确的途径（ J o u r n e y ） 去支持她达到这个目标。这就是D e s i g n T h i n k i n g 中说的， 在某个特

33、定J o u r n e y 中寻找可以提升体验的地方。第四幕： 我们发现她们会在网上寻找健康食谱， 特别是那些想在一年里做妈妈的客户， 她们想在这一年里身体方面有一个很好的保护， 却又无法放弃自己的工作， 她们似乎需要更好的专业帮助。这就是通过移情来寻找诉求， 也许这样的诉求需要进行更多的市场调查进行验证， 但这本身是可完成的。第五幕： 我们和客户一起思考， 怎么能够给她们更好的孕前专业营养帮助呢？ 我们设计出不同的解决方案， 比如说： 每日的营养餐推荐， 通过某种形式发送给保姆、 家人或者自己， 帮助自己完成每天的营养摄入人物； 定期身体检查的提醒； 以及合作机构S PA 的优惠推荐等等。

34、这些设计出来的方案都可以变成I T 化的解决方案。 同时我们也帮助客户一起思考未来这个业务模式可以发展到什么程度， 这也是基于这个P e r s o n a 的体验， 当她有了小孩， 我们也可以做针对坐月子的母亲， 以及婴儿的营养建议等进行专业的贴身服务， 这就是体验设计的优势 商业模式的设计来自于消费者体验。第六幕： 根据我们的设计， 由客户挑选出合理的优先级， 请注意， 这里的优先级就比挑选功能优先级清楚明白得多 如果我们问客户： 对于客户管理和短信分发器两种功能那种优先级更高？ 客户的回答往往是两个都重要。 但如果根据体验来排优先级， 这对于客户来说是直观的， 这就是问， 因为功能一和功

35、能二我们会给消费者带来什么体验， 在这些体验中哪些是我们可以得到更多消费者满意度的， 那么对应功能的优先级就会一目了然。接下来我们就可以根据优先级， 进入更细节的原型设计了。第七幕： 我们的原型设计会尽量模拟消费者使用的真实场景， 现有的各种技术已经能够支持完全模拟真实产品交互的原型制作。 与之同时进行的是定期的用户测试， 不停进行调优和再测试， 为的是在更早时候发现设计的问题。 值得提的一点， 如果你采用的是敏捷开发方法， 在第一次原型测试之后， 你的开发工作就已经开始了。14从这整整七幕你可以看到， 从最开始的“ 客户管理系统” ， 到最后完全不同的设计理念， 体验设计的方法绝对不是简单的

36、I T 解决方案设计， 它更包含了对消费者的理解， 进而上升到商业模式设计的高度， 只有可行的技术、 合理的商业模式、 以及优秀的消费者体验三者完美结合， 才是I T 对于商业运营最重要的责任。你说的都很美好， 可是我们的客户把我们当成合作厂商， 我们还要跟那些低价的厂商进行竞争， 为了利益， 我们只能够给客户提出的解决方案加个漂亮的标题和外壳在最短时间里上线， 你这些真是有些高屋建瓴。这就是合作伙伴（ P a r t n e r s h i p ） 和承包商（ V e n d o r ） 的区别。 我知道真正执行必然遇到阻力， 但是了解那些优秀的实践， 并不是一件坏事。 也许这样的实践可以在

37、潜移默化中引导客户开始对消费者进行关注， 与其花很少的钱用一年的时间做一个失败的项目， 为何不花较多的钱做一个成功几率更高的项目。当然这些都需要你我这样的从业者共同努力去营造， 让客户认识到I T 应该是业务最好的伙伴， 而不应该就只是一个无限抽象的商业策略框架（ 我知道什么事情上升到地球层次都是对的） 下的一个小执行层面。也许多了解一些没有坏处？是的， 如果软件行业的每一个人都能够认识到I T 项目的核心在于消费者价值、 商业价值、 以及技术成本的统一， I T 项目的失败率就不会如此之高， 无用特性的比例也会大大降低。 I T 是伙伴， 不是工具， 我们对客户而言也应该是伙伴， 了解多一些

38、也许会让你成为更好的伙伴。熊子川， T h o u g h t W o r k s 咨询师， 他关注商业模式、 体验设计、 以及软件交付， 同时是中国推广敏捷方法的社区参与者。 作为商业分析师一直工作在客户现场， 致力于利用优秀的软件体验设计， 帮助客户实现最大商业价值， 也是多个敏捷咨询项目的直接参与者。 他的博客是： w w w . t u z e i 8 . c o m 。在接下来的若干系列里， 我会向你描述体验设计中的各种实践。15 探索和创新 HTML 5 在豆瓣中的应用豆瓣一向热衷于新技术的探索和创新， 前端团队在HTML 5 与CS S 3 方面也有过很多尝试， 从视觉效果到富媒

39、体内容再到本地存储等等， 其中一部分已经应用于线上产品， 还有一部分以浏览器扩展、客户端、手持设备应用等形式服务于不同需求的用户。 作为处于发展阶段的新一代W e b 开发标准， H T M L 5 正以其简洁的书写规范、 良好的兼容性以及务实的原则为越来越多的网站所接受， 这是W H A T W G 与W 3 C 共同努力的结果， 作为标准的参与制订者， 各浏览器厂商也在积极地为其提供支持。 豆瓣一向热衷于新技术的探索和创新， 前端团队在H T M L 5 与C S S 3 方面也有过很多尝试， 从视觉效果到富媒体内容再到本地存储等等， 其中一部分已经应用于线上产品， 还有一部分以浏览器扩展

40、、 客户端、 手持设备应用等形式服务于不同需求的用户。 下面我就来简单介绍下： 豆瓣目前主要的流量来源依然是P C 端的I E 6 ， 这是个颇具中国特色的无奈事实， 但我们同时发现， 豆瓣的C h r o m e 和F i r e f o x 用户量在不断增长， 特别是C h r o m e ， 目前已超过F i r e f o x 位居第二， 这让我们有了充足的理由在产品中加入 H T M L 5 特性来提升用户体验。劝导用户升级浏览器是个需要耐心的工作， 一般用户并不会因只停留在单方层面的所谓更快、更安全、 更符合标准做出任何反应， 毕竟改变习惯是个痛苦的决定， 引导方式不正确会让用户烦

41、躁， 甚至对标准浏览器 成仇。 那何不换个思路， 先为一部分勇于尝试新鲜事物的用户提供更为友好的视觉、 交互体验， 在他们享用的同时自然会对身边使用过时浏览器的朋友产生一种更为直观的影响。 这虽然没有游戏玩家在比对速度与 3 D 特效后产生为电脑更新换代的念头来得迅猛， 但毕竟是种积极而不唐突的方式。豆瓣确实这么做了。 细心留意可以发现， 在近期的产品 U I 中， 圆角、 阴影、 背景渐变均由C S S 3 来完成， 这也是视觉设计师与前端工程师加深交流的意义所在， 使用C S S 3 来绘制界面节省了大量代码与图片， 从而降低了工作量， 也为公司节省了带宽， 设计师在设计的同时也考虑了在无

42、法识别 C S S 3 的浏览器下元素对应的样式， 让低端浏览器用户感受到另一种简约的风格。 16表 单 验 证 方 面 ， 我 们 优 先 判 断 F o r m 2 . 0 中 新 增 元 素 的 默 认 属 性 ， 比 如 t y p e 、 p l a c e h o l d e r 、 p a t t e r n 、 r e q u i r e d 等， 脚本中对于类型、 验证规则的处理只在不支持这些属性的浏览器中生效， 让高级浏览器用户体会到原生的执行效率。 在读书、 电影条目方面我们也开始加入M i c r o d a t a 来实现强大的语义结构， 让豆瓣不仅能够提供数据， 还

43、能提供数据定义。H S L 是一个全新的色彩空间， 它可以方便地定义色彩的色相、 亮度、 饱和度， 这种定义方式对称于亮与暗， 更类似于人类感觉颜色的方式。 豆瓣小站的风格是用户自定义的， 比如导航栏标签的背景色， 但标签悬停时的颜色是由系统生成的， 生成的规则便是增加当前背景色的饱和度， 使其颜色比默认状态下更深， 这在传统R G B 色彩空间中是不方便做到的。除此之外， 豆瓣还在桌面客户端、 浏览器扩展、 手机应用等方面大量使用了H T M L 5 与C S S 3 特性， 相较于传统开发方式， 这种利用前端技术实现的跨平台跨设备的开发思路有其明显的优势： 学习成本低（ H T M L &

44、 C S S & J S ） 、 开发周期短（ 类似于网站前端开发） 、 代码复用性强（ 除了针对不同设备的接口调用外， 界面、 逻辑部分大多可以复用） ， 这也得益于浏览器厂商、手机厂商对于 H T M L 5 的充分肯定与积极支持。 当然， W e b k i t 这个优质的浏览器引擎功不可没。桌面客户端O n e R i n g 是由豆瓣首席架构师洪强宁开发的一款跨平台桌面应用框架， 它支持使用前端技术开发桌面客户端。 即将发布的豆瓣电台桌面版（ P C / M a c ） 便是基于O n e R i n g 完成的， H T M L 5 新增 的 元 素 与 相 应 的 A P I 在

45、 其 中 发 挥 了 重 要 的 作 用 ， 相 信 很 快 就 会 和 大 家 见 面 。O n e R i n g 项目主页： h t t p : / / c o d e . g o o g l e . c o m / p / o n e r i n g - d e s k t o p /豆瓣电台桌面版（ M a c ） 界面截图17 浏览器扩展D o u b a n P u l s e 是 一 个C h r o m e 浏 览 器 的 豆 瓣 扩 展 ， 它 可 以 让 用 户 随 时 关 注 友 邻 动 态 、参 与 互 动 ， 同 时 收 听 “ 豆 瓣电台 ” 。 整 个 扩 展

46、完 全 基 于 豆 瓣 A PI 并 结 合 H T M L 5 与 C S S 3 特 性完成 ， 除 了 使 用 代 码 绘 制 界 面 ， C S S A n i m a t i o n 完成简单动画、D o u b a n P u l s e 偏好设置页界面截图 元 素 实 现 电 台 外 ， 还 使用了W e b S t o r a g e 与W e b D a t a b a s e 进行持久化本地存储。D o u b a n P u l s e 广播列表界面截图比如利用L o c a l S t o r a g e 来保存登录信息与各种状态， 用以再次开启扩展时迅速恢复关闭前的界

47、面； 之外还用于实时保存用户输入的文字信息， 确保信息不会因网络中断、 浏览器而丢失。 比起C o o k i e ， L o c a l S t o r a g e 的优势显而易见： 存储空间大、 数据不会随请求发送至服务器， 存储空间独立等等， 你还可以利用浏览器原生的 J S O N 支持， 用它来保存结构化对象。D o u b a n P u l s e 的歌曲信息是保存在W e b D a t a b a s e 中的， 虽然这种使用S Q L 语句通过W e b S Q L D a t a b a s e A P I 操作数据的方式在H T M L 5 规范中存在一些争议（ W 3

48、 C 也停止了该文档的维护） ， 但书写S Q L 存储复杂数据的方式还是让前端开发者眼前一亮， C h r o m e 从 4 . 0 开始至今对其有着良好的支持。 18D o u b a n P u l s e 电台已播放曲目列表截图手机应用如今W e b k i t 在智能手机平台大行其道， i O S 中 的 S a f a r i M o b i l e 、 A n d r o i d 的 C h r o m e L i t e 都 是 很 好 的 实 践 者 ， 这 也 为 基 于 H T M L 5 的 w e b a p p 的 开 发 提 供 了 便 利 ， 利 用 一 些

49、诸 如P h o n e G a p 的框架还可以轻松地将w e b a p p 变成n a t i v e a p p 上架A p p S t o r e 。 我也尝试了这种方式并将D o u b a n P u l s e 成功地移植到了i O S 上：19 结束语o u b a n P u l s e i P h o n e 版（ L a b s 产品， 非官方应用） 界面截图当 然 除 此 之 外 还 有 很 多 激 动 人 心 的 H T M L 5 特 性 没 有 提 及 ， 比 如 通 信 方 面 的 W e b S o c k e t s 、 W e b W o r k e r

50、 s 、 桌面提醒 N o t i f i c a t i o n s 以及倍受 L B S 应用青睐的G e o l o c a t i o n 等等， 大家在日常开发中也可以尝试使用， 享受 H T M L 5 为我们带来的惊喜与便利。虽然正式标准预计要 2 0 2 2 年才正式发布， 但目前 H T M L 5 已经被广泛实现， 随着规范的不断完善、浏览器支持度的提高， 其优势也愈加明显， 也许会成为未来 w e b 应用的核心。石岩， 豆瓣前端工程师， 关注网站前端开发、 移动设备应用开发， 他的豆瓣主页： h t t p : / / d o u b a n . c o m / p e

51、 o p l e / m o c k e e专家门诊提问解答 1 关于展现相关 “ 百度应用” 的A P P 应该都是百度内部的应用， 如果我做的a p p 足够好， 有没有可能百度会让自己做的应用下架呢？ 如果你的应用足够好， 可以考虑替代“ 百度应用” 提交的a p p ， 因为“ 百度应用” 本身就是在其它开发者的作品还不能满足用户的需求的时候先来满足用户的体验， 期望其它开发 者能做出更好的应用并取而代之。 “ 如何将自己的应用加到热门应用或推荐列表里面？ 当您的应用受很多用户喜欢并使用次数很高的时候， 会出现在热门应用列表中。 使用次数是以小时为单位来进行统计的， 每小时刷新一次。

52、2 稳定性监控相关 提交应用时总是显示“ 应用监控文件尚未正确部署” ？ 确认在监控加载地址中填写的路径正确并m o n i t o r . h t m l 文件存在， 内容为： 但由于是通过w i n d o w s 下的一些编辑器输入的文字， 导致文件头多了B O M 字符（ 3 个字符） 开发者可以看下自己的文件大小， 正确大小为 1 6 个字节。 20 3 关于B A E 相关 上传的程序有什么要求？ 是否有大小限制？ 版本上传主要是用于应用代码升级， 代码包大小最好不超过 3 0 M ， 不建议把相关资源文件放在代码包里。 资源文件如果是图片， 可以使用的资源管理功能逐个上传， 如果

53、是其它文件， 可以考虑自己实现 程序上传到k v 存储中。 为什么有时引用a p p _ c o n f i g . p h p 会提示找不到文件？ a p p _ c o n f i g . p h p 是每个应用独立的配置文件， 由系统在发布应用时生成， 并放在应用代码的根目录下。 如果不是根目录下的文件引用， 则需要自己计算相对路径。 为什么我连接m y s q l 时只有第一次查询是成功的？ m y s q l 服务被系统设置为短连接模式， 每个连接只能执行一个查询请求。 4 关于审核相关 常见审核不通过的情况？ 如下几个方面： U I 样式及交互问题应用的U I 过于粗糙或交互不流畅

54、。应用界面在平台窗口内不能完整的展示， 或者U I 界面在平台窗口内发生变型， 以及任何不符合U I 规范的。应用的L o g o 或i c o n 不符合U I 规范。I f r a m e 嵌套应用相关问题将整个综合性的网站（ 主页） 嵌套到I f r a m e 中， 比如， 将百度贴吧首页的整个页面作为a p p 提交 。 窗 口 的 横 竖 两 个 边 框 上 都 出 现 滚 动 条 。 未 正 确 实 现 自 定 义 高 度 ， 页 面 中 出 现 大 片 空白。登录问题使用非百度帐号登录加载问题加载缓慢加载过程访问出错加载过程U I 界面严重变形影响应用在网页搜索中排名的因素有哪

55、些？百度应用开放平台是一个面向所有合作伙伴 （ 包括个人开发者 ） 完全开放的平台。 任何接入合作并通过审核的优质应用， 都可以通过百度搜索与用户需求直接对接。 对于优质应用在百度搜索中的排名， 以及同质21 应用资源之间的排序:是以百度搜索的系统算法为基础；结合用户对应用体验的满足感、 需求热度、 增长速度和幅度、 口碑点评、 粉丝数量等综合的欢迎程度和个性化定制（ 用户可收藏喜欢的应用， 并定制到特定的词下展现） ；参考应用本身上线的时间先后、 稳定性、 创新度、 版本级别和优劣、 以及后期更新升级等因素， 最终根据用户输入需求的相关性， 由百度搜索系统计算而产生。总体而言， 用户体验是基础， 越受用户欢迎和好评的应用， 排名排序也就越靠前越稳定。 当然， 对于后上线的新优质应用， 会根据同质或同类应用的相关性给予推荐， 同时结合其上线后的用户体验增速和增幅情况， 由系统自动对其排名排序进行相应的提升。 百度应用允许不允许应用开发者自己投放广告？ 由于不同开发者自行放置的广告在质量上可能会良莠不齐， 且无法保障第三方页面的安全性， 为此我们对应用中的广告和超链会有严格要