「我該怎樣開(kāi)始」是軟件開(kāi)發(fā)的第一道坎，當(dāng)我跨過(guò)這道坎開(kāi)始做產(chǎn)品時(shí)，所接觸到最有用的靜態(tài)參考（靜態(tài)是指在編譯時(shí)而非運(yùn)行中進(jìn)行數(shù)據(jù)類型檢查），還屬杰夫·阿特烏（Jeff Atwood）原創(chuàng)的代碼味道清單。這份清單列舉了各種在代碼庫(kù)界面出現(xiàn)的小情況，而這些小情況往往反映了更大的架構(gòu)問(wèn)題。

代碼「味道」很實(shí)用，只要你學(xué)會(huì)識(shí)別它們，就能通過(guò)迅速重構(gòu)代碼，把有缺陷的架構(gòu)扼殺在搖籃中。除了幫你節(jié)約大量時(shí)間，還能避免因各種大大小小的補(bǔ)救行為而付出的巨大代價(jià)。

在產(chǎn)品設(shè)計(jì)這個(gè)領(lǐng)域我也犯過(guò)不少有關(guān)用戶體驗(yàn)的錯(cuò)誤，經(jīng)驗(yàn)也隨之豐富起來(lái)，我意識(shí)到這個(gè)概念同樣適用于界面設(shè)計(jì)。有些產(chǎn)品和界面的特征，是不能用于設(shè)計(jì)優(yōu)良產(chǎn)品上的。

因?yàn)楫?dāng)你在產(chǎn)品看到或者植入這些特征時(shí)，便是產(chǎn)品在用戶體驗(yàn)方面出現(xiàn)深層次問(wèn)題的警告了（A 君注：這即是所謂的用戶體驗(yàn)的「味道」）。而學(xué)會(huì)識(shí)別它們，你可以設(shè)計(jì)出更好的產(chǎn)品，成本也會(huì)大大降低。

關(guān)于用戶體驗(yàn)的「味道」，我認(rèn)為有以下?3?個(gè)普通的、可及時(shí)糾正的、不明顯的注意點(diǎn)：

1.「高級(jí)用戶」幫助文檔

針對(duì)各種不同復(fù)雜性的 App 里的「高級(jí)用戶」幫助文檔，眾多團(tuán)隊(duì)腦洞大開(kāi)，想了各種辦法，以下是一些舉例：

單獨(dú)的文檔門戶網(wǎng)頁(yè)，點(diǎn)擊進(jìn)入后可以查看常見(jiàn)問(wèn)題解答（FAQ）以及用戶指南文檔。比如，下圖中微軟網(wǎng)頁(yè)的 Excel 幫助頁(yè)面。

為社區(qū)提供支持的門戶網(wǎng)頁(yè)，其最初是用于幫助用戶更好地使用產(chǎn)品。比如，大量類似 TuxRadar 的在線論壇，其主要功能是幫助用戶使用 Shell 語(yǔ)言中的 Bash（A 君注：Shell 指的是 Linux/Unix 系統(tǒng)下的 Shell 腳本語(yǔ)言。它有不同的版本，比如 sh/bash/ksh/csh/tcsh/pdksh 等，最常用的是 Bash）。

軟件內(nèi)置的提示和指南界面，比如蘋果在 2014 年 6 月隨 iOS8 首發(fā)推出的 Tips 這個(gè) App。

介紹界面的「導(dǎo)覽功能」，作為新用戶產(chǎn)品熟悉階段的一部分。比如，使用 Bootstrap Tour 工具（A 君注： Bootstrap Tour 以最簡(jiǎn)單的方式向人們展示如何使用你的網(wǎng)站）。

它可能帶出什么警告？

以上是指導(dǎo)用戶了解界面的全然不同的方法?？蔀槭裁炊疾缓媚?？——因?yàn)樽詈玫慕缑娓静恍枰改?，一切本已自然明顯了。

iPad 觸摸界面可以讓用戶直接憑直覺(jué)正確地操作，即便是兒童，在沒(méi)有指導(dǎo)的情況下也知道如何使用。

當(dāng)用戶要求你為其提供產(chǎn)品指南時(shí)，說(shuō)明你的產(chǎn)品對(duì)他們來(lái)說(shuō)，根本不好用。

你又可以做點(diǎn)什么？

就我個(gè)人經(jīng)驗(yàn)而言，產(chǎn)品設(shè)計(jì)及維護(hù)、奮力和界面「作斗爭(zhēng)」通常屬于以下?3?種情況其一：

