中国前沿：2015 Web设计趋势（译）
一个外国从业者对中国Web设计趋势的一些洞察：
快速变化的网络产业和飞速发展的中国总是有很多相似之处：其中一件事就是，你很难把握住它们的脉搏。但是当你把它俩放在一起考虑的时候，你会发现，现在中国的科技产业，变化如此之快以至于保持竞争力的唯一希望就是尽可能的看到更长远一点的未来，并尝试去预测将会发生什么，并提前做好迎接它的准备。
毫无疑问：中国的网络在某些方面和你所熟知的网络是不同的——主要表现在2-3个至关重要的方面——而且用户对网络的期望也是和西方完全不同的。在这篇文章里，我会研究一下所有专业的从业者在进入中国市场之前都应该了解的问题。其中包括手机（只用手机）社交平台是如何革命性的成为了中国网络的新的前沿阵地。以及目前在中国做那些优秀的网站的都是哪些人。
一种新形势
为了能更准确的找到对的方向，我顺便拜访了SaberZou，一个整天在为这个入口工作的人。Saber现在是LogicDesign的创意总监，LogicDesign是一家坐标于北京的交叉学科数码设计实验室，目前正在做亚洲动物基金的创意网站设计Exploring Moonbear，视觉上最雄心勃勃的网站之一，也是赢得Awwwards当日最佳网站奖的屈指可数的中国设计的网站之一。
下图为Saber Zou正在测试Logic Design的官网
“所以，你是怎么看待中国在支持响应式设计方面的进展呢？”
Saber对着我耸了耸肩，就像我问错了问题一样。“在中国没有太多的响应式设计的网站，中国的客户们更喜欢为不同的设备设立单独的站点。至于响应式，我们不用那种方式来构建网站，我们不认为桌面版本的网站是一个母体，或者是手机版网站的增大号版本。实际上，绝大多数的中国公司都完全绕过桌面版的体验了。”
我不知道为什么当所有的证据都摆在我面前的时候我转变我的西方式的观点还花了这么长时间。不过Saber的话确实达到效果了。形势完全转变了：我们来了，以一种侧面包抄的形式带着一种坚定的移动先行的体验来了。但是在中国，手机并不是桌面浏览器爆炸式增长并自我了结生命后的产后，他们是分开的，他们从一开始就是分开的。如今，电脑版本甚至已经退居三线了，成为了一个备选的平台。
移动先行？拜托，中国只有移动版好么？
你肯定一直都有听说，也将继续听它个好几年：中国的手机使用人数简直逆天。早在2010年的时候Nielsen的报告数据就显示“中国同时段使用手机接入互联网的人数已经超过美国”。这个市场只会越来越大。2014年7月的一篇来自NextWeb的文章也加入了大肆报道这种现象的媒体大军。
到2014年6月，使用移动设备接入互联网的中国用户的比例已经达到83.4%，首次超过PC设备的80.9的占比。
“但西方世界每个人都有个智能手机”你会这么想。你也有一个，不是吗？你可能都不知道谁没有，所以对你来说很难想象在一个饱和的状态下继续增长是什么景象，或者中国用户和非中国用户的区别到底具有怎样深刻的含义。是的，尽管这样，我想说的两者的不同不仅仅在于手机用户的数量而已，我想说的是手机对于两者的重要性的不同。几乎没有数据来支持我的这个观点，但是还是有一些明显的证据的，以下提供的是基于我个人经验的一些论据：
1. 在中国，人们的手机号码简直就像美帝人民的社会保险号码一样的重要。如果你丢了你的手机号码，你也就几乎相当于不能进你电商账号、数字钱包、社交网络账号（这些都是直接与手机号绑定的）等等。正是因为这，人们都特别小心的将自己的手机号与身份证号绑定在一起，以防止身份窃贼，同时也方便在SIM卡丢失或被毁之后找回手机号码。
2. 大部分的中国网站用手机号码代替邮箱，来做基本的登录认证和密码找回服务——这跟邮箱服务在中国不是特别普及有关，但在西方国家却很普遍。
下图为淘宝的密码找回流程，淘宝是中国最大使用率最高的网站之一：“请输入手机号/会员名/邮箱”
3. 对于中国的某些数字钱包来说，用户扫描二维码就可以立即支付任何东西，从一个城市的出租车到一顿豪华晚宴再到一场电影，支付是唯一的一个步骤。他们甚至不需要输入密码，就连300元（人民币）以下的支付都不需要身份验证（快捷支付）。情况就是这样，所以丢了手机就跟丢了钱包一样严重。
4. 世界银行的数据显示，到2011年，中国每1000人中有69人拥有机动车辆（汽车，卡车，货车），同时期美国的数据为每768/1000，所以你可以想象有多少没有车的中国人每天乘坐公共交通工具上下班了——这也意味着有大量的时间片段来盯着手机屏幕了，还可以避免看到坐你对面的女孩挖耳屎的尴尬动作XD~
在这样一种极致的依赖手机的文化中，就不难理解为什么那么多的公司很心安理得的抛弃PC，转而创造专为手机而生的用户体验了，即使与之对应的PC端的体验一点都不友好。这种体验有一个名字——“轻应用”——这种方式很快就变成了与用户进行亲密互动的最流行的方式。
轻应用
网站看起来是那么的2010（过时）。2015年，中国的公司们都在建立轻应用。轻应用是一次性的，不需要下载，通常是用HTML5构建的迷你站点定向超链接。噢，当然他们有一个专用的URL，他们也可以在桌面浏览器上使用如果你坚持要那么做的话，不过在桌面屏幕上他们会看起来丑点。有些页面甚至在加载了之后就一点也不能工作了。
轻应用设计出来主要是为了一段时间内的关注度。他们通常是一个单页面，传递一个单一的信息，并且就打算只用一次。换句话说就是，用户打开一个轻应用，然后浏览一下，理想情况下会用手机分享给朋友们，然后就再也不会管它了。
疯狂扩张的轻应用
LiveAPP（微信）是一个中国的公司，擅长应用程序开发，轻应用的数量之广也是它业务面铺的广的一个证明。
下面是对中国轻应用的一个小小的取样。有两个方式可以在你的手机上加载这些轻应用：中国式的是扫一下二维码，然后自动在手机上加载网址；或者非中国式的，直接输入URL地址直接链接。如果你想在桌面浏览器上加载的话，他们可能可以加载出来，但是估计工作不顺畅，或者压根不能工作。我建议你去多尝试几次用桌面浏览器加载定向的URL，感受一下这些轻应用们有多么的无视桌面浏览器的体验。
品牌可能会创建一个轻应用来分享年度财报，例如这个是来自猎豹移动（扫描二维码或直接进入链接）：
下面这个是来自移动制造业大佬小米的招聘需求：
有些轻应用是为了庆祝里程碑，像这个是联想为庆祝30周年而做的：
有些是为了电影提前预热，像下面这个是一个测试小游戏，测试你对中国导演姜文到底有多了解：
有些是为特定的新闻事件而做的，像这个就是网易新闻客户端为回顾2014年的航空灾难所做的轻应用页面：
想要更多的中国轻应用？
要记住，因为轻应用总是倾向于短期使用。所以这些网站的链接将在一段时间内降低，幸运的是，有很多是上涨的。在微信平台上看更多轻应用的案例，或者在社交移动风云榜上看（在手机上体验最好），或者查看这个网站（移动及数字媒体）经常有轻应用的演示。
唤起行动的点是“分享”而不是“购买”
当你看完一个轻应用以后，你通常都只是被“怂恿”进行分享——直接的明显的变现行为是非常少见的。跟西方用户的分享功能不同，中国的轻应用通常都是被限制分享到指定好的某个平台上。中国用户只是被引导在一个网络社区里分享：这个频率在中国的手机网络社区高达83%，但在西方国家网络社区上讨论的频率更高一些。
微信：月活跃用户5亿，引导轻应用革命
从CNNIC（中国互联网络信息中心）的数据得知，中国有5.27亿移动互联网用户，其中4.38亿都在用微信。这几乎是Twitter月活跃用户的两倍。
你可能经常问你的朋友怎么才能更方便的联系到他，email、Google+、Twitter、Facebook或者是SMS，但是在中国，这种社交网络分立的状态不存在，什么是联系你的最好方式，在中国不是个问题。这不是说中国只有一个社交网络，而是尽管有很多其他的平台和选择在那，某个社交平台还是保持绝对的中心地位，就像一张网络大伞，占据了用户们的大部分闲余时间，抓住了这个国家的大部分的用户。
过去的时日，这个社交网络叫腾讯QQ。然后是新浪微博（中国Twitter）
“但是微博”Saber说，“已经成为了一个人们去阅读新闻和被动消费信息的地方了，他已经不像以前那么流行了。”
在今天的中国，最当红的社交网络是腾讯的WeChat，中国人习惯称之为微信。微信自2011年推出，是一个只能用于手机的社交网络，微信的功能有发短信（声音和文字），群聊，一个跟Facebook一样的时间线的动态（叫做“朋友圈”），陌生人交友（微信的“附近”功能列出了所有距离上理你很近的人）和一大堆表情。那些对web设计和开发最感兴趣的那群人，微信也有一个本地的浏览器，甚至为开发者们提供了API接口。
Du HaiHang，他的英文名是Seah，是一名数码创意设计师和开发者，他主要致力于品牌建设和先进的互动体验，也是Activation Nodeplus的首席设计师。Activation Nodeplus是一家总部在上海的前沿的设计工作室。就像Saber一样，Seah致力于创造性的实验，他也是唯一一个获得两届独特Awwwards奖的人。做为广受赞誉的本地及国际设计专家，Seah就是那个创造性的大脑，对来自中国的最具创意的工作保持高度的敏锐和响应。
下图是Du Haihang最近接受FWA采访的信息。
3-4年以前，品牌都花费大量预算在Flash做的网站上，但今天不是了，现在他们的预算都转移到微信上了。这个转变在Flash消亡和iPhone开始盛行的时候就开始了，web的设计也自然而然就跟随者这个趋势了。如果你的站点在微信上看起来很糟糕，那它就根本没有市场价值。
轻应用和微信
微信是这么的火爆，以至于轻应用们都几乎只为了微信内置的浏览器而做体验优化，在这些轻应用的界面上唯一的行动指令也是“分享到朋友圈”。
“我看过太多的手机开发者不得不为了各种各样的浏览器做测试的苦逼文章”，微信专家Thomas Graziani说，北京社会营销公司的创始人，据我所知是第一家为入华外企提供一站式量身定制微信解决方案的公司。“在中国，我们只需要在微信浏览器上测试我们的轻应用，如果能正常工作，接下来就容易了。这就是通用平台。”
虽然腾讯只为微信的管理平台提供中文的界面，但Thomas的团队已经为非中文的市场打开了金大门，他们建立了一个多语言的账号管理界面（目前只支持中文和英文，但不久会增加）可以直接和微信的API对接。Thomas这么说：
公司们对这种专门经营建设微信上的体验很开心，因为他们这样能得来比其他平台多得多的用户数据。当一个用户从他的微信浏览器访问了你的站点，你就看到了他的微信ID，如果他在温馨上关注你了，你就能看到关于他的7点信息了：微信ID、昵称、头像、地点、基础语言、性别，以及他们从何时开始关注你的。这就使得企业可以做精准营销了，特别是基于性别和地理变量。最值得一提的是，“微信注册”支持HTML5游戏开发商为用用户的昵称和头像为他们定制体验。
无处在的二维码
二维码：10分钟热度，然后就会开始消亡？有些地方可能吧，但是对于中国数码来说，二维码就是小罗伯特·唐尼：他们最开始是有些站不稳脚跟，但现在他们从可口可乐上走下来了，并且活的很好。印刷品上到处可见他们的身影，桌面站点和电视广告上也经常出现，用户可以直接用他们的智能手机扫描二维码，像这个轻应用一样（Seah设计的游戏）。
下图：扫描二维码探索圣诞卡片的游戏。
扫描桌面屏幕可能听起来有些奇怪，但在中国这是个再正常不过的行为了。重申一遍，因为微信在中国太普遍了，一般的二维码都链接到一个微信公众账号，这样你可以直接关注；或者链接进一个轻应用，这样直接用微信内置浏览器打开。二维码提供了一个广泛的微信入口，所以可以存在于纸媒、印刷广告、商业卡片和站点的页脚等。
很难不过分强调微信在中国二维码崛起中的作用。微信一开始就内置了一个二维码扫描的功能，而且二维码可以借扫描的功能跟微信发生各种各样的互动——连接到轻应用，用户账号，直接用内置浏览器打开网页，支付系统使用户可以直接通过微信钱包互相转钱，还有无穷无尽的其他的应用。广告们再也不用展示复杂的URL地址了——直接简单的放上二维码供用户扫描，直接就可以登录公司网页了。
需要给页面来一些装饰？
下图：淘宝网页顶部的二维码“手机逛淘宝”
下图：一个中国设计社区的网站，二维码直接对应到他们的微信公众号
下图：桌面版的支付宝，中国的Paypal，总共有5个二维码，一个是在登录界面，其他是在四个滚动的宣传图里。
下图是中国最大的保险公司，平安，有两个二维码：一个是手机站点，一个是微博账号。
下图是中国海油的二维码，在页面底部
要列举这些我们可以花上一整天。
将这些都整合在一起：二维码—微信—轻应用造就的就餐体验
在一家叫“很久以前只是家串店”的很受欢迎的BBQ餐厅里（一家混搭原始人装饰风格和电子摇滚装饰风格为一体的餐厅），最开始，用餐者在下单之前会被要求扫描菜单上的二维码并关注本店的微信公众账号。随后服务生会要求看就餐者的会员卡，这个会员卡是在关注了本店的公众号之后发到手机的。会员卡可以让就餐者立即在餐后享受一定的折扣，当他们一买单，马上就会从微信上收到一份详细的收据。如果需要等位很长时间，也有其他的APP来管理等位列表：顾客来餐厅时只要扫一下二维码，然后就可以先四处逛逛了，当有位子的时候，轻应用会给他们的微信发一个提醒消息的。Thomas解释说：
微信公众服务号每月向追随者推送的消息的数量是有限制的，如果一个追随者主动跟这个公众号在过去的48小时内互动，服务号会立即发送一条服务消息给这个追随着。随着微信钱包的开通，用户也可以通过钱包立即给公众号付钱了。
下图为很久以前在我离开后发给我的账单副本：
下图是我的微信会员卡（很久以前）
所有这些并不是说电脑已经完全过时了，我相信中国的桌面网站会有他独特的价值，桌面网站会用那块大屏幕通过一些独特的功能和独特的美赢利。
中国的网页排版依旧很前沿
在超越四个基础字体和运用更美观的字体@font-face上的困难把中国网页的美化进程给慢慢的拖累了。当你看到到处都活跃着这么性感的中文博客大标题的时候，你会觉得依赖这么有限的范围来做选择简直是一种可怕的耻辱。你可以读这篇文章my blah-blahs on this，如果你想看完全一点的版本的话，但是中文字体最基本的问题是体积太大了，包括成千上万字符（大概20000个字和符号）的文件包，一般都3M-7M大小，这很难嵌入到页面中去，因为加载速度会被明显的拖慢。所以，直到最近中文字体系还很憋屈，就像西方文字一直都很傲视群雄一样。
随着“有字库”（台湾网站）的出现，一种动态中文字体的解决方案诞生了。有字库提取字体的轮廓信息然后将它发送给服务器或本地的脚本，然后渲染它们并返回结果。
我有幸参与了有字库的系统的实验测试，还是挺好用的，用鼠标选择非标准的中文字体就像用手触摸一架全新的轻型巡航舰一样。这项技术目前还是很新的，下面是我遇到的三个障碍：
1. 细线中文字体渲染的效果不是很好，在chrome里看起来很难看，如果是特细的字体的话，甚至连边缘线都残缺不全。对于粗一些的字体来说就没有这个问题（至少是以我的经验来说），对Firefox浏览器来说也不是什么问题，不过这仍是一个值得修复的缺憾。
下图是通过有字库渲染的字体在Chrome中的情形：
2. 经常在加载页面和加载字体间有点延迟，所以你会看到页面像个口吃一样先吐出内容，然后加载渲染字体。
3. 有字库目前只有中文版，比如在安装说明页面，另一个竞争对手Justfont把他的字库展示页面和注册说明页面设置为英文了，不过它的字库选择范围就不如有字库了。
“为了保险起见，特殊字体我们还是使用的PNG图片”Saber说。“我们对于可以在网页上使用多种字体还是很兴奋的，但是目前来说，像有字库这样的使用字体的方式还是处在实验阶段的。
Seah也同意这种说法。“大家都知道，中文字体包含了海量的文字，所以很难把他们嵌到网页里。在我们这，我们用图片或者SVG文件来处理静态文字，但是动态文字我们还是用的标准字体。
一些漂亮的桌面网站
ACNPL\WGL
Seah为Activation Nodeplus创建的将实时在线图形技术融合在一起的平台，这个网站赢得了Awwward奖。
这个公司成立于2012年早期，是Welson Tu建立的，他是一个台湾数字营销先锋...经过了两年的高速发展，在2014年5月被Activation集团收购，作为了自己的数字部门。
我三年前主要是做互动设计和Flash开发，那时候我就想开始做一些关于实时图形技术的前沿的试验，HTML5画布和WebGL在当时是国际级别的，互动设计水平远超同期的中国。Welson当时很感兴趣也很支持这个想法，而且他的公司也给我提供了一个完全自由的空间去追求它。所以，我辞掉了我之前在一家创新机构的工作，然后2013年初同他成为了搭档，我的工作重心也从Flash脚本转移到新的web技术上来。我们的合作就是这么开始和继续的：我设计，开发和实验所有我感兴趣的东西，同
SIXPENCE
当Seah准备好向他心爱的妻子求婚的时候，他为她开发了一个只能由她来打开的定制化建议的iPhone app。当她的服装设计公司准备好向他敞开大门的时候，Seah就把他全部的精力都投入到为她开发和设计一个完全具备竞赛水平的网站上去了。
这是为我老婆的公司设计的网站。六便士（他老婆公司的名称）的两个创始人想要让这个网站带上一种有态度的标签。他们手工制作的限量版的服装只通过预定来购买，所以，这个网站的就要传递出品牌的这种独立的态度，提供给客户一种独特、现代和与众不同的浏览体验。在构建网站的时候没有一个明确的商业目标。
有时候我会觉得在中国做这种前沿一些的工作很难，因为很多用户依然在用比较旧的技术，你必须在失去部分用户和花很多时间为比较老的浏览器做向下适配的版本之间做出选择。很多客户不愿意支持这样的实验性工作。
EXPLORING MOONBEAR（月熊志）
这是一个美丽的网站，有着美丽的目标。两个目标：月熊志是为亚洲动物基金会创建的网站，提高人们对于月熊胆汁产业（熊胆汁被用于中药）的残忍性的认识。这个网站也是个制作精巧的游戏规则变革者，这个网站是在IE 11的能力范围内进行设计的。Saber分享了其中的一些过程：
IE实际上是将编码的部门交给了另一家公司，然后给他们设定时间点。那家公司名字是Vision Soar。我们也想到了一个点子，我们自己来做所有的架构、内容、设计和原型的部分，然后编码的部门交给他们。
我们的视觉灵感是来自于我们在成都 AAF救护中心的一段经历之后。我们拍了很多照片，因为我的目标之一就是在网站上建立一个3D元素，我们做了很多的视觉风格调研，在当时，低多边形的风格很受欢迎，所以我们就借鉴了一些这种设计元素。在开始做实际的设计之前，我们通常都会创建一个情绪板，情绪板上收集了各种不同类型的视觉风格，然后我们总结出一个设计方向出来。我们会收集屏幕截图，在网上浏览，或者直接出去拍照。
建立3D熊模型是我们面对的最大的技术困难。我们需要创建一个栩栩如生的，并且可以互动的熊。而且，需要在所有支持WebGL（是一种3D绘图标准）的主流的浏览器上都能表现的很好。最后我们用了3个JS和Unity文件。在工作的过程中，和各种各样的利益相关者的交流沟通是我们面临的最大的挑战。
WORDS CAN BE WEAPONS（语言也可以是武器）
奥美为沈阳亚洲心理学研究中心设计的网站，语言也可以是武器是想让人们直观的了解到伤人的语言对孩子的心理造成的伤害。将滥用言语和青少年犯罪率的上升直接关联起来。网站的设计直观的展示了粗鲁伤人的语言将会转化为枪炮、刀剑、和其他暴力器械。更多的信息点击这里查看。
30ML
这是一个为中国创意机构30ml设计的网站，获得了FWA（全称Favourite Website Awards，是一个世界著名的互动多媒体网站收录平台，于2000年5月建立，目的是展示世界上最优秀、最前沿的网络媒体艺术设计作品。）的奖项。
ADIDAS ORIGINALS
Adidas Originals网站是一个证明，在如今，中国设计工作室为国际品牌做了大量的优秀的设计。
DASHILAR（大栅栏）
G_Lab为北京大栅栏片儿区的复兴而创立了这个网站。这是一个合作的项目，政府、设计师、建筑师、投资者、居民共同努力想要给这片快要消亡的历史街区一个新的生命。
总结
我为一些想进入中国市场的外国公司做一些UI方面的咨询工作，我发现我最近总在说一件事情：想做中国的本地化，不仅仅意味着将你的网站中文化。这听起来似乎很残酷，但这是我要给你的建议：要做就做正确的中国本地化，要不就不做。如果你做个半成品，很明显的，你不仅会损失钱还是损失信誉。了解你要服务的对象，了解他们是如何使用Web的，然后打开他们期待的交流的通道（微信、轻应用、二维码），这样更容易跟你的用户之间建立有意义的交流。
所以，伙计们，我们学到了什么？
1. 轻应用是中国Web的新前沿阵地。
2. 如果你的网站不能再微信内置浏览器很好的显示的话，那说明你跟中国市场还八竿子打不着呢。
3. 二维码在中国广泛使用。
4. 中国的网络字体技术才刚刚起步。
