編輯導(dǎo)語(yǔ)：有的產(chǎn)品設(shè)計(jì)追求復(fù)雜，一點(diǎn)進(jìn)去滿(mǎn)屏的設(shè)計(jì)感，“琳瑯滿(mǎn)目”的功能呈現(xiàn)在眼前；而有的設(shè)計(jì)則追求簡(jiǎn)約，力求通過(guò)簡(jiǎn)單帶給用戶(hù)不簡(jiǎn)單的體驗(yàn)。在本篇文章中，作者為我們總結(jié)了關(guān)于簡(jiǎn)約至上的產(chǎn)品設(shè)計(jì)中百試不爽的三條法則！

上一篇文章，我們溝通了簡(jiǎn)約設(shè)計(jì)的第一條策略：刪除不必要的！當(dāng)我們?cè)陬^腦風(fēng)暴階段，確定了要?jiǎng)h除哪些不必要的功能或者信息之后，具體界面的設(shè)計(jì)，自然就成為了接下來(lái)的工作重心。

此時(shí)想要達(dá)到簡(jiǎn)約的目標(biāo)，我們可以運(yùn)用三條百試不爽的法則：組織要提供的；隱藏非核心的；轉(zhuǎn)移不擅長(zhǎng)的。

大家可以先記住這三條法則，要知其究竟所謂何意，且聽(tīng)我慢慢道來(lái)~

一、內(nèi)容回顧

大家還記得“刪除不必要”的策略中，有哪些重點(diǎn)內(nèi)容么？讓我們先來(lái)回顧一下：

• 在抉擇的時(shí)候，我們可以嘗試把思考的問(wèn)題聚焦于“為什么要保留它，保留它需要付出多少邊際成本”；而不是僅僅盯著“為什么要去掉它，去掉它損失了多少沉沒(méi)成本”；
• 不要指望用戶(hù)可以通過(guò)自身的學(xué)習(xí)來(lái)避免錯(cuò)誤，因?yàn)檫@不是用戶(hù)需要承擔(dān)的職責(zé)；
• 我們作為設(shè)計(jì)人員，應(yīng)該想方設(shè)法減去造成錯(cuò)誤的來(lái)源，將錯(cuò)誤扼殺在搖籃之中，這才是提升用戶(hù)體驗(yàn)的重要途徑；
• 聰明的默認(rèn)值可以減少用戶(hù)的選擇，有效地節(jié)省用戶(hù)的時(shí)間和精力！真正智能的默認(rèn)值會(huì)“關(guān)注”用戶(hù)在做什么，然后預(yù)測(cè)用戶(hù)接下來(lái)的行動(dòng)。

二、組織要提供的

接下來(lái)就讓我們進(jìn)入今天的正題。面對(duì)具體的界面設(shè)計(jì)，想要簡(jiǎn)約的話，首先需要做的一件事，就是“組織要提供的”。

組織要提供的，只看這五個(gè)字的話，真的是不明所以，不瞞各位，我也是這樣的。然而這只是用了“倒裝句”的障眼法而已！當(dāng)我們換一種說(shuō)法，立馬就能將它打回原形：“提供的內(nèi)容需要組織”。

別問(wèn)我為什么要用“倒裝句”，問(wèn)的話，那就是為了保障幾條法則的工整，僅此而已…

那“提供的內(nèi)容”是指什么呢？自然就是在功能概設(shè)階段的這些產(chǎn)出物，比如腦圖啊，流程圖啊，以及需求文檔之類(lèi)的。這就是所謂“要提供的”。

而功能詳設(shè)階段，即當(dāng)我們要設(shè)計(jì)界面的時(shí)候，也自然需要對(duì)這些概念類(lèi)的東西進(jìn)行有效地“組織”！

那么問(wèn)題來(lái)了，面對(duì)這些產(chǎn)出物，我們?cè)撊绾谓M織呢？其實(shí)在交互設(shè)計(jì)層面，我們可以從這兩個(gè)方面進(jìn)行著手：分塊 and 填充。

1. 分塊

“分塊”這個(gè)概念，大家或許略顯陌生。但當(dāng)我提及另外一個(gè)詞匯的時(shí)候，大家肯定是耳熟能詳，并且能夠立馬領(lǐng)會(huì)到“分塊”的含義。這個(gè)詞匯就是“功能模塊”。

用戶(hù)界面的設(shè)計(jì)離不開(kāi)分塊。仔細(xì)觀察每一個(gè)產(chǎn)品的界面，我們就會(huì)發(fā)現(xiàn)，所有的界面都是由一塊一塊的內(nèi)容組裝起來(lái)的，而且這些模塊之間，往往是楚河漢界，涇渭分明。