首先，用戶界面使用了平臺(tái)搭建不規(guī)范的設(shè)計(jì)。這不僅常見(jiàn)于各平臺(tái)上有著相似「大眾」界面的 App 里，還常見(jiàn)于富有創(chuàng)新能力的設(shè)計(jì)師團(tuán)隊(duì)設(shè)計(jì)出的產(chǎn)品上。

這些設(shè)計(jì)師花大量時(shí)間定制核心的用戶界面和用戶體驗(yàn)元素，而這些元素的設(shè)計(jì)本應(yīng)視平臺(tái)而定，而不是視產(chǎn)品而定。（你可以從圖標(biāo)到內(nèi)容導(dǎo)航仔細(xì)查看一遍）。

一旦你意識(shí)到這個(gè)問(wèn)題后，解決方案就迎刃而解了：使用符合平臺(tái)的設(shè)計(jì)元素，這樣用戶在不用閱讀用戶指南的情況下也能明白。我保證，無(wú)論是你的用戶，還是考核你 KPI 的人，都會(huì)樂(lè)意看到這個(gè)結(jié)果。

其次，產(chǎn)品的使用對(duì)象來(lái)自各行各業(yè)，其使用目的也不盡相同。Excel 就是一個(gè)典型的例子：無(wú)論是財(cái)務(wù)分析行業(yè)的人士，還是獨(dú)立的個(gè)人用戶，或是統(tǒng)計(jì)工作者，又或是產(chǎn)品經(jīng)理，他們都在使用 Excel 的某些功能來(lái)處理數(shù)據(jù)，但他們用的功能并不全然相同。

因?yàn)樯婕暗教嗟挠脩羧后w，界面無(wú)法做到為單一個(gè)體用戶「私人定制」，所以必然會(huì)導(dǎo)致某些用戶群體在使用過(guò)程中犯暈。

要解決這個(gè)問(wèn)題，如果所有條件都可能的話，將你的產(chǎn)品拆分為幾個(gè)產(chǎn)品，為不同的用戶群體定制不同的產(chǎn)品。（如果要按重要性來(lái)說(shuō)的話，從目前及將來(lái)增長(zhǎng)兩方面來(lái)考慮，挑一兩個(gè)最重要的市場(chǎng)。）

通過(guò)對(duì)用戶群體的產(chǎn)品定制，你就能進(jìn)一步簡(jiǎn)化界面，產(chǎn)品藍(lán)圖也會(huì)更加具體，這是一個(gè)人人皆樂(lè)的結(jié)果。

最后，界面排版布局并不易發(fā)現(xiàn)。這種情況出現(xiàn)的原因大多是因?yàn)閷?dǎo)航，導(dǎo)航要么不易發(fā)現(xiàn)，要么就給用戶太多選擇，而整個(gè)架構(gòu)也并不合理、并不簡(jiǎn)單。解決這個(gè)問(wèn)題，要向用戶提供基于用戶真實(shí)的使用行為的簡(jiǎn)單上手的導(dǎo)航，此外，導(dǎo)航也不需要任何幫助文檔。

當(dāng)然，也有可能你的產(chǎn)品設(shè)計(jì)比較復(fù)雜，原創(chuàng)性比較強(qiáng)，這種情況下可能真的需要一個(gè)復(fù)雜又全新的界面。雖然這不常見(jiàn)，但若真有這種情況的話，你需要盡可能設(shè)計(jì)出可以讓用戶憑直覺(jué)就可以方便操作的界面，但有可能仍需少量的幫助文檔。

2. 難以實(shí)現(xiàn)的界面布局

在我過(guò)去個(gè)人經(jīng)歷的項(xiàng)目中，當(dāng)真正開(kāi)始設(shè)計(jì)界面時(shí)，我遇到過(guò)不少難以實(shí)現(xiàn)的界面布局：

• 網(wǎng)頁(yè)上需要滾動(dòng)鼠標(biāo)來(lái)瀏覽的內(nèi)容。有時(shí)候，加入側(cè)邊欄工具是一個(gè)不錯(cuò)的選擇，這樣就可以讓用戶滾動(dòng)鼠標(biāo)至頁(yè)面某特定部分。
• 復(fù)雜、具有層次的導(dǎo)航。有時(shí)，各類應(yīng)用需要加入許多定制導(dǎo)航邏輯，從而解決不同架構(gòu)層級(jí)、以及同級(jí)架構(gòu)層之內(nèi)的切換問(wèn)題。
• 復(fù)雜、非標(biāo)準(zhǔn)的動(dòng)畫。大多數(shù)界面平臺(tái)都有一套自始自終都在使用的標(biāo)準(zhǔn)動(dòng)畫。其實(shí)，不妨試試設(shè)計(jì)一套具有獨(dú)自特色的動(dòng)畫。

