从令人惊艳的「量子纸」1到在导航交互方式上的改弦更张2再到以大面积留白、彩色图标和圆角控件元素为主的「新面孔」,Material Design 自 2014 年面世至今已经进化成为一种成熟且完善的设计语言,在开发者和用户当中的接受程度也早已跳出了 Android 平台这个小圈子。

尽管如此,Google 依然没有舍弃「每年一表」的传统——2019 年的 Material Design Awards 获奖应用昨天刚刚揭晓,和 Lyft 这类国内用户完全体验不到的应用不同,今年获奖的四款应用大部分都算得上是 Play 应用商店中的沧海遗珠,值得大家下载把玩。

我们一起来看一看。

Ruff:主题表达奖

从色彩选用、排版设计到控件形状,这款 App 借助 Material Theming 设计理念搭建起了连续的使用体验和极具表现力的品牌形象。

Material Theming 是 Google 在 Material Design 2 的重要一环,和一板一眼地套用现成 Material Design 控件的做法不同,Google 鼓励开发者通过对应用内色彩、排版和界面控件的定制来为应用打造独特的主题风格和品牌辨识度。而在 Google Design 评选团队看来,Ruff 这款笔记应用就是对 Material Theming 理念的最佳实践,尤其在 bottom sheet(底部菜单)和 backdrop(主界面背景)这两种设计控件的运用上。

文本编辑与设置界面

Ruff 是一款主打随开随记体验的轻量化笔记应用,主界面按照层次从高到低依次由笔记存档按钮、底部工具栏、笔记存档区和文本编辑区域四大部分构成,虽然整体色彩以以灰、白和浅蓝为主,但底部控件堆叠仍显凌乱。

不过 Google 所表彰的 bottom sheet 用法倒是与笔记应用的功能结合得尤为紧密:一般情况下,底部的 bottom sheet 以微缩形态充当状态栏,展示当前笔记内容相关的字、词数量统计和阅读时长预估;因为采用了圆角处理同时有一定的视觉提示,将这个状态栏上拉即可呼出笔记存档(stash)面板,主界面记下的笔记内容通过 FAB 悬浮按钮存档后都按照时间线顺序收纳于此,可供二次复制和编辑。

bottom sheet 功能展示

作为一款笔记应用,Ruff 在功能上也算是可圈可点。主界面底部的工具栏提供了复制、粘贴、撤销、重做等常见操作和加粗、斜体、删除线等常用格式化工具,全局搜索工具放在了工具栏最右侧,一定程度上保证了文本编辑界面视觉效果的干净。

在主界面向右滑动即可进入应用设置,这里提供了符合 Material Design 设计规范的明暗三色主题(支持跟随时间自动切换)、字体大小和字重调节、桌面微件(widget)自定义等等设置,甚至启动时键盘是否自动开启、笔记内容是否跳转至最后编辑位置这样的小细节也可以自行选择,配合风格统一的等宽字体,Ruff 处处体现着开发者对于一款速记 App 的用心。

你可以在 Play 应用商店免费下载 Ruff,无限制笔记存档数量、去广告、微件滚动预览等功能需要内购解锁,售价 3.99 美元;此外 Ruff 也提供了 Windows 版本,与 Android 版笔记数据并不互通,但售价较低,中国区售价仅 8 元人民币。


Reflectly:创新交互奖

基于 Material Design 进行延展式、启发性的创新设计。

我们曾在 Flutter 技术框架的介绍文章中提到过 Reflectly 这款应用,也正是因为采用了 Google 的跨平台技术开发,Reflectly 精致的 UI 和灵动的动画效果在 Google 看来也是基于 Material Design 设计语言的一种「再创造」。

Reflectly 号称是「世界上第一款『智能笔记本』」,第一次进入应用后,Reflectly 会通过一些基本的问题来帮助我们回顾当天的经历和心情状态,这种问答的方式一方面可以让我们很快熟悉应用的基本交互方式,另一方面也为后续的日记记录方式搭建起了基础——在接下来的日记记录过程中,Reflectly 会借助 AI 对我们此前记下的内容进行分析、优化,并在后续记录过程中提出更加精确、更为个性化的问题。

