獲 2015 年 Google Play 最佳設(shè)計(jì)獎(jiǎng)的 Evernote，如何同時(shí)兼顧高效與優(yōu)雅？看完這篇文章，你就知道。

想要?jiǎng)?chuàng)建一款功能強(qiáng)大的筆記應(yīng)用程序，同時(shí)還要做到讓用戶體驗(yàn)并不復(fù)雜，即使對(duì)于那些最為經(jīng)驗(yàn)豐富的設(shè)計(jì)師都是一個(gè)巨大的挑戰(zhàn)。

2015 年，Evernote 決定全面應(yīng)用 Material Design 設(shè)計(jì)規(guī)范，而這一舉措為其優(yōu)化應(yīng)用功能、創(chuàng)造更流暢的用戶體驗(yàn)提供了完美的機(jī)會(huì)。最終的產(chǎn)品以更簡(jiǎn)潔的 UI，結(jié)合優(yōu)美的動(dòng)效及排版，突出強(qiáng)調(diào)了 Evernote 的核心概念 —— 捕獲和組織創(chuàng)意的能力。

以簡(jiǎn)潔清晰的 UI 實(shí)現(xiàn)化繁為簡(jiǎn)

設(shè)計(jì)一款實(shí)用的筆記產(chǎn)品，最大的挑戰(zhàn)之一就是如何做到兼顧記錄時(shí)的快捷以及回顧時(shí)的便利。為了解決這兩個(gè)問(wèn)題，每次打開程序時(shí) Evernote 都向用戶呈現(xiàn)綠色的懸浮按鈕（用于記錄）以及筆記列表（用于回顧）。

Evernote 的界面以簡(jiǎn)潔高效著稱

只需簡(jiǎn)單的點(diǎn)擊即可快速記錄下新的想法，而之前記錄的信息，無(wú)論是照片、音頻、聊天信息還是任何其他類型的內(nèi)容，都可以通過(guò)整潔的筆記列表輕松訪問(wèn)。

Evernote 的移動(dòng)產(chǎn)品設(shè)計(jì)經(jīng)理 Kara Hodecker 認(rèn)為，通過(guò)采用 Material Design，Evernote 最大限度地減少了對(duì)用戶的干擾，讓用戶可以直接在應(yīng)用主頁(yè)輕松地檢索并編輯筆記。

“在貫徹 Material Design 設(shè)計(jì)規(guī)范的過(guò)程中，我們得以大幅簡(jiǎn)化了 UI，并移除了多余的線條、邊框及其他可能會(huì)攪亂界面的元素。

—— Evernote 移動(dòng)產(chǎn)品設(shè)計(jì)經(jīng)理 Kara Hodecker

在持續(xù)存在的 FAB（懸浮按鈕）上應(yīng)用了快捷指令的設(shè)計(jì)（speed dial transition）—— 點(diǎn)擊后展開并呈現(xiàn)六種不同的記錄筆記的方式，并強(qiáng)化了用戶輸入數(shù)據(jù)及快速了解 Evernote 產(chǎn)品性能的方式。

快捷指令設(shè)計(jì)（speed dial transition）中通過(guò)動(dòng)畫展開子級(jí)按鈕，明確地表明了功能的相關(guān)性，讓用戶第一時(shí)間心領(lǐng)神會(huì)。

按下時(shí)，懸浮按鈕會(huì)彈出所有記錄筆記的方式—— 用戶能做什么在一個(gè)動(dòng)畫之內(nèi)就一目了然了。

用明確的動(dòng)效讓用戶安心

查看 to-do 列表一直都會(huì)讓人緊張（ 尤其是關(guān)鍵項(xiàng)目的 to-do 列表 ）。因此，在用戶記錄想法時(shí)，使用清晰的信號(hào)表達(dá)出 「記錄成功」 的狀態(tài)，會(huì)讓用戶倍感安心。

Evernote 使用動(dòng)效讓用戶知道他們的筆記已經(jīng)被保存（并通過(guò)這一簡(jiǎn)單優(yōu)雅的動(dòng)畫為他們帶來(lái)驚喜）。

Evernote 使用簡(jiǎn)單而優(yōu)雅的動(dòng)效來(lái)傳達(dá)這種信號(hào)。

   •用戶編輯全新或已有的筆記時(shí)，左上角的返回上級(jí)按鈕將從箭頭變?yōu)榇_認(rèn)勾選標(biāo)記。

   •用戶編輯完成后，點(diǎn)擊對(duì)勾標(biāo)記將觸發(fā)短暫的動(dòng)畫，對(duì)勾符號(hào)轉(zhuǎn)換回箭頭的樣子 —— 這個(gè)變化會(huì)讓人們知道，修改工作已經(jīng)保存，可以放心的返回到筆記列表了。

