當(dāng)我們談?wù)搩?yōu)秀的產(chǎn)品設(shè)計(jì)時(shí)，我們常常會(huì)被 Dribbble 上那些炫酷的新事物、設(shè)計(jì)趨勢(shì)、微交互和概念圖所吸引。但關(guān)鍵在于：一些最好的經(jīng)驗(yàn)教訓(xùn)來自于每天被數(shù)百萬人使用的真實(shí)產(chǎn)品。
Gmail 的移動(dòng)收件箱就是其中之一。
它并不浮夸，也不刻意贏得設(shè)計(jì)獎(jiǎng)項(xiàng)。但它抓住了基本要素——清晰的視覺效果、高效的交互以及以用戶為先的決策，讓電子郵件收發(fā)變得輕松便捷。無論你是設(shè)計(jì)師、創(chuàng)始人還是產(chǎn)品人員，研究 Gmail 如何處理收件箱都能讓你受益匪淺。
讓我們來分析一下。
1. 從主頁預(yù)覽附件
Gmail 不會(huì)強(qiáng)迫你打開郵件查看對(duì)方發(fā)送的文件。如果有附件，它會(huì)立即顯示在收件箱預(yù)覽中，方便你即時(shí)查看和點(diǎn)擊。
重要性：在移動(dòng)設(shè)備上，每一次點(diǎn)擊都至關(guān)重要。為用戶提供訪問重要內(nèi)容的快捷方式，可以節(jié)省時(shí)間并減少用戶挫敗感。這小小的改進(jìn)，卻帶來了巨大的可用性提升。
要點(diǎn)：思考用戶最想從列表視圖中的項(xiàng)目中獲得什么，并將其直接呈現(xiàn)。不要埋沒好東西。
2. 清晰區(qū)分已讀和未讀
這是最簡(jiǎn)潔、精妙且有效的用戶體驗(yàn)示例之一：Gmail 會(huì)用加粗的主題行和更高的對(duì)比度來顯示未讀郵件。就是這樣。沒有彩色圓點(diǎn)，沒有圖標(biāo)。只是巧妙地運(yùn)用了字體排印。
工作原理：它可以立即掃描。你甚至不需要思考就能看到未讀郵件。
設(shè)計(jì)洞察：視覺重量 > 視覺混亂。如果簡(jiǎn)單的對(duì)比度和字體樣式就能達(dá)到效果，就不要添加新元素。
3. 自動(dòng)整理收件箱標(biāo)簽
主要功能、社交功能、推廣功能。Gmail 會(huì)將您收到的大量郵件自動(dòng)分類，方便您管理。這不僅自動(dòng)化，還能幫您減輕壓力。
為什么這樣做很明智：收件箱超載是真實(shí)存在的。Gmail 通過無需用戶輸入即可對(duì)內(nèi)容進(jìn)行分類，為用戶提供了喘息的空間，并幫助他們確定優(yōu)先級(jí)。
產(chǎn)品團(tuán)隊(duì)的經(jīng)驗(yàn)：不要只展示內(nèi)容，還要精心策劃。智能默認(rèn)設(shè)置和自動(dòng)化可以減少?zèng)Q策疲勞。
4. 內(nèi)聯(lián)關(guān)鍵信息提取
以截圖中的 Under Armour 郵件為例。Gmail 會(huì)提取預(yù)計(jì)送達(dá)日期，并直接顯示在收件箱預(yù)覽中。無需點(diǎn)擊、滾動(dòng)或搜索。
巧妙之處：它甚至在用戶打開郵件之前就解答了他們的疑問。這才是效率，這才是信任。
學(xué)習(xí)要點(diǎn)：如果你的產(chǎn)品能夠檢測(cè)日期、狀態(tài)、摘要等關(guān)鍵信息，就不要隱藏它。把它拿出來，在最有用的地方展示。
5. 簡(jiǎn)潔且內(nèi)容豐富的層次結(jié)構(gòu)
Gmail 的收件箱界面功能豐富：頭像、發(fā)件人、主題、時(shí)間戳、預(yù)覽、標(biāo)簽、圖標(biāo)。但絲毫不會(huì)讓人感覺雜亂。
怎么做到的？巧妙地使用間距、字體大小、對(duì)齊方式和填充，創(chuàng)造出賞心悅目的視覺節(jié)奏。
設(shè)計(jì)要點(diǎn)：你可以展示大量?jī)?nèi)容，但又不會(huì)讓人感到不知所措。關(guān)鍵在于層次和空間的留白。
從現(xiàn)實(shí)世界的用戶界面中學(xué)習(xí)，而不僅僅是概念
這個(gè) Gmail 細(xì)分只是UXSnaps上的眾多專題之一——UXSnaps 是一個(gè)免費(fèi)網(wǎng)站，可以對(duì)成功產(chǎn)品背后的 UI 模式進(jìn)行逆向工程。
每一個(gè)細(xì)分都直接取材于真實(shí)的產(chǎn)品屏幕，并附有快速實(shí)用的課程，助您輕松應(yīng)用。沒有專業(yè)術(shù)語，沒有空談，只有敏銳的洞察力。
如果您真的想提高自己的設(shè)計(jì)技能，那就從這里開始吧。
