編輯導(dǎo)語：產(chǎn)品的用戶體驗一直是比較重要的一部分，產(chǎn)品最終服務(wù)于用戶，所以對于產(chǎn)品的各方面設(shè)計帶來的用戶體驗也是不可缺少的，用戶體驗也能從多個方面進行體現(xiàn)；本文作者分享了關(guān)于從XMind與MindMaster的交互比較中談用戶體驗，我們一起來了解一下。

當(dāng)談及用戶體驗的時候，每個人似乎都能說上兩句，那么到底什么是用戶體驗?zāi)兀?/p>

大家先來看看兩個常用模型：

Peter Morville在《The User Experience Honeycomb》里提到，他認為用戶體驗包含7個模塊，包括有用、可用、滿意、可尋、可接近、信任和價值，可以用蜂巢模型來體現(xiàn)。

還有一個更經(jīng)典的五層模型，由Jesse James Garrett 在《用戶體驗要素》里提出，他認為用戶體驗包含五個要素，可以用五層模型來體現(xiàn)，包括表現(xiàn)層、框架層、結(jié)構(gòu)層、范圍層、戰(zhàn)略層。目前被廣泛用于產(chǎn)品設(shè)計和產(chǎn)品分析。

可以看出，不論蜂巢模型，還是五層模型，其實都加入了商業(yè)和戰(zhàn)略層面的考量；這無可厚非，畢竟做一款產(chǎn)品本質(zhì)是在做一門生意。

但如果單純從用戶體驗角度出發(fā)，那么兩個模型中的部分維度分析是不必要的，至少對于普通用戶來說意義不大；畢竟用戶和界面的交互，才是用戶可以直接感知到的，也是用戶體驗最主要的來源。

因此，筆者這篇文章主要從用戶與界面的交互（即UX）出發(fā)，在對XMind與MindMaster（兩款非常相似的國產(chǎn)思維導(dǎo)圖軟件）的交互比較中談?wù)勎覍τ脩趔w驗的進一步理解。

為了說點大家都能看懂的大白話，筆者把交互劃分為操作前、操作中、操作后三個流程，各個流程的要求是操作前要信息明確、操作中要反饋及時、操作后要進行操作返回。

01 操作前要信息明確

信息明確，就是要求功能組價擺放合理、信息傳達準確高效。它類似蜂巢模型提出的可尋和可接近，你不僅要讓用戶能找到他們需求的東西，還要能讓用戶方便地完成操作、達成目的。

要想做到信息明確，可以從指示明確、減少疑惑、信息可見這三個方面出發(fā)。

1. 指示明確

所謂指示明確，典型如路牌，就是你順著路牌的指示就能順利到達目的地（忽略那些坑爹的路牌）。放到軟件上，就是你順著軟件的提示就能方便完成操作。

整體上看，兩款軟件大多功能的指示都比較明確，但也存在部分指示不明的細節(jié)。

先說體驗友好的部分，比如MindMaster“文件”頁左上方的返回按鈕，采取了用戶習(xí)慣的“←”符號，大家基本都知道是返回的意思，表意清晰。

又比如將鼠標(biāo)懸停在常用功能的icon上方，兩款軟件都會顯示懸浮窗口，對該功能進行解釋說明并且介紹對應(yīng)的快捷操作?？梢悦黠@降低用戶的學(xué)習(xí)成本。

但也恰恰在這個令人稱道的交互上，兩款軟件又都表現(xiàn)出讓用戶比較迷惑的細節(jié)。

比如：XMind懸浮窗口對組合快捷鍵的展現(xiàn)，用空格鍵替代了用戶更為熟悉的加號鍵；而后者，又同時出現(xiàn)在用它的菜單下拉列表中，這不符合一致性原則，容易造成指示混亂。

MindMaster的“子主題”懸浮窗口展現(xiàn)了三種快捷鍵，其中Tab鍵用了從視覺上極易混淆的“→”圖形（該圖形指代Tab鍵是筆者自己試錯出來的），其它兩個快捷鍵用的卻是正常的字母符號。

2. 減少疑惑

減少疑惑，就是盡可能讓界面，以及界面中的圖標(biāo)/文字清晰明了，以便用戶快速發(fā)現(xiàn)自己想要的功能。

