首先給大伙兒道個歉，上周這邊發(fā)生了些問題，網(wǎng)站掛了一陣子。一頓折騰，目前算是初步恢復(fù)了，不過評論方面的模塊還沒有打開，需要再搗鼓搗鼓，希望諒解。再次感謝在微博上給我加油和鼓勵的朋友們，還有默默關(guān)注和支持Beforweb的各位。
另外，上周網(wǎng)站掛掉之前，有位朋友留下一條評論，內(nèi)容大致是同樣喜歡SmashingMagazine的東西，喜歡做做譯文一類；由于恢復(fù)數(shù)據(jù)的時候使用了前面幾天的備份，所以這條評論蒸發(fā)了。希望這位朋友可以看到這些，特別向您道歉了。
那么開始本周譯文叭。又是一篇移動應(yīng)用設(shè)計方面的實(shí)戰(zhàn)案例，我個人很喜歡，真人真項目真事兒，更具實(shí)踐價值。走著。
今年，我們(英文原文作者及團(tuán)隊)發(fā)布了FreshBooks的第一款iPhone應(yīng)用。從前我們的產(chǎn)品一直是通過Web端應(yīng)用的方式提供服務(wù)的。這次，我們把iPhone應(yīng)用的設(shè)計開發(fā)過程看作一張空白的花布，盡力在其中實(shí)現(xiàn)一些新的功能概念和設(shè)計想法。在這個過程中，我們著實(shí)學(xué)到不少東西。
不要害怕犯錯
對于移動應(yīng)用這樣的產(chǎn)品，設(shè)計過程中必然會遇到很多用戶體驗(yàn)方面的問題與挑戰(zhàn)，尤其是對于新手來說更是如此。
無論你的線框稿在邏輯上有多縝密，UI稿在視覺上有多漂亮，當(dāng)它們落實(shí)成為原型或最終產(chǎn)品時，總會有問題呈現(xiàn)出來。這并不完全是壞事；我們在設(shè)計FreshBooks的iPhone應(yīng)用時甚至將犯錯這件事也納入到了流程規(guī)劃當(dāng)中，這就意味著：
- 坦承沒有完美的設(shè)計，無論稿件和原型多么優(yōu)秀。
- 真正的成功或失敗都是由用戶的反饋來定義的。
- 對于在設(shè)計過程中看到的問題要迅速做出反應(yīng)，根據(jù)從實(shí)際用戶身上得來的驗(yàn)證結(jié)果進(jìn)行迭代。
接下來，我將向各位描述一下我們在項目中犯過的三個錯誤，以及我們是怎樣解決這些問題的。
應(yīng)用的主界面
在項目開始的時候，我們對FreshBooks的一些現(xiàn)有用戶進(jìn)行了訪談，了解他們在生活和工作中是怎樣使用移動設(shè)備的，包括他們面對的實(shí)際問題，以及他們對移動應(yīng)用版本的FreshBooks的期望。
根據(jù)這些訪談，我們歸納出了一些基本的設(shè)計原則，例如下面這條：
以任務(wù)為中心的用戶體驗(yàn)
移動應(yīng)用版本的產(chǎn)品應(yīng)該圍繞著一系列互不相關(guān)的帳單任務(wù)進(jìn)行優(yōu)化，包括時間追蹤、為收據(jù)拍照存檔、開票等等，這些是移動應(yīng)用所處的使用場景當(dāng)中最常見的任務(wù)。
而其他方面的復(fù)雜任務(wù)，包括批量編輯、權(quán)限管理、定制化等，則留給傳統(tǒng)的Web端應(yīng)用來承擔(dān)，以此來保證移動版本在功能上的簡約與集中。
基于這條原則，我們設(shè)計了應(yīng)用的主界面。它由一系列最重要的任務(wù)組成，視覺上采用圖標(biāo)加文字標(biāo)題的形式，點(diǎn)擊進(jìn)入相應(yīng)的任務(wù)流程。例如，用戶點(diǎn)擊了其中的“創(chuàng)建新發(fā)票”之后會進(jìn)入發(fā)票列表界面，然后創(chuàng)建新發(fā)票的界面會自動滑入視圖。
這種以典型任務(wù)為中心的設(shè)計思路在意圖上是好的，但接下來我們發(fā)現(xiàn)了一些問題。
為什么會出問題
經(jīng)過可用性測試，我們發(fā)現(xiàn)被測者普遍會在主界面中產(chǎn)生困惑，因?yàn)檫@種設(shè)計方案與他們通過使用Web端的FreshBooks所建立起的心智模型不符，而且和很多其他的iPhone應(yīng)用也存在模式上的差異。
同時我們還發(fā)現(xiàn)，之前歸納出的一些典型任務(wù)，包括創(chuàng)建發(fā)票、跟蹤時間、記錄開支等，對于用戶來說，本質(zhì)上都屬于一種“創(chuàng)造”行為。從這個角度看，其實(shí)我們忽略了這個緯度上的其他一些重要任務(wù)類型，包括：
- 查看：例如查看發(fā)票狀態(tài)、查看歷史記錄等。
- 更新：例如更改發(fā)票狀態(tài)等。
這類任務(wù)需求其實(shí)比“創(chuàng)造”更加普遍，尤其是在移動設(shè)備上，用戶更加傾向于在短時間內(nèi)以最簡單高效的方式查看和更新內(nèi)容，而不是創(chuàng)造內(nèi)容。我們之前所聚焦的重點(diǎn)則恰恰相反。
解決方案
很簡單，我們改變了之前方案當(dāng)中的信息結(jié)構(gòu)，使內(nèi)容和功能的組織結(jié)構(gòu)更加符合用戶在移動應(yīng)用上下文環(huán)境中的預(yù)期。在新的設(shè)計方案中，用戶點(diǎn)擊主界面中的“發(fā)票”(之前是“創(chuàng)建新發(fā)票”)，進(jìn)入發(fā)票列表界面進(jìn)行查看；如果他確實(shí)需要創(chuàng)建新發(fā)票，那么可以點(diǎn)擊右上角的加號按鈕。
相關(guān)閱讀：產(chǎn)品早期的原型設(shè)計與用戶測試
初次使用的體驗(yàn)
我們特別為應(yīng)用初體驗(yàn)(用戶安裝應(yīng)用后第一次打開)制訂了兩條設(shè)計原則：“移動優(yōu)先”與“順暢進(jìn)入任務(wù)流程”。具體來看：
移動優(yōu)先
如今，我們不能再假設(shè)用戶是通過桌面設(shè)備上的Web瀏覽器找到我們的，他們很有可能是在移動設(shè)備上與我們發(fā)生第一次接觸的，我們不能讓這類新用戶產(chǎn)生復(fù)雜的認(rèn)知負(fù)擔(dān)。舉個例子，我們的Web端應(yīng)用可以為用戶提供定制化的子域名(youraccountsubdomain.freshbooks.com)，這顯然是專屬于Web端的概念，完全不需要在移動端體現(xiàn)出來。
我們還可以隨著產(chǎn)品價值的逐漸體現(xiàn)而將Web端的高級功能一點(diǎn)點(diǎn)的介紹給移動端用戶。
順暢進(jìn)入任務(wù)流程
要讓新用戶在打開應(yīng)用之后無需任何設(shè)置工作就可以順暢進(jìn)入任務(wù)，從而在最短的時間內(nèi)發(fā)現(xiàn)產(chǎn)品價值。
為了貫徹這些原則，我們在第一版當(dāng)中允許用戶不執(zhí)行任何注冊或登錄的操作就可以立刻在主界面當(dāng)中執(zhí)行任務(wù)(例如前面提到的創(chuàng)建發(fā)票、跟蹤時間等)，只有在功能需要的時候才會引導(dǎo)他們進(jìn)行帳戶方面的操作，例如在保存發(fā)票或收支記錄時會要求用戶創(chuàng)建帳戶或登錄。
另外在用戶選擇通過SnailMail發(fā)送發(fā)票的時候也會如此。
為什么會出問題
我們的用心是好的，但是在可用性測試中，我們發(fā)現(xiàn)被測者們更期望在應(yīng)用加載之后首先進(jìn)行注冊或登錄；直接讓他們進(jìn)行操作反而會引發(fā)他們的疑慮，例如數(shù)據(jù)怎樣保存？
這種先操作后注冊/登錄的方式也許相對有新意一些，而且會適合于某些類型的應(yīng)用，但對于我們的產(chǎn)品來講還是過于激進(jìn)了。
解決方案
最后我們采用了一種相對傳統(tǒng)但更加符合用戶預(yù)期、可以給他們帶來安全舒適感覺的方案，也就是一開始就向他們提供三個明確的選項：
- 創(chuàng)建新帳戶
- 登錄已有帳戶
- 直接試用
如果用戶覺得自己已經(jīng)準(zhǔn)備好了，那么可以進(jìn)行注冊和登錄操作；他們還可以在不登錄的情況下先試用，以便對產(chǎn)品進(jìn)行更全面的了解。
相關(guān)閱讀：初創(chuàng)型團(tuán)隊容易在用戶體驗(yàn)方面犯的十個錯誤
移動版與Web版的功能差別
我們在設(shè)計流程開始之前詳細(xì)規(guī)劃了移動版產(chǎn)品在初期的功能范圍，也就是對我們的最小化可行產(chǎn)品(MVP)的形態(tài)進(jìn)行界定。我們相信：
- 在功能范圍上未經(jīng)詳細(xì)定義的移動版產(chǎn)品(特別是第一版)具有很大的風(fēng)險，在設(shè)計開發(fā)流程中將產(chǎn)生極大的不確定性。
- 在初期對產(chǎn)品功能范圍進(jìn)行合理的界定，將有助于那些基于市場及用戶研究所得出的核心需求被更加準(zhǔn)確的落實(shí)到最終產(chǎn)品當(dāng)中。
- 早已投放市場并經(jīng)過驗(yàn)證的Web端產(chǎn)品功能無法代表移動版的需求。移動應(yīng)用有其特定的使用環(huán)境和場景。
- 移動版本中的某些功能會依賴于Web端。提前做好規(guī)劃工作，將有助于開發(fā)工作的順利進(jìn)行。例如，移動版特有的為收據(jù)拍照的功能要求Web端必須具有相應(yīng)的功能支持，包括查看收據(jù)照片等等。
不過，正像在前文中提到的，我們曾經(jīng)假設(shè)用戶最想要的是快速創(chuàng)建內(nèi)容。因此，在界定功能的時候，我們基于這個錯誤的假設(shè)將核心功能限制在了這個范圍當(dāng)中。
報表
以財務(wù)報表為例，這是FreshBooks的Web版本當(dāng)中的一個核心功能，但由于其規(guī)范化的格式難以適應(yīng)移動設(shè)備的界面規(guī)格，加之我們初期一直將重心放在“創(chuàng)造內(nèi)容”上，所以我們決定在移動版當(dāng)中舍棄掉這個功能。
為什么會出問題
財務(wù)報表其實(shí)是財務(wù)軟件當(dāng)中非常重要的一部分。我們在界定功能范圍的時候?qū)⑦@部分功能從移動版當(dāng)中移除，結(jié)果在可用性測試中發(fā)現(xiàn)這完全不符合被測者們對于一個功能完整的財務(wù)軟件的認(rèn)知與期望。
另外我們也意識到，在現(xiàn)實(shí)中，如果移動版的產(chǎn)品當(dāng)中不包含這項功能，那么新用戶很有可能根本無法了解到其實(shí)我們的Web版應(yīng)用是提供了這個功能的，他們?yōu)榇硕艞壴摦a(chǎn)品的幾率會變的很大。
解決方案
我們顯然不是平白無故將報表功能從移動版本當(dāng)中移除的，它在呈現(xiàn)方式上確實(shí)存在著難以解決的問題，但實(shí)際上這個問題并非一定要被解決——通過進(jìn)一步思考，我們認(rèn)為用戶的真正目標(biāo)并不是一定要在移動設(shè)備上看到報表，對他們來說最重要的是了解到有這樣一個功能存在，以及可以怎樣去查看這些內(nèi)容。
最終，我們決定在移動端增加報表的入口，用戶點(diǎn)擊后會被引導(dǎo)進(jìn)行注冊或登錄。已經(jīng)處于登錄狀態(tài)的用戶可以選擇“將報表發(fā)到我的郵箱”或“在iPhone的Safari瀏覽器中直接查看”，同時界面還會提示用戶，瀏覽報表的最佳方式是使用臺式設(shè)備。
相關(guān)閱讀：
總結(jié)
勇于挖掘并面對設(shè)計當(dāng)中的錯誤與問題，并思考相應(yīng)的解決方案，這是不斷提升產(chǎn)品價值及用戶體驗(yàn)的關(guān)鍵要素。提出假設(shè)、與真實(shí)的用戶進(jìn)行溝通、驗(yàn)證假設(shè)并發(fā)現(xiàn)問題、思考解決方案、迭代——是我們在設(shè)計工作當(dāng)中應(yīng)該保持的良好節(jié)奏。