大家难免偶尔去医院，当你焦躁地在医院排队时候心情会如何？你会做些什么？
低头刷万年不变，有着鸡汤、创业、微商、国家、压力大、优惠券、天气好，天气坏各种标签的朋友圈、微博，戳一戳手机桌面各种新闻、日报、阅读器等 App 刷一刷看过一会就会忘的东西。但是看任何内容，都很可能会让你在「医院排队」这个场景下让你心生不快，加重焦躁，但你还是会点开一个个 App 看，你的手，和你的潜意识早已经有这个习惯了。相比手机时代以前的人们，我们真是对生命很有效率地在使用，不错过一切碎片时间。
今天我就拿 Google Play 报亭这款信息阅读器来做一下设计分析。
本来我初期写这篇的时候切入点会更大，因为我们使用这些信息阅读器 App 的背后其实是设计之外、另一套关于人的东西，比如碎片信息带给每个人偶尔的思考，为什么我们要进行这些行为？即使我们会在碎片时间外花费某段完整的时间，用方法论去系统学习一些东西。即使是用年龄和生命健康交换而来的专业工作技能，我们也还是忘记很多东西。惯性所形成的习惯，就一定是好事么？就着这个方向去想，发现探究的更多是人性和社会学等科学的东西，太大了，又犯了老毛病。还有点跑题，所以我还是让自己跑回来，用设计分析研究的套路做一下分享咯。精力有限，这次讲的是 Android 版。
容我把设计分析套路小改一下，先讲气质风格
Google Play 报亭这款 App 是 Google 旗下的 Play 品牌的子品牌。关于 Play 品牌下面会讲。先从 Google 开始。现在讲起 Google 出品的 App 避不开说他们的设计。自从苹果这十年以来逐渐代领全球人民注意设计，另一个巨头也从 2011 年开始转变了方向，提供更多拥有设计分量的东西给人们。所以容我把设计分析的老套路改一下，先讲一点 Google 的气质风格。
Android, 2010.5_v2.1 — 2011.11_v4
大家都知道多年前 Google 产品或者说他的主要代表作 Android 都是感觉很机械的东西，或者另一个角度说他很极客，单从视觉看让人望而却步。
Pixel 第一代手机
但又比如说新的 Pixel 手机让大多数人觉得 Google 自己做起来硬件设计也是顶尖的，Google 已经没有了以前给人的纯极客的刻板印象。现在是又酷又炫好看好用。因为在 2011 年 Material Design 诞生了，而且 Google 也不仅仅做软件了。
Google 品牌下的产品设计也已经不断吸引着用户。先出现于 iOS 的 Google Design 系列产品如 Gmail 在当时显得尤其交互优秀、动画抓睛，界面养眼。那么 Google 怎么做到的？
一切，都始于 2011 年 Larry Page 重掌 Google 大权后立马启动对 Google 旗下所有东西的重设计。但 Larry 只是给了手下授权，现在我们看到统一性很高的 Google Design 产品都来自内部各个部门团队的协作配合。他们并没有一个像苹果的 Jony Ive 的设计管理者来控制 Google 这次的统一性和重设计。
不过所有参与到这个项目的所有人，不止设计师，为了推动项目都会向他人讲：“我们做这些是因为 Larry 要这些。”老板让把设计做到飞起来。接着所有的做产品的，做设计的，做开发的，都花时间把自己的专业度发挥出来。顺水顺路。
BOOM
Google 开始不断推出让人刮目相看的产品，走上了设计的不归路。包括 2014 年 Material Design 这款设计语言出世，Google 已经出品了很多优秀的 App。另外一面是 Material Design 还想要架起越来越多设备之间的桥梁。虽然现在应该说主要联结起来了 Google 在 iOS Android Web 各种设备上产品的一致性。不过从别的方面看，起码现在已经做到的对 Android 的组件规范，方便提升了设计师与开发者的效率。
下面是一个 2015 年 Google 评选出的遵循 Material Design 语言的 Android 优秀 App Showcase 视频。
MD 设计应用 - by Elad Izak
说回 Material Design 本身。它的特性大家耳朵都差不多也听烂了。是使用了适当的拟物融入扁平化设计，将现实世界的部分隐喻利用到互动设备上，使用数字手段将之虚拟化、形象化，让用户凭直觉自然操作。官方说得也很明白，就是让你在电子屏幕上模拟使用纸墨的触觉。具体上，就是借鉴了webOS 的多卡片操作并给予纸感的阴影。还有代表自然感觉的动画反馈、场景交互。Google 设计语言在卡片之外鼓励人们文字排版大胆一些，用多一些空白去创造层级，大张图片强调视觉吸引。
同时 Material Design 有各种尺寸屏幕适配性设计的规范，想要影响启发不同设备的开发者。开发者语言规范的书写也同时影响启发了不止 Android 还有 iOS，Web 多端的开发者也多多去注重设计、重视用户体验。
接下来我们讲 Google Play 这个品牌。
Google & Play & Store
Google Play 源于官方 Android App 商店，后来加入了影视，书籍，音乐服务，就是 Google 想要分发流媒体市场的一个在线超市，大家都很熟悉苹果商店，功能差不多。产品定位为泛娱乐平台, Logo 便一直使用播放按钮的三角轮廓，也就是 Play 一词，所以其全名为 Google Play. 组成 Google Play Logo 的四色源于 Google 主 Logo 四色的更高纯度演变。颜色对比强烈显眼，好像犀利地像在说，快看我快看我，显现 Google 设计语言的大胆——是吧？更现代——对吧？和硅谷范儿——行吧？
Google Play Family
Google Play 品牌下五大子品牌也以三角轮廓作底，每个产品再选取最合适自身定位的图形和颜色，颜色也是四色的，也大胆的使用了高纯度色。主品牌对子品牌进行轮廓限制，这也是常见的品牌一致化设计的一种模式。
Play 子品牌的几个 icon 遵循了 Material Design 设计语言的样式，没有完全扁平，还有微弱的投影样式存在。另外每个子品牌看起来像是几个 icon 被收进了 Play 这个三角轮廓的里面，代表是从属于 Play 这个品牌的。这也是 Material Design 的模拟现实特性的一个小显现，比喻影视、音乐、游戏、书、报亭被我收在 Play 商店了，你可以从三角形的袋子里面掏出来使用这 5 个功能。
Google icon 的理想 prototype 过程
这是 Google 设计师做 icon 的理想 prototype 过程。先做纸样模型，再打光看阴影，再上机还原。他们的主产品 icon 都是这么设计而来的。
Google 设计师做 prototype 的过程
复习一下 Google 家族
设计分析套路，现在开始。
战略层 Strategy
个性化的新闻阅读器
官方定位是一款“个性化的新闻阅读器”，可让你在一个 App 集中浏览你所关注的网络主题、新闻媒体和杂志。想要方便普通用户一站式解决这些需求，而且通过使用让用户对这款 App 带来的 Google 风格的视觉设计、交互操作、反馈动画、时下最怀深的 Google 的大数据机器学习进行感受。
往下深挖一下，在信息阅读器的背后，是用户对信息资讯的汲汲可求。当代人类为了让自己跟上时代，花费时间、消耗视力老想把资讯往多了看，总是希望自己能处在时代的前端，这种渴望处在前沿的心理意识叠加，可以给予人们多一份的稳定安全感，甚至给自己加持一种达到一定程度之后，可以突破自我的潜意识暗示。再者，学习工作这类需要专门空出时间和精力去做的事情之外，人们获得了更多碎片时间可以打发，于是人们将之用来接收快讯，了解新事物新观念，查阅他人观点。平常不爱说话的最开心，我多看看手机就能给我挡一挡不喜欢的交际；平常爱说话的更开心，可以扯淡的话题随便看一看就一大把。当代人真是对生命很有效率地在使用。
范围层 Scope
Google 报亭主打的产品功能有六个——首页“简报&为你推荐”、“内容库”、“发现更多”、“稍后阅读”、“搜索”、“离线下载”。
简报&为你推荐
简报如其名，主要是在首屏最上方放置最新的几篇重要性文章供你快速翻看。
为你推荐范围就大了，依托了 Google 的海量资源和信息挖掘，根据你内容库里的信息源标签，帮你广泛聚合资讯文章，再加上你在 Google 产品的所有历史记录帮你扩展你的兴趣点相关文章，能出现让你翻不完的信息流。
内容库
内容库的作用就是，在这页把你的所有信息源标签展示一下。
这一页还有个“摘要”的子功能，用每个卡片帮你汇总同一个媒体、网站等主题标签的全部近期文章。
发现更多页
发现页，让你去添加更多信息源，首先会有推荐的主题或媒体、杂志等。其次你也可以搜索，按照搜索结果选定的标签成为主题。不过遗憾的是, Google 虽然作为宇宙最大的搜索网络，这里没有为你定制它自己的标签库之外的的主题标签。
如题，很实用的必备功能。
如题，很实用的必备功能
搜索功能
搜索功能贯穿以上四大功能，都可到达。All hail google search, no comments.
离线下载
「内容库」里的已添加信息源卡片标签都可以离线下载，方便随时查看。
结构层 & 框架层 Structure & Skeleton
这张图在这个屏幕分辨率我自己也看不清楚，不过我都画了，就给大家看一眼，表示我爱过画过，然后我们继续吧。核心视觉形式就是内容卡片和主题标签展示页。
启动页
启动页是一款 App 的第一印象。首次打开 报亭 App 的 Onboarding 页使用了不可操作的预览动画，文案动画让用户快速了解此 App 功能，以及注意到 4 大底部导航栏。
固定搜索栏
每个底部 tab 页都有顶部的固定搜索栏。这个写在 Material Design 设计语言规范的搜索栏激活后停留在本页，而不是另开一页。这种设计相比市面上常见的点击搜索后，另开一页全屏进行下一步的具体搜索，更会给人一种嗖地快速的感觉。加上 Google 的动画做得很细腻，用户会有较爽的操作感。
课后作业
参考意见如下——首页的顶部是简报，简报会抓取你的信息流里的多张大图滚动播放，从而达到简单的看图读信息的目的。第二，搜索栏下面、滚动图上方会有一条简单问候和天气信息，天气可以展开、查看五天的最高温和最低温；这一点上延续了人们看报纸、新闻版头要有天气这一习惯。
视频中，可看到红圈演示：大图右下角区域有个控制「每日简报推送」的通知按钮，很实用。提到这么靠前的位置，用户体验上是绝对加分的，因为虽然用户可以通过手机系统等手段禁止 App 的推送通知，但 Google 报亭还要额外在放这个位置放个开关，是一种尊重用户的态度。
首页的内容卡片主要由标题文字、来源渠道、配图、为什么会有这条消息的标签（比如是这条热门新闻所以推荐你或者你关注了「设计」这个主题；另外还有顺序分别为稍后阅读、分享、偏好设置的三个 glyph 图标。
表现层 Surface
动画上
动画演示视频
这款 App 的动画完全遵循了自家 Material Design 的设计语言规范定义：基于真实人们生活，模拟一种自然的人机互动触感，希望达到自然、有用、快速、目的清晰。
比如搜索栏左边按钮的汉堡菜单激活后变化为返回箭头；触摸区域的波纹阴影反馈。
还有最右边视频：点击主题宫格打开正文的分区域展开主题页面的圆润曲线运动；往下滑动时 nav bar 隐藏、往上滑动时又出现等等。
Palette 色彩方面
颜色方面，发现这款 App 没有用自家 Material Design 里色板的推荐色值。这一点有点让人惊讶，又去找了他们的别的产品看了看，也是同样没用。看来规范在硅谷也只是指导性意见，不强制必须使用呀。
主色紫色除了用在高亮某些小东西，比如文字、滚动条、4 大 tab 的图标点亮颜色；主要用在了「发现页」里的官方分类区域，紫色作为「精选 Featured」顶部底色，以及其他官方分类的默认背景色。
彩色出现在「内容库」的主题标签背景上，还有作为「精选 Featured」的其他官方分类里的标签背景。每一个主题被 Google 服务器抓取到贴上标签之后指定了随机的颜色。
核心内文的排版
正文样式主要靠抓取原网页格式，还有自己精选、合作的一些英文主流媒体会重新钦定同一个排版样式。官方钦定的英文排版长上面这样。
钦定之外，就要看各信息来源自己的造化了。还好现在大多数信息源都有移动界面，不过由于没有被 Google 重新排版，相比 Google 钦定的排版，五花八门的排版样式会让用户——尤其是中文和中英双语使用者，感受比较碎片化。因为中文媒体里很多界面排版不仅不好看，下面的广告还很难看：什么日本美女、足球宝贝、炸裂表情图等。英文媒体倒是大多都被钦定了看起来还好。因为 Google 报亭是一款多语种国际化 app，这些问题除了在纯英文环境下使用会一直存在。这也是一昧把自家 App 作成全球化带来的甜蜜烦恼吧。
图片的使用
作为一款新闻阅读器，自然会有大量的图片。首页顶部图、信息源的展示页图都会抓取本栏目下内容里的多图滚动播放。不过 Google 的机器抓取在这一处也不是万能的，有时候会图片出错，适配失调，实在是有些碍眼。
另外注意右侧视频里的图，已读之后图片会变灰。
小惊喜
有个小惊喜，这种做法现在也在不少 App 有看到了。底部导航栏某一项被激活时候会有按压效果，包括图标和文字。很细微，有点按压纸张的意思。
空白页设计
空白页设计里的 icon 中规中矩，十分系统默认。给 Google 个台阶下：这样可以让用户不用花费多少成本识别图标什么意思赶紧地了解当前不可用状态元音，以换关键词搜索、去解决网络情况等。
因为嵌入了 Chromium，所以在加载文章网页失败，会另有 Chromium 附带的「恐龙快跑」彩蛋。无聊断网打一下游戏呗。
又一个小惊喜
还有个不是很明显的小惊喜：内容库里的宫格动画，移动展现形式有点意思。拖拽宫格移动，宫格会模拟现实重力和摩擦力找到定位点，等你松手确定位置。不等你确定，所有宫格除了你拖拽那个，都会往前或往后挪一个位置、重新排序（左侧图）。
点击功能按钮移动（就是三个点那个图标，移至顶部或移至底部，如果你的「内容库」超过一页的显示范围，在一页范围内的移动还是按照堆积占位的顺序排列；但移去超出一页的范围之外，就会是渐出的动画效果（中间图）。
这个细节设计在我看来还真不错。
其他
Web 版 Play 报亭
还有个算是大屏幕阅读爱好者的福音，有 iPad、Web 版，其实也就是 App 的响应式设计款。跨平台也是 Material Design 本来的宗旨之一，去除隔阂，让用户可以获得在各种设备上几乎完全一致的体验。
当然也有 iOS 版，不过相较 Android 版会有部分区别，这次就不提了。
贴心小设置
另外设置里面还有个小亮点，可以把常规卡片样式切换到迷你卡片样式，使一般卡片的上方满幅大图换成简报模样的小图。这就看个人喜好啦。
总结
最后，有请 Google 设计总裁进行总结。
真的总结
好了，讲正经。Google Play 报亭这款 App，借力于 Google 设计团队，又基于自家已成型的 Material Design 设计语言。虽然 Google 系的出彩动画在此没有特别发挥，不过作为一款阅读器 App，如果除去文字方面的东西多了也会过于吸引用户注意，让用户阅览文章的核心目的失焦。所以做得中规中矩也不是不合适的。
再来英文的新闻和重新钦定排版是做到位了，但其他支持语言并没有做到位，因此会显得这个 App 是为了天下大同而做国际化的意思，太政治正确，很硅谷。
另外也是希望 Google 设计师们能够跳脱出自己的语言规范吧。即使设计语言已经确立，推广影响设计界开发者界是一回事，不受其框架束缚在自家出品的 App 上做新的尝试也不是那么容易。作为外人评判说他们应当跳着脚链跳舞也是太刻薄。
最后的远望：设计本就是分析研究，作为一门综合性很高的行业，它也不应该一条路走到黑，仍处于建设 设计主义 现代化的我们还在为之添砖加瓦，但有生之年我想，随着时代科技的发展，它会越来越发达，也会越来越理性化。现在的设计都还只是被束缚在设备界面上，依然处于人们将现实世界投射到电脑、手机屏幕的过程，仍然主要是靠外在的形式和感性的感觉，并同时『尽力』挖掘内在的需求，把现实世界虚拟投射到屏幕的阶段。设计终将越来越贴近功能，将会越来越少用资源、精力去做表现和形式上的东西。也许现在我们在做的事情终将被机器书写所代替，但我相信足够的积累依然会指引你，去达成某项的专精。
Thanks to:
作为符号的设计 (上篇): 无形的未来, 2017-01-08, iD 公社
如何做一份视觉竞品分析, 2016-08-18, Praise, 点融设计中心DDC
10 Guidelines For Using Material Design Wisely, 2016-06-13, Alan Smith, USABILITYGEEK
Redesigning Google: how Larry Page engineered a beautiful revolution, 2013-01-24, Dieter Bohn and Ellis Hamburger, THE VERGE
Evolving the Google Identity, 2015-09-01Alex Cook, Jonathan Jarvis & Jonathan Lee, GOOGLE DESIGN
如何从视觉设计师的角度做竞品分析？2017-02-16, 高山垚, 知乎回答
What is your review of Material Design? 2016-06-22, Vlad Dmitriev, QUORA ANSWER
What are the disadvantages of Material Design? 2015-07-25, tohster, UxSE
Material Design Tags, Android Authority
为了促进与粉丝的交流学习，大家可以向DDC约稿啦~有什么感兴趣的主题，都可以给后台发消息留言，我们会挑选出有代表性或前瞻性的主题进行研究并且讨论或撰文发稿。期待大家的留言(๑•̀ㅂ•́)و✧
注：
DDC
隶属于点融技术部—点融黑帮，
点融黑帮微信DIANRONGMAFIA