先看界面的頂部菜單欄。XMind和MindMaster的功能都比較多，但功能一多，用戶找起來就不太方便；為了更好處理這一場景，兩款軟件采取了不同的菜單導(dǎo)航策略。

XMind的菜單導(dǎo)航可以分為兩部分（如下圖）：

區(qū)域1：文章Tab，點擊可開展浮動小列表，這里折疊了XMind的大部分功能（理論上是相對不太常用的功能）；隨之會帶來另一個問題，如果用戶常用功能在小列表里，用戶就需要反復(fù)操作，成本相對是比較高的。

區(qū)域2：常用功能區(qū)，放置了用戶常用的功能，主要以“上圖形下文字”的形式呈現(xiàn)。結(jié)合區(qū)域1提及的問題，或許可以將其優(yōu)化為“自定義”，支持用戶將自己常用的功能添加到該功能區(qū)。

MindMaster界面頂部采取的是分段控件導(dǎo)航欄：點擊主菜單，就會展現(xiàn)該菜單下的功能集，同時收起其他所有菜單，保持當(dāng)前菜單的聚焦。

這種布局和Office非常接近，于用戶而言，學(xué)習(xí)成本是比較低的。

這兩種菜單導(dǎo)航策略，其實很難說誰更優(yōu)。在我看來，菜單導(dǎo)航策略本質(zhì)是一道乘法題，等式右邊的值是固定的，但等式左邊的兩個乘數(shù)是可以變化的，只不過兩者是此消彼長的關(guān)系。

接著是界面的側(cè)邊欄，兩款軟件依然采取了不同的展現(xiàn)策略。

XMind側(cè)邊格式欄默認折疊，點擊后展開，展開后icon變灰，顯示在用狀態(tài)。由于用戶經(jīng)歷了從折疊到展開的過程，相當(dāng)于已經(jīng)完成了對用戶的教育，用戶基本可以無障礙了解到“二次點擊icon可以實現(xiàn)從展開到折疊”的事實。

MindMaster側(cè)邊格式欄默認展開，雖然于用戶初始學(xué)習(xí)成本較低，但它存在表意不明的問題。

經(jīng)測試，用戶可以點擊右側(cè)類似圖釘?shù)膇con進行折疊，但由于icon表意不明，用戶較難發(fā)現(xiàn)這一功能的存在（與我們開篇蜂窩模型中提到的可尋和可及的目標(biāo)是背道而馳的）。

3. 信息可見

信息可見，是指用戶在開始操作前就能預(yù)知到操作的結(jié)果，讓用戶對即將開始的操作有整體的感知，以便省去多余的反復(fù)試錯過程。

大家可能會覺得這是不言自明的，但恰恰就是這種看起來特別基本的要求，很多產(chǎn)品都做不到。用戶找不到信息、不知道當(dāng)前的情況，不明白發(fā)生了什么；比如很多產(chǎn)品的空白頁是下圖這樣子的，你甚至都不知道是在加載中，還是本來就沒有內(nèi)容。

而好的空白頁，應(yīng)該是有可見信息的，比如在XMind打開圖庫模板時，軟件的空白頁會用動態(tài)的圓圈+文字“正在打開…”顯示狀態(tài)；在MindMaster模板社區(qū)查看一張比較大的思維導(dǎo)圖時，軟件的空白頁同樣會用動態(tài)的logo顯示正在加載中。

還有的加載頁，會先顯示一張偽縮略圖，比如打開美團外賣小程序時的加載頁，用戶可以提前感知到當(dāng)前正在加載的信息大致是怎樣的。

此外，XMind和MindMaster在界面底部會顯示當(dāng)前思維導(dǎo)圖的主題數(shù)，類似Word顯示當(dāng)前文檔字數(shù)，也是一種信息可見的方式，方便用戶了解自己的進度。

02 操作中反饋及時

是通過視覺、聽覺、觸覺等感官體驗，讓用戶感受到自己的操作是有效的、可執(zhí)行的。

1. 視覺反饋

視覺反饋是當(dāng)下最常見的，它包括表現(xiàn)狀態(tài)的視覺反饋，起提示作用的視覺反饋，以及起警示作用的視覺反饋。

表現(xiàn)狀態(tài)的視覺反饋：如XMind和MindMaster在導(dǎo)出文件圖片時，都會彈出導(dǎo)出進度條；前者是不帶數(shù)字的長方形，后者是不帶數(shù)字的小圓圈，都是為了讓用戶意識到信息正在導(dǎo)出中，導(dǎo)出行為是運行中的。

