Material Design in Action — 猿题库

猿题库是一款免费的手机做题软件,在中学学生中拥有一定的人气。

猿题库很早之前就发布了 Android 版本的客户端,但猿题库的联合创始人,郭常圳先生,并不认同 Android Design (或者现在的 Material Design),而且认为应用程序的设计规范,应当由开发商来决定。

然而当我试用猿题库的时候发现,这个应用对其进行 Material Design 的适配,其实并不困难。因此就有了对其进行重新设计的念头。

由于郭先生对 Android / Material Design 以及对跨平台应用遵守规范的误解,我会在展示作品之前,先简单说一说我心目中的跨平台应用应该是如何设计的。

跨平台应用应该怎么做?

现今,绝大部分的移动互联网应用,都会选择开发双平台(iOS 和 Android)或多平台的跨平台客户端。

iOS 的情况比较简单,因为绝大多数公司都会遵循 iOS 的设计规范,很少出现把别的平台的设计风格“搬”到 iOS 上的情况。然而 Android 就要复杂得多了。

Android 在 4.0 之前是没有一个统一标准的规范的,默认控件也比较丑陋,于是开发商们就“怎么方便怎么来”,基本上都把 iOS 风格的控件和交互直接照搬到 Android 上。

情况在 4.0 之后有了改观,Google 为 Android 打造了更加美观的 Holo Theme ,并且提出了 Android Design 规范,从此 Android 应用的设计风格开始进入了新的时代。

然而现在的 Android 应用并没有呈现出“大一统”的状态,而是一个“分水岭”的状态。一边是大部分国外的公司和开发者的应用,经过几个 Android 版本的迭代之后,绝大部分已经遵循了 Android Design,同时有些应用已经开始遵循 Material Design 以期在最新的 Android 5.0 Lollipop 中拥有更好的表现;另一边是大部分国内公司和开发者的应用,纵使 Android Design 已经推出了多年,他们仍然视而不见,继续使用 iOS 的那一套设计风格。

这其中也有一些例外,微信在 5.2 版本中做了一个不太好的尝试,开始试图让微信遵循 Android Design 规范。但这次尝试十分短暂,在受到了用户的批评后,他们马上在 5.4 版本里换回了 iOS 风格。

因此,有人提出,用户不需要跨平台应用针对不同平台做不同的设计。这个观点是对的吗?个人认为,不对。

虽然使用 iOS 风格的设计在 Android 上“又不是不能用”,但如果你想为自己的应用从观感,使用体验等各个层次来一个全面的提升,还是应该试着去遵守平台的规范。

更不用说 Material Design 在 Android 5.0 上提供了非同寻常的使用体验,极具个性的动画效果,能为应用带来优秀的视觉享受。

Weibos

微博官方客户端(iOS 风格)和 Blacklight 微博客户端(Material Design 风格)在 Android 5.0 上运行效果的对比

所以,用户需要,有必要,有权利在不同的平台上用上遵循规范设计,体验更好的应用。

我看跨平台应用——“求同 存异”

前面提到了,微信曾经在 5.2 版本里短暂地尝试了一下 Android Design ,结果在 5.4 中,又被用户“骂回去”了。

微信这么做对吗?当然不对。新事物总是需要学习的,微信应该做的是在下一个版本当中对 5.3 的风格继续改进,而不是当缩头乌龟。

微信 5.2 的设计为什么会被用户骂?很简单,UI 大改,用户自然需要学习,而之前的 iOS 版本设计风格的 UI 和新的 Android Design UI 之间,几乎毫无瓜葛,用户一时摸不着头脑,于是就开始骂娘了。

这是 Android Design 的错吗?当然不是!事实上,微信在 iOS 和 Android 上的设计,都只能算是非常一般而已。在 5.2 版本上的所谓 Android Design 风格还十分简陋,都有很大的提升空间。

最主要的是,微信在不同平台上的设计,割裂感太大了。

Android and iOS

What the f…?

如上图所示,iOS 版本和 Android 版本(5.3)的微信,简直可以说是两个应用。如果用户从 iOS 版本切换到 Android 上,肯定会产生不适应感,而这是优秀的跨平台应用不应该做的。

在我看来,优秀的跨平台应用必然共有一个特征——求同存异。

以下是一些优秀的跨平台应用(图片来自 NovaDNG):

between 2

Duolingo 3

Instapaper 2

RB1

 

从上面的应用展示中,大家可以看出这些应用让用户能明确体验到应用在不同平台间的差别,又不至于产生不适应感,学习成本也较小。同时,在界面设计上都遵循了相应的平台规范。

这,就是“求同存异”的内涵。用户在使用这些应用的时候,没有那种硬生生的割裂感,只需要很短的时间就能适应在新平台上的操作。

所以,所谓“分裂”其实只是因为应用自己做得不够好,而不是平台规范的错。同样,如果应用做得足够好,用户也不需要太久时间就能适应新的平台设计。

Talk is cheap,show me the…

OK.

其实在我试用猿题库的时候就发现了一个事实——这款应用看上去一副 iOS 样,其实交互上已经很接近 Android Design 了,最典型的就是那个 Drawer 。

所以我觉得猿题库是款很可惜的 App ,明明只要付出一点点努力,就可以在 Android 平台上变得更好…

于是我自己动手制作了一套猿题库重新设计的效果图,仅供参考。这只是一种尝试,我相信,肯定还会有其他比我更好的实现方法,关键是肯不肯做。

1.登录画面

vs1

状态栏和导航栏都进行了 Translucent 化,为的是更有冲击力的第一观感(好像听上去和 Nova 差不多…)。稍微更改了一下 Logo 和按钮的布局,原来的按钮样式被换成了 Boarderless Button.

