重新设计安卓版Gmail app页面案例

随着Material Design 2 的发表，Google suite中的产品纷纷推出新设计，因为手机上APP还未更新，所以作者JasonCK思考如何让历史悠久的Gmail 能更直觉、更方便，为它披上Material Design 2的新外衣。

Gmail 与它的兄弟 Inbox

Google 有两个邮件服务，一个是Gmail 另一个是Inbox，两者处理邮件的模式大不相同，Gmail 属于比较传统的邮件服务，使用者收到信能做的是回复、归档、删除邮件等等，Inbox 则是以「动作」，例如延后、完成、回复，使用者决定下一步该如何处理这封信，做出动作回应，延伸这封信内容的价值，就像一个代办清单，而非传统邮件单纯阅读收发，我认为这样的处理方式比起传统的收发阅读更有生产力，还在实验中的新版网页版Gmail 也提供了「延后」以及融合Google 日历、Tasks 代办清单，想见Google想融合两者优点，在这次Redesign 中也会试着以一些Inbox 的思维去设计。

重新设计的目标：

1.2点是从Play 商店页面收集来的用户反馈的痛点。

1、使用者表示App 版没有全选删除/标示已读功能。

2、使用者表示常常找不到未读邮件。

3、导入Google 智能回复。

4、快速找出使用者标记星号的邮件。

原版Gmail for Android

设计结果

重新设计后的Gmail for Android

首页的设计，选择直接将三大分类排列出来，让人一目了然哪个信箱还有尚未阅读的信件，在主要收件箱扫视信件标题时，不会受到其他类别的邮件的干扰。

另外将App Bar 改成在MD2 新推出的Bottom App Bar，考虑到使用手机的热区集中在下半部，希望将常用的浏览、整理邮件时需要的功能都可以轻松的在下方完成；一些更重要的按钮例如「发送」放在在较费力点击的上方位置，为操作增加一定程度的难度除了不容易误触外，也有利于使用者在过程中较理性的去思考自已的决定，发送前先好好检查有无错字之类的。

首页的选单多出选择、全选、重新整理等原本必须用手势启动的功能

在首页右下角的菜单设计，有「选择」以及「全选」的功能，熟悉Material Design 特性的人在原版Gmail 中也许很容易就能发现如何选取多封邮件，但是很多小白用户并不太了解这个功能，于是在这里加上明显的功能键，方便不熟悉MD 特性的人也更容易找到这个功能，「全选」则是在Play 商店上很多人要求的功能，在手机版上没办法快速全选，让很多人想要一次清空收件箱却无法实现，因此加上来这个功能。

阅读信件、回复页面

最后是邮件页面，在悬浮动作按钮(Floating Action Button)上，从原本的单纯「回复」改成一个加号，按下后会出现一系列动作，我想整合Google 其他产品进来，这也是新的Gmail 网页版推出的功能，我将它放在这里方便使用者可以决定下一步动作，可以将Email 中的内容排进日历，在指定时间提醒，或者用Tasks 把它加入一个待办清单。

通过这次重新设计，让我们深入认识了Material Design Guideline 中的各种元件，了解其骨架和规格，整个方案也都遵循MD 中的规范去订定边界、按钮大小、间隔，也许遵循规范感觉比较没有创意性，但可以当作一个实用性的最低标准，尽量避免出现按钮太大破坏画面平衡，或太小很难点击这种失误。