那么一個(gè)界面，到底劃分為多少“塊”合適呢？答案是一個(gè)神奇的數(shù)字：7加減2。這個(gè)數(shù)字的背后，是經(jīng)典的交互設(shè)計(jì)七大定律之7加減2法則。

所謂的7±2法則正式提出于美國(guó)心理學(xué)家George A. Miller1956年發(fā)布的論文《神奇的數(shù)字7加減2：我們加工信息能力的某些限制》。

即1956年喬治米勒對(duì)短時(shí)記憶能力進(jìn)行了定量研究，他發(fā)現(xiàn)人類(lèi)頭腦最好的狀態(tài)能記憶含有7(±2)項(xiàng)信息塊，在記憶了5-9項(xiàng)信息后人類(lèi)的頭腦就開(kāi)始出錯(cuò)。

我們來(lái)看一下實(shí)際的案例：

（web端：人人都是產(chǎn)品經(jīng)理）

人人都是產(chǎn)品經(jīng)理的頂部table是八個(gè)模塊：

（移動(dòng)端：微信）

微信的底部table是四個(gè)模塊。

這兩個(gè)案例已經(jīng)足夠典型，如果我們?cè)倮^續(xù)觀察互聯(lián)網(wǎng)界內(nèi)其他典型的設(shè)計(jì)案例的話，我們會(huì)得出這樣的結(jié)論：PC端頂部導(dǎo)航，不會(huì)超過(guò)9個(gè)，而移動(dòng)端底部導(dǎo)航，則不會(huì)超過(guò)5個(gè)！

最后再補(bǔ)充一句，我們上述說(shuō)明了，米勒發(fā)現(xiàn)人類(lèi)頭腦最好的狀態(tài)能記憶含有5-9項(xiàng)信息塊。這里并非說(shuō)我們最少要?jiǎng)澐殖?塊，微信就是最好的例子。

有不少心理學(xué)家認(rèn)為，人類(lèi)的瞬間記憶存儲(chǔ)空間其實(shí)更小，大約只有4項(xiàng)。我們作為設(shè)計(jì)人員，應(yīng)該盡可能地少分幾塊，分塊越少，選擇越少，用戶(hù)負(fù)擔(dān)就越輕。

2. 填充

“填充”與“分塊”并非是一前一后的割裂關(guān)系，它們只是思考一個(gè)問(wèn)題的兩個(gè)不同維度而已，二者是一種水乳交融的狀態(tài)。

我們?cè)诜謮K的時(shí)候，需要考慮在這些模塊中填充哪些內(nèi)容；而我們?cè)谔畛鋬?nèi)容的時(shí)候，也同時(shí)需要思考界面劃分成了哪幾塊。

那么我們“填充”的時(shí)候，有什么依據(jù)可循呢？這里啊，我們需要先回憶兩個(gè)概念：業(yè)務(wù)流程+任務(wù)流程。

所謂的業(yè)務(wù)流程，是指客觀的，用戶(hù)在沒(méi)有產(chǎn)品的時(shí)候，原本做事情的流程；而所謂的任務(wù)流程，是指主觀的，是由設(shè)計(jì)師設(shè)計(jì)的，用戶(hù)在使用產(chǎn)品的時(shí)候，所經(jīng)歷的流程。

通常來(lái)說(shuō)，我們的任務(wù)流程，應(yīng)當(dāng)盡量與業(yè)務(wù)流程一致，或者是在業(yè)務(wù)流程的基礎(chǔ)上優(yōu)化。因?yàn)槿藗兌枷Ｍ凑漳撤N習(xí)慣的步驟做事，打亂這個(gè)步驟就會(huì)造成迷惑，令人沮喪。

例如網(wǎng)上商店會(huì)讓用戶(hù)自己查找想要購(gòu)買(mǎi)的商品，然后把商品添加到購(gòu)物車(chē)中，設(shè)置送貨方式，最后付款結(jié)賬。

這就是對(duì)于網(wǎng)上商店功能模塊進(jìn)行內(nèi)容填充的基本依據(jù)。

三、藏非核心的

大家在設(shè)計(jì)產(chǎn)品的過(guò)程中，是不是也會(huì)碰到，有一些功能會(huì)很少用到，但是又少不了？對(duì)于這種非核心的功能，我們就想辦法把它藏起來(lái)吧~

“隱藏”和我們上面所說(shuō)的“組織”比起來(lái)，有一個(gè)明顯的優(yōu)勢(shì)：用戶(hù)不會(huì)因?yàn)椴怀Ｓ玫墓δ芏稚⒆⒁饬Γ?/p>

這里總結(jié)六種常見(jiàn)的隱藏菜單的交互設(shè)計(jì)，大家快來(lái)收藏吧：

1. 側(cè)欄菜單

應(yīng)用于頂級(jí)菜單，適合大部分產(chǎn)品：