这里偷个懒,直接放上新用户的引导界面,省去登录界面了。

2.引导界面

vs3

vs2
…到了这里,大家应该明白我前面“可惜”的意味了吧?我只是做了很小的改动(换成标准的 App Bar 和控件,列表改成标准的两栏布局,去掉了那个箭头,仅此而已),整个界面就已经很 “Materialized” 了…所以我这里改动不多。接下来就是主界面了。

3.主界面

vs4

原版上方的概览画面面简直就是硬伤,排版在我看来非常混乱。所以在这次重设计中,我试着用卡片的方式承载这部分内容,同时把内容尽量规整地向中间靠拢。至于底部的 List ,我更新了样式,原来的”+”图标改成了现在的”Expand More”图标,写题的图标也做了小许改进。

vs4.1

Drawer 在原版就已经出现了,于是我只对 Drawer 样式做了修改,使其更贴近 Material Design 的 Drawer 样式。

vs4.2

原来右上方的“更多”按钮被我更换成了“More”,新页面展示也变成了 Drop Down Menu.

4.写题界面

vs5

这个界面可以说改动也很大。首先是 App Bar 上的 Actions 都去了他们该去的位置(计时器的字体也做了修改,并且加粗处理)。至于底部的 Drawer (暂时找不出更好的方式描述这个模块),我把原来的拖动区域整合到了 Drawer 里,以使整个界面看上去更加简洁。选题界面的标题,内容和按钮位置也进行了微调。

vs5.5

练习报告界面。还是之前在主界面那里的问题。排版混乱。于是我按照之前主界面的思路,重新排了版,将原来底部的按钮换成了 Flat buttons.

写在最后