Evernote 產(chǎn)品經(jīng)理 Justin Street 認(rèn)為，動(dòng)效的價(jià)值再怎么強(qiáng)調(diào)都不過(guò)分 —— 它們可以讓用戶安心并展露出自信的笑容。

”動(dòng)效為用戶帶來(lái)愉悅。雖然 Evernote 是用于工作的工具，但我們也希望它是您喜歡使用的工具 ，是您繁忙的工作中的一抹亮色。

—— Evernote 產(chǎn)品經(jīng)理 Justin Street

通過(guò)排版強(qiáng)化品牌認(rèn)知和可用性

只要您能夠系統(tǒng)地使用網(wǎng)格、空間、尺寸、顏色、圖像及排版等基本元素來(lái)指導(dǎo)整體設(shè)計(jì)，任何字體都能很好地融入 Material Design 體系中。事實(shí)上，Google 之所以建立如此靈活的設(shè)計(jì)語(yǔ)言，初衷就是讓品牌有空間釋放自己的個(gè)性。

根據(jù) Street 的說(shuō)法，Evernote 明確地意識(shí)到要同時(shí)兼顧創(chuàng)造力與系統(tǒng)規(guī)范，在傳達(dá)品牌個(gè)性的同時(shí)，通過(guò)貫徹 Material Design 來(lái)提升用戶體驗(yàn)。

“我們喜歡有個(gè)性的操作系統(tǒng) – Material Design 的偉大之處就在于此。追求獨(dú)特的背后都有著強(qiáng)大的邏輯，這也是 Evernote 的處世之道。

—— Evernote 產(chǎn)品經(jīng)理 Justin Street

通過(guò)在整個(gè)應(yīng)用中對(duì)排版方式的極致應(yīng)用，我們創(chuàng)造了一種清晰的層次感，并為它注入了自己獨(dú)特的性格。

Evernote 的系統(tǒng)字體 – Caecilia 字體，與 Roboto 字體配合良好，后者是 Android 系統(tǒng)中可用的標(biāo)準(zhǔn)非襯線字體。設(shè)計(jì)團(tuán)隊(duì)選擇在標(biāo)題以及較高層級(jí)信息中使用 Caecilia 字體，在正文、UI 元素及其他地方使用 Roboto 字體。

這兩種字體的配合使用帶來(lái)了讓人欣喜的變化，讓用戶能夠輕松地吸收信息，并毫不費(fèi)力地在功能模塊間完成切換。這兩者的配合使用同時(shí)也幫助簡(jiǎn)化了開發(fā)流程，因?yàn)?Roboto 是 Android 自帶的字體，所以不需要單獨(dú)添加，而且天然支持更多擴(kuò)展語(yǔ)言。

獎(jiǎng)項(xiàng)與社區(qū)支持皆收入囊中

Evernote 已經(jīng)培養(yǎng)出了一個(gè)充滿激情和忠誠(chéng)的用戶群體，在 Material Design 轉(zhuǎn)型期間也從未失去用戶的喜愛(ài)。

轉(zhuǎn)型到 Material Design 之后，反饋信息中的絕大部分都是積極正面的，總評(píng)分?jǐn)?shù)高達(dá) 4.6 分，點(diǎn)評(píng)數(shù)量超過(guò) 140 萬(wàn)條（ 并且這個(gè)數(shù)字還在不斷增加 ）。

Evernote 曾在 2015 年榮獲 Google Play 最佳設(shè)計(jì)獎(jiǎng)，并一直處于頂級(jí) Material Design 應(yīng)用之列。

事實(shí)上，轉(zhuǎn)向 Material Design 還帶來(lái)了一個(gè)意外的好處，那就是媒體報(bào)道數(shù)量猛增 —— 那些熱衷于介紹 「強(qiáng)化用戶體驗(yàn)」 和 「感受 Material Design 之美」 的網(wǎng)站在這方面尤其熱心。

相信看到這里，對(duì)于 Material Design 能帶來(lái)的體驗(yàn)和評(píng)價(jià)方面的好處您已經(jīng)了然于胸。是時(shí)候去看看 Google Material 設(shè)計(jì)規(guī)范，并早些應(yīng)用在您的作品中吧！