• 優(yōu)點(diǎn)：容易理解，能夠容納較多信息，可以結(jié)合手勢(shì)。
• 缺點(diǎn)：只能用于頂級(jí)菜單或?qū)Ш健?/li>

2. 浮鈕菜單

應(yīng)用于頁(yè)面菜單。因?yàn)榉至恐?，適合工具類(lèi)、重操作的產(chǎn)品，例如P圖軟件。如果是重內(nèi)容的閱讀類(lèi)產(chǎn)品，就不太合適了。

• 優(yōu)點(diǎn)：很顯眼，容易操作。
• 缺點(diǎn)：對(duì)不需要隱藏菜單的用戶(hù)過(guò)重了，可能誤操作。

3. 更多菜單

應(yīng)用于模塊菜單，可以擺放的位置很多。

• 優(yōu)點(diǎn)：輕便靈活，可以在模塊邊緣輕松找到位置。
• 缺點(diǎn)：不太起眼、如果前面沒(méi)有其它圖標(biāo)會(huì)難理解一點(diǎn)。

4. 滑出菜單

應(yīng)用于列表菜單，也是 iOS 上很常見(jiàn)的一種設(shè)計(jì)規(guī)范。

• 優(yōu)點(diǎn)：操作方便，容易理解。
• 缺點(diǎn)：可以放置的操作數(shù)量非常有限。必須左右通欄上下較矮的列表才適用，高一點(diǎn)，或不通欄的卡片都不行。

5. 單擊菜單

應(yīng)用于模塊/按鈕/圖標(biāo)菜單，只適合沒(méi)有主要操作（如通常不需要進(jìn)入下一級(jí)），用戶(hù)操作意圖不明確的情況。

• 優(yōu)點(diǎn)：容易發(fā)現(xiàn)，操作快捷。
• 缺點(diǎn)：放棄主操作存在風(fēng)險(xiǎn)。

6. 長(zhǎng)按菜單

應(yīng)用于模塊/按鈕/圖標(biāo)菜單，適合輔助操作較為明確的場(chǎng)景，如掃碼、下載圖片等。

• 優(yōu)點(diǎn)：對(duì)產(chǎn)品本身的布局和基礎(chǔ)操作影響較小。
• 缺點(diǎn)：較為隱晦，需要用戶(hù)主動(dòng)嘗試觸發(fā)。

四、轉(zhuǎn)移不擅長(zhǎng)的

我個(gè)人一直秉持的一個(gè)觀點(diǎn)是：專(zhuān)業(yè)化分工，是提升效率的有效途徑。

例如在工作中，我不會(huì)去插手UI，或者是開(kāi)發(fā)所做出的判斷。我最多只是從我所處的角度提出反饋，僅此而已。我從心中認(rèn)定，他們是專(zhuān)業(yè)的，他們的判斷，肯定是要優(yōu)于我個(gè)人的主觀臆斷。

產(chǎn)品設(shè)計(jì)，同樣需要遵從這樣的原則。不同設(shè)備之間，有各自擅長(zhǎng)的內(nèi)容；人與設(shè)備之間，也有各自擅長(zhǎng)的內(nèi)容。

我們需要做的，就是將產(chǎn)品使用過(guò)程中那些不得不做的事情，轉(zhuǎn)移至最擅長(zhǎng)的一方進(jìn)行處理。

1. 桌面設(shè)備、移動(dòng)設(shè)備、可穿戴設(shè)備特性比對(duì)

舉一個(gè)簡(jiǎn)單的例子，在越來(lái)越注重健康的當(dāng)代，智能手表成功捕獲了不少人的芳心。

只要在手表上點(diǎn)擊一下“GO”，它就會(huì)自動(dòng)計(jì)算你總共跑了多遠(yuǎn)、每一英里所用時(shí)間、你的心率，以及消耗了多少卡路里等等。

在手機(jī)上下載相關(guān)的應(yīng)用，點(diǎn)擊一下“GO”的按鈕，也同樣可以獲取到相關(guān)的數(shù)據(jù)。但跑步時(shí)帶著手機(jī)就略顯笨重，并且手機(jī)讀取不到你的心率。

如果是我們把設(shè)備換成電腦，那我們只能先通過(guò)某種方式，把數(shù)據(jù)先記錄下來(lái)，然后再通過(guò)表單填寫(xiě)各種相關(guān)的數(shù)據(jù)了…因?yàn)槲覀儾豢赡軒е娔X去跑步…

然后，在回看或者分享數(shù)據(jù)時(shí)，最簡(jiǎn)單的方式就是坐在桌子前，打開(kāi)筆記本電腦，或者通過(guò)大屏幕來(lái)查看詳細(xì)的數(shù)據(jù)分析。