總之，如果僅僅是為了設(shè)計(jì)出整個(gè)界面布局和標(biāo)準(zhǔn)的界面元素（而非產(chǎn)品的核心增值界面），而需在編程方面投入大量工作的，不妨回過(guò)頭再考慮下這些問(wèn)題。

它可能帶出什么警告？

難以實(shí)現(xiàn)的界面布局通常和與平臺(tái)相關(guān)的界面和用戶體驗(yàn)的傳統(tǒng)認(rèn)知是相沖突的。因此，這么做可能會(huì)讓用戶產(chǎn)生疑惑。此外，通常還會(huì)花時(shí)間適應(yīng)意料之外的各方面問(wèn)題。

平臺(tái)的內(nèi)置架構(gòu)和設(shè)計(jì)是之前被測(cè)試過(guò)，在不明顯和異常的屏幕方向、內(nèi)容寬度、設(shè)備裝置上都適用的，那你真能花那么多時(shí)間做測(cè)試并調(diào)整這些不重要的細(xì)節(jié)元素嗎？

這個(gè)問(wèn)題在帶有接口或跨設(shè)備的布局（比如在基于網(wǎng)絡(luò)視圖的移動(dòng)應(yīng)用）上更加常見(jiàn)，但是這個(gè)問(wèn)題即常見(jiàn)又容易發(fā)現(xiàn)。

你又可以做點(diǎn)什么？

無(wú)論如何，一定要使用適用于平臺(tái)的標(biāo)準(zhǔn)界面和用戶體驗(yàn)元素。如果和你的品牌稍有不搭，可以根據(jù)實(shí)際情況微調(diào)——但不能徹底改變。如果和你的設(shè)計(jì)完全不搭，或者和你的設(shè)計(jì)相比略遜一籌，那就從用戶角度認(rèn)真思考這個(gè)問(wèn)題到底有多重要。

3. 過(guò)量的圖標(biāo)

文檔的字?jǐn)?shù)有多少？我該怎樣快速地?cái)?shù)出來(lái)？

Mac 2016 年版微軟辦公軟件 Ribbon 視圖

我頻繁地使用這個(gè)軟件，但我完全不知道怎么數(shù)。下圖是圖標(biāo)下帶有文字標(biāo)簽的 Ribbon 視圖（為保證原樣，下圖為默認(rèn)視圖，未做任何改動(dòng)）：

它可能帶出什么警告？

先等等。如果這些圖標(biāo)沒(méi)什么意義，又不帶文字標(biāo)簽的話，那它們存在的原因是什么？給你一個(gè)小提示：

看看上圖凌亂的界面！太多不同的功能了，為了顯示全部?jī)?nèi)容，只好把字體變??！

加入圖標(biāo)，特別是主導(dǎo)航菜單的圖標(biāo)，是一種經(jīng)常使用的通過(guò)界面使較差的用戶體驗(yàn)變得更有吸引力的手段。但 MS Word 主菜單的核心問(wèn)題不是圖標(biāo)太難被理解，而是任何時(shí)候都顯示了太多功能。

再舉?1?個(gè)例子：

Xcode 新建項(xiàng)目界面

Xcode 向用戶顯示了過(guò)量的高度復(fù)雜功能，雖然實(shí)際用戶體驗(yàn)太差，使用不方便，但因?yàn)閳D標(biāo)的加入看起來(lái)還是挺有吸引力的。可以試想一下，如果所有的圖標(biāo)都被同一小塊的文字標(biāo)簽所代替，界面效果會(huì)怎樣？

你又可以做點(diǎn)什么？

簡(jiǎn)化產(chǎn)品，將核心的功能植入各項(xiàng)交互里。交互界面要足夠小，以舒適地顯示僅以文字為基礎(chǔ)的操作提示（文字標(biāo)簽）。

通常，這需要你認(rèn)真思考用戶會(huì)如何使用你的產(chǎn)品，并精心設(shè)計(jì)界面的導(dǎo)航層，這樣，不同的功能就可以恰當(dāng)?shù)卦O(shè)計(jì)和顯示。有時(shí)，也可能需要你將產(chǎn)品拆分成幾個(gè)全新的產(chǎn)品。指南不是必須的，但你知道什么時(shí)候恰到好處。

和代碼味道一樣，也總有例外的情況。如果在設(shè)計(jì)過(guò)程中你知道如何舍棄不必要的幫助文檔、難以實(shí)現(xiàn)的界面布局和過(guò)量的圖標(biāo)，那不管怎樣你的產(chǎn)品都會(huì)提升一個(gè)檔次。

譯者：Jorri