动画效果展示

Google 特别强调了 Reflectly 对于动画效果的打磨:应用中所有界面元素的出现和消失都严格遵循物理特性,这个过程中的动画加速度则围绕无压力的整体交互体验进行了微调;同时 Reflectly 还很好地利用了 Material Design 中的层级抬升(elevation)效果来体现卡片与背景的层次效果。

借助层级抬升来体现卡片和选项的层次效果

和独立应用 Ruff 的「小而美」路线不同,Reflectly 的整体体验做到了「大而精」,UI、动效和功能相得益彰,问答形式是否能帮你养成写日记的好习惯是一回事,一款日记应用首先得用起来舒适,这一点 Reflectly 做得非常出色。

你可以在前往 Reflectly 官网下载 Reflectly,应用同时支持 iOS 和 Android 版本。

关联阅读:新晋跨平台框架:Flutter 技术


Scripts:用户体验奖

交互、引导和内容的有机整合,构建起令人印象深刻的用户体验。

和应用相关的奖项,无论是设计奖还是年度最佳,语言学习类应用总是不会缺席的。而 Scripts 出现在这次的 Material Design Awards「决赛圈」,显然意味着 Google 对「应用设计」这个概念的理解已经跳出了 UI 和动效这个层面——毕竟只从外观设计出发 Scripts 严重「拖后腿」,异形屏、18:9 等屏幕特性均未适配。

临摹式书写学习体验

不过和大部分语言学习应用不同,Scripts 围绕「学习书写」这个出发点还是扩展出了相当有趣的用户体验:应用支持中、日、韩、俄和拉丁语四种语言的书写学习,对单个文字的书写学习包含发音、笔顺引导和练习三个步骤,其中练习环节分为临摹和自由书写两个阶段,书写过程、出现笔顺或书写错误时,应用都会给出适当的振动反馈,让在手机屏幕上书写这件事多了点「质感」,手把手教学的形式也有点把小学语言课程带到手机屏幕上的感觉。

手把手教你写汉字

针对部分象形字比较多的语种(比如汉语),Scripts 还会在字形背后提供图片背景方便理解。但体验部分之外 Scripts 乏善可陈,免费用户每种语言每天的书写学习时间只有 5 分钟。

你可以前往 Play 应用商店免费下载 Scripts


Trip.com:最佳通用性

考虑周到、体贴入微,尽可能满足最广泛用户的实际需求。

相较于国内主流的旅行服务平台,Trip.com 的客户端应用在设计上可以说是教科书般的参考3。借助合理的功能布局和运用恰到好处的字重缩放(typographic scale)设计,Trip.com 在支持的 19 种语言下都能呈现出层级分明、井然有序的界面设计。

Material Design 的字形和字重缩放参考
层次分明的界面布局和俏皮的动画效果

除此之外,整齐划一的应用内图标风格、丰富的色彩运用、针对重点操作特别制作的反馈动画,这些小细节在 Trip.com 干净、整洁的应用界面中就显得格外出彩了;这里 Google Design 团队特别强调了 Trip.com 底部导航的视觉反馈,当特定页面被选中时,标签图标会从线框图标变为实心图标、文本标签略微放大、图标整体色彩也有变化。

底部导航动画效果

当然,以上只是 Trip.com 应用中诸多细节设计中的冰山一角,最重要的是,Trips.com 所有的图标、动画、字体和色彩设计都是符合无障碍设计对比度要求的

你可以在 Play 应用商店免费下载 Trip.com



以上便是获得今年 Material Design Awards 大奖的四款应用,不得不说,相比 去年 的获奖应用今年这四款都有相当不错的实用性。

另外如果你有喜欢的 Material Design 2 应用,也欢迎在评论区留言分享(友情提示:可以附图的哟)。

参考链接:Google Material Design Awards 2019

关联阅读:Material Design Awards 出炉,这 4 款应用被 Google 评为「年度最美」

> 下载少数派 客户端、关注 少数派公众号 ,第一时间掌握 Android 新动态 🤳

> 特惠、好用的硬件产品,尽在 少数派sspai官方店铺 🛒