在手機(jī)上可以把數(shù)據(jù)分享給朋友，也可以找到詳細(xì)的數(shù)據(jù)分析，只不過(guò)它們一般藏的很深。

而智能手表只能顯示摘要信息，不能與朋友分享。

2. 人與計(jì)算機(jī)特性比對(duì)

雙十一購(gòu)物時(shí)，親身體會(huì)到了“轉(zhuǎn)移不擅長(zhǎng)”的策略，在人與計(jì)算機(jī)之間的體現(xiàn)。

填寫(xiě)收貨地址，想必是很多人很厭煩的事情。而現(xiàn)在很多產(chǎn)品，都把這件事情優(yōu)化的很好了。其核心就是，把一些復(fù)雜或者是麻煩的事情，轉(zhuǎn)移給計(jì)算機(jī)去做。

就比如京東填寫(xiě)收貨地址的時(shí)候，我們只需三步，就能夠獲取到當(dāng)前的地址了，而不是跟之前一樣，在一個(gè)個(gè)下拉列表框里面，去費(fèi)勁地尋找…

用戶(hù)指揮，計(jì)算機(jī)操作，會(huì)給人簡(jiǎn)單的感覺(jué)！

五、結(jié)語(yǔ)

以上就是我們簡(jiǎn)約設(shè)計(jì)專(zhuān)題的所有內(nèi)容了。讓我們保持良好的習(xí)慣，最后再來(lái)一起做一下總結(jié)吧：

• 首先呢，我們一起交流了簡(jiǎn)單的哲學(xué)，讓我們知道了簡(jiǎn)單只是手段，而不是目的，簡(jiǎn)單的設(shè)計(jì)理念，應(yīng)該是先做加法再做減法，是經(jīng)過(guò)痛苦的衡量和抉擇之后的結(jié)果；
• 然后呢，我們又溝通了愿景是簡(jiǎn)單的指南，我們學(xué)會(huì)了用講故事的方式來(lái)表達(dá)愿景，明白了愿景的設(shè)定，應(yīng)該是一個(gè)經(jīng)過(guò)反復(fù)“猜測(cè)—>求證—>提煉”的螺旋式上升的過(guò)程；
• 最后呢，我們相繼討論了簡(jiǎn)約設(shè)計(jì)的四個(gè)策略：刪除不必要的，組織要提供的，隱藏非核心的，以及轉(zhuǎn)移不擅長(zhǎng)的。

此系列專(zhuān)題的解讀，對(duì)于非交互設(shè)計(jì)師出身，而只是一個(gè)B端產(chǎn)品經(jīng)理的我來(lái)說(shuō)，整個(gè)過(guò)程真的是異常艱難。

而且《簡(jiǎn)約至上》這本書(shū)，更像是一篇散文集，讀起來(lái)讓我覺(jué)得每句都是重點(diǎn)，但是滿(mǎn)眼皆是瑣碎。

這也讓我不得不查閱大量的其他內(nèi)容，才能夠理解書(shū)中表達(dá)的深意。我們的整個(gè)的解讀，有大概60%都是非書(shū)中的內(nèi)容。

我已經(jīng)盡我最大努力，將所有的知識(shí)點(diǎn)連貫起來(lái)，并且盡量保證能夠運(yùn)用到我們的實(shí)際工作當(dāng)中。此過(guò)程之中，有什么做的不好的地方，還請(qǐng)大家多多見(jiàn)諒，畢竟我也是在不斷學(xué)習(xí)，不斷成長(zhǎng)的。

作為產(chǎn)品經(jīng)理，我們不僅僅要關(guān)注需求，保證用戶(hù)體驗(yàn)也是必備的技能與必須的責(zé)任。相信此系列專(zhuān)題的內(nèi)容，也一定會(huì)讓大家有所提升的吧。

不論如何，我們終究是又占下了一座山頭。在交互設(shè)計(jì)的層面，我們也是有實(shí)際的方法論可實(shí)踐，可遵循的了。

但我們前行的腳步永遠(yuǎn)不會(huì)停止。接下來(lái)我們要研究一下哪方面的內(nèi)容呢？

• 初步想法四方面
• 用戶(hù)增長(zhǎng)系列
• 團(tuán)隊(duì)管理系統(tǒng)
• 商業(yè)模式系統(tǒng)
• 產(chǎn)品經(jīng)理要懂的技術(shù)知識(shí)系列

你們想研究哪個(gè)系專(zhuān)題列呢？在留言區(qū)告訴我吧，讓我來(lái)幫大家解讀！

#專(zhuān)欄作家#

曉莊同學(xué)；公眾號(hào)：曉莊同學(xué)產(chǎn)品筆記，人人都是產(chǎn)品經(jīng)理專(zhuān)欄作家?；ヂ?lián)網(wǎng)老兵，各大平臺(tái)專(zhuān)欄作者。

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

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