相信大家都发现了,我重制的界面其实不多,一部分原因是我懒(,另一部分原因是,这个应用需要做的绝大部分都是控件的修改和细节上的优化,因此不需要大幅度地推翻重建,只需要完成一两个模块做为演示,我相信就能带来一定的启发。

除此之外,猿题库还有一些问题需要改进,例如去掉 Splash Screen 等等。但不可否认的是,这款应用对中学生来说,帮助是很大的。希望开发团队能够认真考虑一下,拿出一个更好的 Android 版本。

写在最后的最后

这是我第一次对 Android 应用做较为系统的界面重制,在这里要再再再再次感谢 NovaDNG ,没有他的影响,我现在也不会往 Designer 的方向发展。

祝大家在 2015 年一切顺利~

「数据? 那是什么? 能吃么? 好吃么?」

在近一年前, 腾讯终于扭扭捏捏地把微信改成了靠近 Android Design 的样子. 虽然外表有那么点儿 Android Design 的味道, 但设计却十分糟烂, 被无数用户吐槽. 结果到了八月, 微信又把 UI 改回了 iOS 风格.

我 100% 不认为腾讯因为 5.2 被用户唾骂而放弃 Android Design 是什么明智的决定, 与其因为碰了一次钉子就认为 “Android Design 不符合用户的使用习惯”, 不如好好研究 Android Design, 在遵循规范的前提下把微信做得更好.

很多人拿后台数据说话, 我就解释一下数据好了. 数据不是真理, 数据也可以被轻易的操作. 就拿这次微信来做例子:

对比对象一方是使用了很久 (从 Android 2.X 时代起微信就一直是 iOS 风格 UI), 成熟 (就算是在 iOS 上微信的 UI 也很难说是优秀, 所以这里用成熟) 且用户习惯 (如前述, 微信老用户都习惯了这套) 的 iOS-Like UI;

另一方是新推送的 (新年前才推送更新), 设计糟烂 (和 Android Design 貌合神离, 只是套了个皮, 完全没能体现对 Android Design 理解且存在大量违背 Android Design 设计之处) 且没有任何引导(一个全新设计拿到用户手中居然没有给任何的事先说明和引导教程) 的 Android Deisgn;

对比的结果可以说是显而易见的.

若 Android Design 一方同样是使用了很久, 设计经过深思熟虑且尽可能完全符合 Android Design (在这里姑且不谈超越) 且做出了合适的引导与教程, 你觉得数据会是什么样子的呢?

另外, 关于 “用户不知道也不会在意 Android Design” 这样的论点: 用户完全没必要知道什么规范, 用户当然也喜欢用脚投票, 而这并不妨碍开发方在这个规范的框架中做出优秀趁手的产品. 在微信这个事件上, “用户用脚投票选择 iOS UI” 这个现象只能说明 “微信的 Android Design 做得很烂“, 而不能说明 “Android Design 不适合微信”.

产品经理也当然没必要满嘴 Android Design 或者 Action Overflow, 但是如果他们不知道如何用好 Android Design 或者 Action Overflow, 就是他们的失职.

用户体验为王 —— Android 设计师 Taylor Ling 访谈

ling

这篇文章译自 Squirrel Park 的文章 User Experience is King, 作者是 +NINO RAPIN, 由于我已经很久没翻译过文章了, 英文能力过关的同学可以直接去看原文~ 对了, Taylor 也是我的朋友~

Taylor Ling 是一位不懈倡导优质 UI 与 UX 设计的设计师. 在 Android 界他以自己那专注于另应用变得清晰与易用的 “(re)design” 活动而闻名. 同样的, 他也经常被邀请参加世界各地的大会并作出宣讲.

Taylor 的博客 androiduiux.com 可以说是 Android 界最富饶的设计资源聚集地和灵感发源地. 而在 Google+ 上, 他也经常分享一些关于设计的洞见与实战, 以及各种关于 UI, UX 的资源. 当然, 最近他分享得更多的是关于新的 Material Design.

我们与 Taylor 聊了很多, 比如用户体验设计, Android Design 的未来, 如何在你的领域中做到最好以及数字设计师的责任, 以下文段中粗体代表原文作者, 正文是 Taylor 的回复.

 

在几个星期之前您被 Google 正式授予 Google 专业开发者 (GDE) 的称号, 恭喜~ 对于您来说, GDE 的角色和职责是怎样的呢? 

这和我一直以来在做的事情没什么区别: 分享一些小技巧, 与社区里的成员们互动, 帮助大家解决设计上的问题. 我经常与想要接触 Android Design 或想要为 Android 做设计的设计师们交谈, 我努力让大家意识到设计师是如何帮助开发者解决一些超出他们能力范围的设计问题的. 所以称为 GDE 其实没什么差别, 至少是对我来说.

对我来说, 成为 GDE 之后最大的目标便是努力弥合开发者与设计师之间的鸿沟.

填平这道鸿沟是个非常艰巨的任务, 因为大部分时间设计师虽然能做出很漂亮的设计稿, 但是开发者却完全不明白应该如何实现出这些东西. 主要的问题就是开发者们弄不清楚为什么我们设计师要做这样的设计. 故此作为一个 GDE, 我们可以插入到设计师与开发者之间, 对设计师说: “嘿, 除了做出那些花里胡哨的设计之外, 你需要让开发者弄清楚为什么要把东西做成你想象的这样, 为什么这对用户交互来说是非常重要的, 为什么这个图标是有意义的. 你不能随便用另一个图标去表示这个操作, 因为… ” 如此这般, 等等.

我经常看到很多从有着不同设计背景的人转到移动设计这一领域来, 他们有的曾是工业设计师, 平面设计师或者出版设计师. 当然, 我的意思是, 移动设计领域正在不断成长. 但是在很多情况下, 他们之前的经历给他们的移动应用设计带来了一系列问题. 他们并不知道移动设计的基础, 也不清楚开发者们是如何把他们的设计转变成一行行代码的. 而且更致命的是, 他们中的很多人对于移动应用的设计规范没有任何概念. 所以我们一直试图在博客文章中, 在大会宣讲中, 以及其他很多地方传播这样的理念: 请做出些开发者能够理解的并使用的设计来. 我经常听到开发者说: “设计师给我发了一份设计稿, 但是他却从来不会干切图这码子事儿, 所以我不得不亲自动手切不同分辨率下用到的素材.” 所以我们不断努力分享自己的知识, 经验以及遇到的问题, 希望能够帮开发者们分忧.

三年前我们的目标还是创建一个社区. 现在我们已经有了一个, 虽然没大到那种程度, 但是已经初具规模了. 我们可以从社区里学到很多东西. 于是 GDE 就作为了更加正式的信息获取途径, 通过这些信息来缩小开发者与设计师之间的鸿沟.

设计师与开发者不应该处于敌对立场, 而应该是占有 —— 他们密不可分. 只有他们紧密的合作, 才有可能创造出最好的东西.

您一直倾注心血于 UI 与 UX 设计上. 最近, UX 这个词变得愈加火热, 反而迷失了它真正含义, 所有人都想称为 UX 设计师, 仅仅因为它很酷很潮. 于是, 作为一个在 UX 领域浸淫多年的前辈, 您是如何定义 UX 的呢? 

唔, 这个问题真是一如既往的难应付啊. 大家对于这个问题应该都有不同的答案. 很多人都认同用户体验是个很重要的东西, 但是它又是无形的, 难以捕捉. 这不是我们可以看到的东西, 它存在于完成的产品中.

当一个应用的用户体验很糟糕的时候我们会知道这东西的用户体验很糟糕, 但是通常情况下我们很难意识到好的用户体验.

没错. 当我们谈论用户体验的时候, 通常都是拿差劲的用户体验开涮的. 但很少有人会记住好的那些用户体验, 因为在优秀用户体验这样的前提下, 用户们都满意的达成了他们的目的. 如果用户体验很差劲的话, 你会一辈子记恨并且到处宣扬 “妈呀这东西太 <beep ——> 难用了!”

当然, 从定义的角度来说, 用户体验就是用户的体验. 但是如果你要说 UX 设计的精髓到底是什么, 我会说: 它意味着将一种态度贯穿于整个产品甚至公司中. 做到与用户感同身受, 了解用户的体验等于明确了你的产品能达到多高的境界. 虽然这并不意味着你的产品会仅仅因为用户的喜爱而获得成功, 但这至少是成功的第一步.

UX 是一套理念, 一种态度, 而它与产品的每个部分都是相同的: 交互, 界面, 样品. 产品的每一个部分都在优秀的用户体验中扮演着重要的角色.

我有一个朋友是一名 UX 意见领袖, 他走遍了整个国家 (译注: 马来西亚) 来宣传 UX 的重要性. 他甚至去求职网站寻找所有和 UX 设计相关的工作, 然后他接受了各种面试 —— 出于研究的目的. 他想要知道这些公司到底请不清楚他们想要招聘到什么人. 也许在西方国家的情况会好一些, 但是在这个国家 (译注: 马来西亚), 他发现 95% 以上的公司都找错了人. 这些公司在寻找一匹独角兽: 一个既能码代码, 又能做设计, 又能干其他杂七杂八事情的人. 这个有趣的小实验也告诉我们, 推进 UX 这件大业还需要很多的努力. 如果你想让你的产品有良好的用户体验, 可不是随便雇一个人就能自动让你的产品变好并且让用户爱上这么简单的.

您是怎么意识到自己想要从事 UI 与 UX 设计的呢? 您的职业道路是如何诞生的? 

很多人都对我的生物工程学背景感到吃惊. 我很爱生物工程学. 生物工程是个解剖学与工程学交叉的可爱学科, 但是在我们国家却很难找到实验室以外和它相关的工作. 而我又不想一直耗在实验室里. 这太无聊了. 于是我开始寻思自己还能做什么. 我一直以来就对设计很感兴趣, 在上大学之前我就很喜欢画画, 而且还得了一些小奖. 设计和艺术大概是流动于我的血管中的. 我热爱艺术.

我的第一份工作是功能分析师, 这个工作的性质是帮助产品经理将他们的需求翻译成更低级别的需求集合, 以便于开发者们能知道该干什么. 但是, 当然的, 团队里是没有设计师的. 所以我必须自己做设计, 设定布局, 做所有的事情. 当时我还没有意识到有一天我可以靠干这个赚钱.

直到三年前我开始看博客. 我发现了 Juhani Lehtimäki 的博客 (译著: Juhani 的博客已经很久没更新了…), 他在博客里谈了很多和 Android Design 的东西. 我想, “哟, 有好多人都在谈论移动界面设计啊, 有意思~” 那个时候我对于移动界面设计也没什么清晰的概念, 因为 Juhani 也是一个开发者, 而我又没什么技术背景, 所以我也不是很确定这在这方面有没有我可以做的事情.

那个时候我拿到了我的第一台 Android 手机, Sony Ericsson Xperia X8 (NovaDNG: 索尼大法好!) 它的屏幕非常小. 我很认真的研究了它, 并且被这么个小小的东西上能做到那么多我先前想都没想过的事情惊到了. 那时候仍然是 Gingerbread 的时代, 有那么一些应用是经过设计的, 但是应用之间基本没有什么一致性. 在那个时间, 第二代 iPhone 发布了, 我问了自己一个问题: 为什么高质量的应用通常只会在 iPhone 上出现? iPhone 很贵. 我不觉得我必须要花很贵的价格在设备上才能买到高质量的数字体验. 为什么我不能在 Android 上得到优秀的数字体验呢?

于是我花了更多的功夫琢磨 Android, 然后从本地运营商那里买到了一台 Nexus S —— 那个时候已经进入了 Ice Cream Sandwich 的时代了. 为此我万分激动并且做了我人生中的一个 Photoshop Android UI Design Kit. 在那之后, 我便决定开一个关于 Android Design 的博客. 时间是 2012 年六月 —— 我写了一篇关于侧边抽屉和导航的文章. 那就是我写下的第一篇博客. 那是一个新的起点.

一开始的时候, 我只是打算和大家分享一些东西.

您得到了回复么? 

有啊. 大家的回复很积极, 于是我便意识到, “对呀, 这就是我一直以来想要做的事情!” 于是我便买了 androiduiux.com 这个域名, 很 Android 吧哈哈~ 这个域名也无时无刻不在提醒我, 专注于纯粹的 Android 上.

于是不断有反馈出现, 人们积极的讨论, 我很高兴. 对我来说其中有两个人尤其重要: Juhani 和 Roman Nurik. 他们给予我灵感, 让我明白了如果有什么观点或者意见, 不要畏于分享它们. 于是我便开始更深地钻研和设计相关的东西. 在开博一年后, 人们开始找上门问我能不能帮他们做重设计. 我从来没有计划过这些东西, 但是一眨眼的功夫我就变成了一个自由设计师.

但是 Juhani Lehtimäki 和 Roman Nurik 两位都离您千里之遥, 对么? 我的意思是, 你们只在网上有联系, 但是在吉隆坡有一位帮助与引导您的导师存在么? 

是啊, 网络的力量是强大的~ 关于导师 —— 不存在这么个人. 我是自学的. 我的 Photoshop 技能基本是自创的, 通过试错, 和一些简单的教程. 没人教我怎么用 Photoshop. 我一向认为我能一个人做到这些事情, 而我确实能够做到, 尽管可能会花上稍多的时间, 但自己学来的技能确实能起到更长的效果. 你会学到如何习得新技能. 当我还没电脑的时候, 我会从杂志中学习我需要的技能. 我的第一台电脑是一台英特尔 CPU 的 Windows 95 电脑, 从那时起我就明白了电脑的强大.

其实我对自己也是有点儿小骄傲的啦, 因为, 你也知道, 这并不容易呢.

当然, 很多地方都有设计课, 或者关于人机交互的课, 但是他们总是要花上四年 —— 而有时候, 当你和那些授课教师谈话的话死后, 你会想, “开什么玩笑, 我们社区比你厉害多了!” 因为他们的知识都是理论化而成熟的, 而我, 则更多是在实践中学习, 从真实的反馈中学习. 这样一来我能在使用电子产品的时候产生实感. 而你会一辈子记住从实践中学到的东西.

另外一个对我产生绝大影响的就是阅读 The Design of Everyday Things. 这本书彻底改变了我的思考方式. 它让我意识到一件我们很少理解的事: 当我们不能操作一台机器或者设备的时候, 错的是设计师, 而不是我们.

但是我依然坚信如果你有着足够的热情, 并且想要做好一件事情, 就一定能自己做到. 这也是我从开始之初就明白, 而且一直坚持到现在的信念.

谈完了过去, 让我们谈谈现在和将来. Google 刚刚在今年的 I/O 大会上介绍了新的 Material Design 规约. 你觉得这只是个潮流, 还是它就是 Android 的未来? Android Design 将何去何从? 

有一件事情是 Material Design 很明显地改变了的, 那就是平台一致性. 但我确实对此抱有疑问, 毕竟举个例子, iPad 的体验比起 iPhone 而言是很独特的. 所以我的疑问是, 用户真的希望所有设备上的体验都统一呢, 还是体验一些独特之处呢? 不过我还是决定乘风起航, 赶上 Material Design 的浪潮, 因为 Material Design 实在是太棒了, 是经过深思熟虑的.

对我来说, 毫无疑问它就是未来. 但是它给我一种就像两年前 Holo 刚刚被介绍的时候一样的感觉. 在早期, 每个人都只是机械地模仿规约里提到的东西. 这导致了很多应用缺乏变化与创新. 如果你有关心现在圈子里正在发生的事情, 你会看到很多人在依照 Material Deisgn 重设计 Instagram 或者 Facebook. 但是他们中没有一个是独特的, 或者从中展现了变化. 他们仅仅是把颜色和内容换掉, 然后把便称之为重设计. 虽然这并不是什么坏事, 毕竟这样能让更多人意识到 Material Design 的优美指出, 但是我依然觉得几个月后我们恐怕会看到大量长得和 Google 应用一模一样的应用出现. 人们依然在探索中, 他们还没有掌握明确的思路. 我们会看到一大波圆形头像和 Floating Action Button 到处乱飘. 这很正常, 但是我们必须再一次跳出这个框架.

Menu---Back-Arrow

我认为用户依然需要独特的桌面, 平板和手机体验. 我明白 Google 想要达成一致而且我也赞成这个理念 —— 总体而言. 但是我不能赞成必须为此牺牲独特性.

总的来说 Material Design 的出场是惊艳的. 我觉得很开心, 因为你可以感受到这是专为数字世界而创造的.

Material Design 将一些现实生活中的东西带回了数字世界, 这让用户在与数字产品交互时不需要思考太多, 而这通常是长期体验中特别重要的一环.

这也描绘了拟物与拟真的概念区别: 它并不是简单的把现实中的东西挪到数字世界, 而是一种传递与变化. 

我认为纸墨概念的选择对于很多人来说也许会造成困惑. 因为它们在现实世界中都有一些显著的特性: 纸可以折叠, 墨是液体并且可以流动, 等等. 所以开发者们和设计师们开始问这样的问题: “如果它是纸, 那为什么我不能折叠它?” 如果你没有认真读过规范的话确实是会为此感到困惑, 但是他们终将意识到, 数字世界有它独特的约束. Material Design 正是这些将人文带入数字世界中, 故此我喜欢它.

iOS 的界面是冰冷的. Material Design 专注于那些用户真正会察觉到的东西并且以更少的处理让用户们意识到它们.

这些事非常有人情味儿. 我想起了当我在伦敦的时候, 我去了一趟不列颠博物馆, 观赏了一场关于古埃及的展览. 这场展览令我震惊. 4000 年以前, 他们就已经有了详尽的网格系统, 图形设计, 与奇妙的用色, 简直令人疯狂.

作为一个设计师, 您的工作是具有高度创造性的. 您的点子都是从哪儿来的呢? 

哈哈哈, 能召唤点子的仪式是不存在的. 实际上, 我试图从周围的一切获取点子 —— 大自然, 人, 风光. 当然还有人与人之间的交流. 有意思的是, 我喜欢观察窃听 —— 咳咳, 或者说观察人类比较妥当吧. 我不仅经常在人多的地方转悠, 我也喜欢听人们在谈论些什么, 他们被什么打动了, 他们为什么而担忧… 我喜欢聆听这些对话. 似乎这些行为让我将用户牢牢至于设计中心.

我知道您对字体有着很浓厚的兴趣. 您怎么看这次 Roboto 的改版? 

挺好的呀~ 当我看到它的时候就觉得很熟悉, 也许是因为 Roboto 是由结合了一些广为人知的字体而设计的吧. 而且它的跨平台通用性非常高. 我发现一些细微的改变产生了巨大的影响, 改善了易读性. 它看起来焕然一新, 但又仍然是你熟悉的那个 Roboto. 现在它终于给人以家的感觉了.

roboto

 

是呀, 我也很喜欢新的 Roboto. 唯一让我感到有些无奈的是他们在 2.0 版本里去掉了 K 和 R 的原本很有特色的弯曲字臂. 不过也罢. 对了, 您有打算重印那套 T-恤么/? 

没有. 过去的就让它过去吧.

您有买什么可穿戴设备吗? 比如智能手表或者 Google Glass? 您为这些可穿戴设备做设计么? 您怎么看这些东西? 

当然我有的~ 在我拥有一副 Google Glass 以前我就开始为 Google Glass 做设计了, 我遵循着设计规范设计了两个 Glass 应用. 当 Google Glass 发布的时候, 就有客户上门问我能不能把他们的应用为 Glass 做适配, 或者或者说在 Glass 上玩出点儿花样来. 最后我得出的结论就是, 字体排版太重要了, 这些可穿戴设备都充满文字.

我自己有一块从今年 I/O 大会上带回来的 LG G Watch, 不过目前为止我都没有为它设计过任何东西. 显而易见的是, 很多人已经开始跑偏了. 他们想要把一台手机放进智能手表里. 他们把键盘这种及其需要繁琐操作的东西放进了智能手表里, 而这显然 Google 不建议的.

有一件事情倒是很确定, 我认为那些可穿戴式设备有着改变我们对设计看法的潜力.

Taylor Ling 的日常是什么样的? 

(笑) 我就是个普通的正常人啦. 起床以后我先看看新闻以免错过什么在我睡觉时发生的大事. 我用 Feedly 和 Google Newsstand, 当然也会去 Twtter 和 Google+ 这样的社交网络了来获取最新信息. 当我到公司之后我会检查我的任务清单, 然后与团队做交流. 接下来就是每日例行的研究, 各种玩应用, 在 Photoshop 里画设计图, 等等. 就像个普通的应用开发者那样.

等我回家之后, 我就开始做一些自由设计师的活计. 当然这些活儿看起来好像和在公司的时候没什么差别就是了… 我每天都过得相当充实, 我相信有付出就会有收获.

平时您都用什么工具进行工作呢? 

老实说, 只有 Photoshop. Photoshop 对我而言是一个无比强大的工具. 你不仅能轻松的做出小样, 也可以做出完成度更高的设计稿, 甚至还能做简单的动画. 噢对了我也用 Sketch, 不过很少. 目前为止还没什么工具能胜过 Photoshop.

尤其是在 Material Design 时代, 我们更多的关注反馈, 动画以及各种会移动的东西, 藉此增强用户体验, 所以对于设计师来说熟知如何画出能够开发者所期待看到的的图是非常重要的. 有的时候我也会用 PowerPoint 和 Keynote 来做设计.

我喜欢您的 Android Design 挑战. 是什麽促使您举办这样的挑战的? 

这已经是我第二次举办这样的活动了, 不过我的目的是一样的: 传播 Android Design, 给人们带来启发, 向他们展示 “原来应用可以设计成这样啊”. 我博客的副标题就是 “开发者与设计师的灵感源泉”. 这就是我的目标. 很多时候, 如果你给人们一些激励, 他们就会开始做一些他们从未想过的事情.

作为一个设计师, 你会希望因自己的作品而出名. 所以我早就预料到这次活动会引起大家的注意. 我和社区里的朋友们 —— 比如 Juhani 和 Günther Beyer —— 聊了这种活动的可行性. 他们也为这活动出了很多力.

android-design-challenge-2-0

我对今年的参赛作品很满意. 比起第一年的时候, 这轮活动获得了更多的投稿, 当然质量也更高了. 这个活动正在变得越来越成熟, 更多的人开始做令人惊叹的设计, 这是喜闻乐见的.

我为第一轮比赛出了钱, 当然对我来说是值得的, 毕竟设计师们在自己的设计上花了很多心血. 不过在第二轮比赛里我从一些人那里获得了赞助.

而为什么我要这么做呢? 我觉得我是一个喜欢群居的人, 我相信当你付出更多, 别人就会回报更多. 而我也确实从社区里得到了很多, 所以我也尽量为他们做更多的事情.

您的家人和朋友支持您么? 他们理解您么? 

我双亲还不是很清楚我到底在做些什么, 尽管我试过和他们解释… 但尽管他们不知道我在做什么, 他们非常支持我. 有意思的是他们无法相信我去了伦敦和突尼斯做设计宣讲. 当然我也并不指望他们相信就是了~ 🙂

您幸福么? 您对未来有什么打算? 

幸福? 哈哈当然咯. 简直不能更幸福了~ 我的意思是, 我正在做我喜欢的事儿, 而且因此交了很多我觉得不太可能遇到的朋友, 也得到了多得无法想象的东西. 我当然会继续我现在的努力 —— 成为优秀设计的布道者, 推广正确的东西. 我会走得更远, 做得更多.

您有什么忠告能给那些想要追随您的足迹的人呢? 

锻炼你的眼睛. 适当地吹毛求疵, 对自己做的事情抱有热忱. 如果你热衷于生活与工作, 一切都会顺利的.

团队成员的 Android 实用美观小工具推荐(不定期更新)

作为一个 Android 用户, 手机上自然是少不了一些能够快速实用的小应用和小工具. 由于他们太小了以至于我们觉得单独为它们分别开篇文章是略有点浪费了, 但是不推荐又觉得忽略了这么个优秀的应用心里过意不去. 于是就有了这个小集合. (其实是为了防止有人说我最好的东西都不推荐, 藏私货什么的我会乱说?) 觉得图太小的中键点图开大图.

Continue reading

Android UI 设计工具 (Photoshop, Android 4.4, Nexus 4)

作为一个 Android UI 设计师, 手上没有一套趁手的工具的话, 画 UI/UE 示意图就是一件很痛苦的事情. 很幸运的是到目前为止, Google+ 上的 +Taylor Ling 大神都在无偿的为大家提供一套 Android UI 设计工具. 目前这套工具已经更新到了 Android 4.4, Nexus 5 版本.

Nexus 4 作为我最喜欢的 Android 设备, 我的所有设计图都是以他为模板完成的. Taylor Ling 曾经为他出过一套 Android 4.3 设计模板, 但是在 Android 4.4 时就停止更新了. 于是我把 Nexus 5 的设计模板移植到了 Nexus 4 上, 做了一套 Nexus 4 Android 4.4 的设计模板.

Nexus 4 Portrait with Building Blocks preview 2_framed Nexus 4 Portrait with Building Blocks welcome_framed

Nexus 4 Portrait with Building Blocks preview 2_framed Nexus 4 Portrait with Building Blocks preview 3_framed

这套设计工具里基本包含了所有 Android 目前为止常用和不常用的控件, 让你能够随心所欲得心应手的做出符合你预期的效果图.

Screenshot (159)

百度网盘链接: Android 4.4 Design UI Kit (Nexus 4 version) 链接里除了 PSD 文件之外还包含最新的 Android Design 色版 (.aco) 与各种开源库的地址 (.pdf).

大力感谢 +Taylor Ling 与他的 UI Design Kit, 如果没有他的努力, 是不会有这套 Nexus 4 设计工具出现的.

乖巧美观,千里即达——论微信的基本修养

喜总是猝不及防,在农历春节来临之际,微信突然更新了 5.2 For Android 版本,虽然自从 2013 年四月左右便传出了腾讯内部正在开发 Android Design 版本微信的消息,不过能够在新年来临之前便放出更新,着实是令我有些吃惊,也许是想借着过年这个使用微信的高峰期推动用户习惯全新的 UI?(个人主观臆测请勿听信)

Screenshot_2014-01-27-02-31-53_mh1390807969246_framed

当然,伴随着应用 UI 的大手术,其官方新浪微博下如同当年 iOS7 正式推送更新时一样,涌现出多种奇葩方向的评论,详见 NovaDNG 君的文章 。作为喜爱并持续在生活中普及 Android Design 的我来说,对于本次微信的更新真真算得上是望穿秋水,终于盼来了耄煮媳拔璐俊救命恩人。不过我对于普通用户的评论并不关心,正如龚叔博客中所说,只要 微信 /QQ 上的重要人际关系不变,用户们的适应能力一向是如同伴随着生物进化的的某种昆虫一样,强大无比。所以作为从 2011 年年初便开始使用微信的资深用户,正想趁着气氛还算热乎,说说对于新版微信的看法Judgement

 

Pros:

1. 快速稳定

作为一款通讯工具,发出去的消息可以保证接收方可以快速稳定地接收,是评判一款即时通讯工具好与坏最重要的条件之一。微信能够成为我与身边的人日常最常用的通讯工具,腾讯强大的集群服务器功不可没,土豪就是有钱 。从 2011 年年初微信在 Symbian 与 iOS 平台没有 Android 发布开始,除了某次服务器被一铲子搞挂,这三年的个人使用中微信还从未出现过丢失消息的状况,加之消息发送时消息左侧的 loading 提示,以及消息发送失败时左侧的红色叹号标识,都是从使用者视角直觉式判断消息发送成功与否的细节,相比 iOS7 内 iMessage 的浅色调向深色调的渐变效果,个人依然偏爱微信直截了当的提示方式。

2. 乖巧美观

在几乎所有 App 尤其是渣浪微博都在拼命增加功能入口以增加流量的今天,微信却是表现的难得的 “乖巧”与 “美观”:

a. 启动后首页无冗余元素:功能的增加大多存在于二级页面中,不会影响一级页面的简洁;

b. 附加于通讯之外的功能可以取消:个人非常不喜微信的“摇一摇”、“漂流瓶”、“腾讯新闻中心”等功能,以上功能皆可以在设置中取消;

2014-01-27-06.34.27_framed 2014-01-27-06.56.49_framed 

c. UI 符合 Android Design:新版的设计中启用的 Action Bar 以及 Tab Host 控件,并采用滑动切换 Tabs,优化了使用朋友圈等扩展功能的操作步骤。在 Symbian、Android、Windows Phone、iOS 平台使用微信的体验中,微信这一次的 UI 大换血可以说是我最喜欢的改进之一。由于在 Android 平台上之前版本的微信是近乎原封不动的移植 iOS 平台上微信的 UI,在原生系统上的视觉效果十分违和, 这也是促使我用脚投票转投 iOS 最重要的原因之一。

Screenshot_2014-01-27-04-01-43 2014-01-27 04.00.40

Cons:

1. 聊天页面的“发送”按钮与图标

在整体 UI 都向 Android Design 靠拢时,聊天界面丑陋的“发送”按钮按下反馈的缺失以及未采用更美观的“纸飞机”控件,着实是新版微信的一大败笔;以及新版微信依然沿用了旧版的 iOS7 风格图标去掉边框和加上阴影真的不会死人 

Screenshot_2014-01-27-02-57-23_framed 2014-01-21-08.32.57_framed 

2. 消息提示未适配 Expandable Notification

Android 系统已经更新到 4.4 版本,而 Expandable Notification 则是在 Android 4.1 Jelly Bean 就已经支持的特性,新版微信却并没有提供支持,而 Android 平台上其他较为热门的第三方应用都已支持,腾讯还需努力。

3. 推送仍不支持 GCM (Google Cloud Messenger)

腾讯正在发力推动微信全球化,并在 UI 的改进上迈出了一大步,却仍然采用了单独在后台增加进程的方法来实现消息的实时推送,而不是走 Google 官方提供的 GCM 推送通道。虽然在国内 GCM 服务在相关法律法规的禁止之下被阉割,不过腾讯却依然没有为海外用户提供支持 GCM 推送的版本,这一点非常遗憾,期待在后续版本的开发中腾讯能为海外用户提供不过按照疼迅一贯的德行估计又要拖到猴年马月

 

在一片骂声之中,腾讯更新了符合 Android Design 风格的微信 5.2 For Android 版本。当初的愿望如今终于成真,我这万年打酱油也忍不住出来说两句,但愿微信可以引领国内 Android 应用适配 Android Design 的风潮,给国内用户一个更美观更舒适的 Android 环境吧,以上。

差评都是咎由自取

在经过了数天的公开测试之后, 腾讯 —— 这个一贯在 Android 上反应诡异的巨头 —— 终于把微信 5.2 头上的 Beta 帽子摘下, 让所有用户都可以升级到这个体现了腾讯对 Android Design 理解的版本.

紧接而来的确是一大波差评. 这些差评的内容大多很有趣, 摘录几条如下:

漫步天涯的浩子:大哥,用户界面敢不敢设计的再丑一点?! (今天 02:05)

龙二毛:有人玩微信都是一个手玩的,你把聊天,通讯录,还有发现移到屏幕上方,这是唱哪出啊?你觉得方便吗? (今天 10:45)

AllureSylvia:微信升级之后丑了一截,瞬间不想用了[崩溃][崩溃][崩溃] 你们到底有!没!有!审美啊??!整个画面那么僵硬,手机里原先的字体也不能完全转变,图片边框也整个僵硬掉,你们脑袋里都是砖头吗? @烦烦烦烦烦躁症 我终于知道你的字体……现在我的也是啊 [泪流满面][泪流满面][泪流满面]@腾讯微信团队 (今天 01:23)

Balderdasher:从微信刚刚诞生时候的诺基亚塞班一路用过来,这个版本堪称史上最差 (今天 01:04)

郑桶桶桶桶桶:刚更新完,哭晕在厕所……你们是年终奖太少所以才这样报复社会吗?! (今天 01:01)

还有很多不明所以的评价: 

不爱豆浆爱牛奶:睡前更新,早上起来发现界面变化有点大。只是和新版本的 QQ 有些神似→_→ (今天 09:35)

鲜鱿鱼味脆香饼:越改版越恶心!!!跟特么 qq 一样???越来越渣[呵呵] (今天 02:22)

从上面的差评和不明所以评价中, 很明显可以看出三点:1. 腾讯在微信更新之后, 没有给用户介绍新版微信到底有了什么变化, 该如何使用, 而是让用户毫无准备的面对一个 “全新的” 界面; 2. 从 iOS 6 Design 没有任何过渡直接跳转到 Android Design, 变化确实太大以至于很多用户难以接受; 3. “庸众”是用户的大多数, 这些用户甚至连 iOS 7 UI 和 Android Design 都无法分辨 (在他们眼中世界上似乎就只有扁平和 iOS 6 两种风格).

当然, 除了差评之外, 也有正面的评价:

王康 2812:实用性大大增强,就是界面还得花一段时间去适应 (今天 10:23)

Ryan 曾子言:终于回 Android Design 了,不得不说,这个版本超赞的,如果有黑色主题就更完美了 [good] (今天 10:15)

基恩 _TheLastSong:不爱用的直接卸了用以前的就完了,这个版本才是正统的 android design,一直用 iOS 7 的你不觉得就像一个男人穿了件女人的衣服一样不合适?(今天 08:31)

花爷爱魅族:吐槽的都是被无脑移植 ios 的版本惯坏了,这才是属于安卓的软件 (今天 09:28)

不管你愿不愿意承认, 大部分用户都是愚蠢而盲目的 “庸众”. 给他们任何一种设计风格用一阵子 (不对, 是很长的一段时间), 然后毫无预告的突然改变, 同时在改变之后也不给出任何使用提示, 他们中的绝大多数的都会嚷嚷着丑爆了, 要降级, 绝对不升级…

等等, 这一幕是不是非常的眼熟? 我们把时间倒回至 2013 年早些时候… 聪明的你一定已经会心的笑了吧? 没错,  哪怕是经典的 iOS 风格, 在经历了毫无预兆的突然改变 (对于很多 iOS 用户而言, 他们并不知道 iOS 7 有什么改变, 只是像往常一样, 看到设置上有一个未读角标, 就进去点了更新) 时, 它的用户都会觉得无法接受. 更何况 iOS 6 到 iOS 7 基本上只是视觉风格的改变, 核心操作逻辑并没有太大的变化 (而有变化的地方 —— 比如 Spotlight —— 则会让更多的用户感到迷惑), 而微信此番是连视觉到操作的彻底改变. 如此巨量的改变, 难免会让用户反弹.

不过且慢 —— 是谁造成了这样的状况? 在 Android 上, 使用 Android 风格的应用, 怎么又变成了 “巨量的改变”? 罪魁祸首究竟是谁呢?

看看吧. 哪些厂家从 Android 2.3 开始就一直在 Android 上采用 iOS 风格的 UI, 并且在 Android 进入 4.X 时代之后一直拒绝变化, 继续死守着 iOS UI? 是哪些厂家, 硬生生的把用户的 Android 手机改造成了视觉风格无比 iOS 的不伦不类的奇葩设备?

对于自己一手培养起来的, 只认 iOS UI 的用户, 腾讯在做如此巨大的改动的时候, 居然连一点 “新手教程” —— 没错, 这些从老微信升级上来的用户, 全部都得视为新手 —— 都没有, 从而导致引起这么大的用户反弹, 能怪谁呢?

其实上面那条微博里, 最经典的评论是这两句:

坑白:逗比 tx 自己把用户惯坏了 终于做一次人干的事 被不懂事的人喷出翔 (今天 07:46)

MobiFans:很多普通用户抱怨为啥不是旧的 iOS 界面了,不适应扁平化以及标准的 Android 设计规范操作方式,吐槽的比赞的多,用户的使用习惯都是你们给带坏的。 (今天 02:26)

这两条评论也是本篇题目的由来. 自己种下的孽障, 经由自己浇灌而结出的苦果, 最终只能由自己来吃下. 不过, 反正微信对于很多用户而言已经是不能缺少的存在了, 这些用户一边吐槽着, 也只能一边用, 不爽的卸了装旧版 —— 就和大多数用户对待 iOS 7 一样, 在不久之后, 等他们习惯了这套 UI (并且发现其实 Android 上的应用本应如此) 时, 他们就会像那些现在用着 iOS 7 并且觉得很好的用户一样, 不再吐槽和抱怨了. 所以说, 用户都是贱人, 作为开发方, 不是强奸用户, 就是被用户强奸.

亡羊补牢, 为时 ___?