藍(lán)藍(lán)設(shè)計(jì)( yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)

每一個(gè)扁平化界面設(shè)計(jì)，都是我們的心靈碰撞致力于最棒的 metro ui 設(shè)計(jì)

來源：人人都是產(chǎn)品經(jīng)理

         如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中，請(qǐng)點(diǎn)這里先給大家做個(gè)測(cè)試，根據(jù)下圖的流程，最后一步應(yīng)該返回哪個(gè)頁面(為了更能體現(xiàn)效果，建議大家拿出手機(jī)跟著步驟做)：

這個(gè)問題是我們?cè)谧鲆豢領(lǐng)M產(chǎn)品時(shí)遇到的，為了說明該問題的廣泛性，就拿微信舉例子了。開發(fā)GG完成了版本的交付，我們正在驗(yàn)收產(chǎn)品，到處開始找 碴，突然一測(cè)試妹紙跑過來說有個(gè)地方有問題，然后她一步步的演示給我們看：先從通訊錄隨便找個(gè)聯(lián)系人，然后進(jìn)入該聯(lián)系人詳情頁面，再次點(diǎn)擊“發(fā)消息”按鈕 進(jìn)入聊天頁面，然后她問我們：“在聊天頁面點(diǎn)擊返回應(yīng)該返回哪個(gè)頁面？”我們幾個(gè)想都沒想，下意識(shí)的回答到：“當(dāng)然返回之前的那個(gè)頁面了。”

然后妹紙細(xì)嫩的食指一點(diǎn)，這時(shí)候奇跡發(fā)生了，結(jié)果如下圖：沒有返回之前的頁面，而是返回到了消息列表頁面。

我們幾個(gè)愣了愣，然后快速把PRD文檔和交互稿都翻了出來，“到底是開發(fā)開發(fā)錯(cuò)了，還是我們?cè)O(shè)計(jì)錯(cuò)了？”。壓根兒沒想過這么做是對(duì)的，因?yàn)閺哪膬哼M(jìn) 肯定從哪出，返回肯定返回上一界面，正常的邏輯都是這樣的。然后發(fā)現(xiàn)交互稿也是這么設(shè)計(jì)的，接著快速把手機(jī)拿出來打開微信(因?yàn)楫?dāng)初就是抄的微信的，現(xiàn)在 懷疑抄錯(cuò)了)，我們又愣了，微信也是這么做的，雖然返回按鈕寫了“微信”兩個(gè)字，但是沒啥用，第一反應(yīng)還是返回上一界面。

“微信出Bug了？” “微信的設(shè)計(jì)也不一定合理吧？”各種猜疑慢慢浮出，甚至差點(diǎn)腦袋一拍決定改了(難得產(chǎn)品、交互、視覺、測(cè)試的意見如此統(tǒng)一)。還好改之前多了個(gè)心眼：“為啥微信用了這么長(zhǎng)時(shí)間，從來沒發(fā)現(xiàn)這兒不合理啊，感覺完全是無縫銜接的，一點(diǎn)疙瘩也沒有哈？”

繼續(xù)分析，根據(jù)我們的設(shè)計(jì)來，優(yōu)勢(shì)有兩點(diǎn)：

• 符號(hào)邏輯和用戶預(yù)期，從哪兒來，當(dāng)然從哪兒出，形成閉環(huán)；
• 如果我想給第二個(gè)用戶發(fā)消息，更加方便，因?yàn)榉祷氐氖怯脩粼斍?，再點(diǎn)一下又回到通訊錄了。

微信這么玩好處在哪兒了：用戶可以快速回到消息列表，不需要一步步返回。

如果僅僅分析到這兒，感覺微信這么設(shè)計(jì)還不具較強(qiáng)的說服力。

現(xiàn)在開始回到場(chǎng)景吧：小明好久沒跟小紅聯(lián)系了，最近怪想她的，于是小明準(zhǔn)備找她好好聊聊人生。首先小明進(jìn)入通訊錄，然后找到了小紅，點(diǎn)擊小紅后進(jìn)入 小紅的詳情介紹，然后又點(diǎn)擊了“發(fā)消息”進(jìn)入聊天頁面開始跟小紅暢談人生。最關(guān)鍵的來了：小明和小紅暢談了好久，該說的都說了，不該說的也說了，完全沒話 說了，這時(shí)候小明如果還留著微信app里，他下一步可能想干嘛了？

• 再找小花聊聊天？ ——聊了這么久也該累了吧，如果跟小花經(jīng)常聊天的話，應(yīng)該不需要到通訊錄再去找小花了，入口太深要點(diǎn)擊很多次，直接在消息列表找小花聊吧；
• 看看有沒有其他人找我？ ——回到消息列表；
• 看看群里有沒有什么八卦和段子？——回到消息列表；
• 看看公眾號(hào)，學(xué)習(xí)學(xué)習(xí)？——回到消息列表；
• 刷刷朋友圈？——消息列表是一級(jí)tab，更快速；
• 其他？——好像回到消息列表優(yōu)勢(shì)更明顯哈；

回到現(xiàn)實(shí)場(chǎng)景后，好像確實(shí)是這樣的，難怪用了這么久的微信都沒發(fā)現(xiàn)這兒有坑?，F(xiàn)在兩種設(shè)計(jì)方案再進(jìn)行對(duì)比的話，從邏輯上來講，確實(shí)是返回上一界面更 勝一籌；但是從用戶場(chǎng)景來看，明顯微信的方案更符合習(xí)慣和自然。后來我們又把來往、易信、陌陌拿過來試了下，也都跟微信一樣(不排除相互抄的可能)，看來 這么多的產(chǎn)品決策都是：場(chǎng)景重于邏輯。

到這里終于有人開始支持微信的方案了，但是幾個(gè)人意見還是不一致，仍有人覺得方案一更好。于是，我們做了這件事：寫了個(gè)簡(jiǎn)單的用戶測(cè)試案例，找了幾個(gè)其他項(xiàng)目組的GG和MM試了下，結(jié)果大獲全勝。

場(chǎng)景重于邏輯，其實(shí)用戶真的沒有我們想象的聰明，有時(shí)候他們壓根兒沒有邏輯。測(cè)試過程中，我們問了幾個(gè)人：你覺得返回之前的那個(gè)頁面怎么樣？  “之前是哪個(gè)頁面？” …