當(dāng)圖片導(dǎo)出完成后，MindMaster導(dǎo)出的文件會直接打開，而XMind不會，前者這種反饋無疑更直接，對于希望快速查看結(jié)果的用戶來說是便捷的。

起提示作用的視覺反饋：打開MindMaster移動端云文件的時候，系統(tǒng)消息會以懸浮窗的形式高知用戶“同步成功”，如果未聯(lián)網(wǎng)，則會顯示“同步失敗”，給用戶明確的操作成功反饋。

XMind和MindMaster都是采取“基礎(chǔ)免費+關(guān)鍵功能付費”的模式，在用戶觸發(fā)付費功能時，系統(tǒng)會彈出“無法使用”的交互說明，給與用戶明確的提示及后續(xù)操作指引。

起警示作用的視覺反饋：最常見的就是未保存文件的關(guān)閉提醒，因為該操作不可逆且會造成可能有損失的后果，所以兩款軟件都加入了警示性視覺反饋，并且默認選項都是“保存”。

2. 聽覺反饋、觸覺反饋

操作的反饋信息有時候如果光靠視覺反饋會造成頁面繁復(fù)的情況，帶來較差的用戶體驗，這時可以用聽覺反饋或觸覺反饋代替視覺反饋，同樣能給用戶帶來操作提示。

不過經(jīng)筆者測試，兩款軟件目前都沒有聽覺反饋和觸覺反饋的操作。

為了方便大家理解這兩種感官反饋，筆者想借MindMaster的語音輸入功能提個小建議，比如可以在長按語音輸入時讓手機同時出現(xiàn)輕微短暫的震動（類似微信目前的語音輸入），告知用戶語音輸入正在開始。

03 操作后可返回

操作后可返回是指一個操作流程結(jié)束后進行的復(fù)位操作，這要求其交互邏輯要清晰，同時還要兼顧到流程的簡便性。

返回的種類可分為返回、關(guān)閉、完成三大類：

• 返回一般是指返回上一級界面（比如前面介紹“指示明確”時提到的MindMaster的“返回”）；
• 關(guān)閉則指關(guān)閉當(dāng)前界面結(jié)束整個功能場景（最典型的就是每個頁面右上角的“×”按鈕）；
• 完成則是在功能流程處于完成狀態(tài)進行的關(guān)閉功能流程操作（比如前面提到的XMind的進度條跑完后會自動關(guān)閉進度條浮窗然后跳轉(zhuǎn)至下一頁面）。

除了前面提到的，筆者測試發(fā)現(xiàn)，XMind和MindMaster都有全屏功能，但后者在“操作后可返回”這一點上并沒有做得很好，至少筆者覺得是存在優(yōu)化空間的。

XMind全屏模式的關(guān)閉按鈕放置在用戶習(xí)慣的右上角，而且用“退出”的文字按鈕表示，非常容易識別；而MindMaster全屏模式的關(guān)閉按鈕放置在非用戶慣常操作的左下角，且“退出”圖形按鈕和“隱藏工具條”圖形按鈕具有迷惑性（與前面提到的“指示明確”和“減少疑惑”是相悖的），用戶無法快速完成退出操作。

04 寫在最后

XMind和MindMaster的交互對比就到這里了。我們回到今天的主題：用戶體驗。

筆者理解的用戶體驗，沒有那么多模型和高大上的東西，就是要讓用戶覺得自然，讓用戶付出最小成本就能滿足需求；因此筆者在文章對比突出了兩款軟件中不自然的、增加用戶使用成本的交互操作。

誠然，XMind和MindMaster在整體交互上做的都不錯，但讓筆者和大部分用戶很迷惑的是，兩者在一些小細節(jié)卻都“翻車”了。

在筆者看來，這是各自產(chǎn)品經(jīng)理在設(shè)計過程中不經(jīng)意流露出的對用戶的傲慢；因為不經(jīng)意，所以很難被產(chǎn)品經(jīng)理自己發(fā)現(xiàn)，但在用戶側(cè)，卻會帶來不少體驗煩惱。

騰訊馬化騰非常推崇的《Don’t make me think》，從書名做字面上的理解，也是這個意思：自然的體驗是不需要用戶去思考的。

以上。

本文由 @進擊的小白 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議