產(chǎn)品設計：如何讓功能既靈活又簡單?

我們在網(wǎng)頁上進行搜索時，會發(fā)現(xiàn)只用關鍵詞就可以找到自己想要的內(nèi)容，或者剛輸入關鍵詞下面就會出現(xiàn)一些有聯(lián)系的內(nèi)容，十分方便快捷;本文作者分享了怎么讓功能變得即靈活又簡單，我們一起來學習一下。

 

 

一、為什么這是個問題?

功能設計是產(chǎn)品經(jīng)理最基本的技能，也是產(chǎn)品最基本的組成部分和價值所在。

所以，不管是在工作中，還是在面試中，一個功能設計得太復雜或者太雞肋，都會直接拉低別人對你的印象分!!!

但在產(chǎn)品設計中，靈活與簡單這兩個特性確實常常是沖突的。

尤其是在工具型產(chǎn)品中，我們想把功能設計得很靈活，就常常會用起來很復雜;如果想設計得很簡單，又會減少功能性，顯得很雞肋。

當然還有個辦法，就是在簡單的功能中加入機器學習模型;不過如果團隊自身積累不足，這個辦法的投入就太高而價值又太小，不是個好辦法。

舉個例子：在當今的產(chǎn)品中，包含的信息越來越多、越來越復雜，所以搜索功能就越來越重要了。

在搜索功能上，我們既希望能夠足夠靈活(比如支持各種條件組合，支持“與或非”等等)，又希望足夠簡單(像普通文字輸入一樣)。

怎么辦呢?

這是一個比較典型的困境，我們來看看百度、Google等通用搜索引擎是怎么做的。

它們在“簡單”上做得很出色，當需要多個關鍵詞時，只需要用空格隔開就可以了。

 

 

還不錯對吧?但是，再看看它們應對“靈活”的高級搜索功能……

 

 

這里確實提供了足夠的靈活性，但整個設計就崩塌了;因為從1個輸入框變成了10項配置，太復雜了!!!

那么如果加入機器學習模型呢?就這樣：

 

 

這類推薦看似簡單，但如果要認真做，需要投入不少人力和時間才能實現(xiàn)。

所以，百度這是個失敗的設計嗎?

其實不然——如果你是百度搜索引擎的深度用戶，那么你應該知道這樣一組搜索指令：

用減號“-”代表排除關鍵字;

用“intitle:”代表關鍵字只出現(xiàn)在標題中;

用“inurl:” 代表關鍵字只出現(xiàn)在URL中;

用“filetype:”代表只想看某些文件類型，比如docx、pdf;

用“site:”代表只想搜索某個站點中的內(nèi)容;

以上這些指令都可以直接在搜索框中輸入，既滿足了高級用戶的需求，又不會影響初級用戶的使用體驗。這就實現(xiàn)了既靈活又簡單。

那么，如果你想在設計自己的產(chǎn)品時也做到靈活而簡單，應該怎么做呢?

二、原來的設計問題出在哪?

首先，我們定義問題的范疇。

靈活與簡單的取舍，不是一個純粹的交互設計的問題，它還涉及到前端頁面交互與后端系統(tǒng)的配合;所以單從交互設計的角度很難找到答案。

這里必須說一點：要想提升對于產(chǎn)品的理解，需要練習自己的抽象思考能力。

在這里，我們就需要把具體的產(chǎn)品交互做一次抽象和提煉，找到其中的規(guī)律;有技術背景的同學在這方面會有優(yōu)勢。

為什么?因為技術語言本身就是對事物的抽象。

其次，我們要打破一種思維定式：“一個功能是一體的，不再可分”;其實并不是這樣的，就用上面的搜索引擎舉例，它與用戶相關的部分大致可以拆成兩個子模塊：

所以，正是這兩部分造成了靈活與簡單很難取舍——用戶隨意輸入的內(nèi)容系統(tǒng)很難解析;而系統(tǒng)方便解析的內(nèi)容對用戶來說太復雜了。

最后，我們可以借鑒技術領域的MVC設計理念，來考慮我們的產(chǎn)品功能設計。

MVC是三個單詞的首寫字母——M代表Model，是指產(chǎn)品中的數(shù)據(jù)模型;V代表View，是指產(chǎn)品中呈現(xiàn)數(shù)據(jù)的方式，其實就是用戶“看得見摸得著”的產(chǎn)品形態(tài);C代表Controller，指的是真正用來響應用戶操作的部分。

這種設計理念為我們設計復雜功能打開了思路。

一個產(chǎn)品功能，我們可以從三個方面來思考它的設計：

第一部分是Controller，我們可以理解為“核心功能”。比如，在搜索引擎中什么是“核心功能”?根據(jù)用戶輸入的條件，返回符合條件的結(jié)果，這就是核心功能;所以“查詢”就是一個必不可少的Controller。

第二部分是View，直接理解就是“產(chǎn)品形態(tài)”。比如收縮引擎中的輸入框，搜索結(jié)果列表;這兩個具體的產(chǎn)品形態(tài)，就是兩個View。

第三部分是Model，這部分就很抽象了;我們在這里不單獨解釋它，結(jié)合下面的例子一起說。

我們以“用Excel中的數(shù)據(jù)畫圖表”這個場景為例，來看看MVC的三個部分是怎么配合工作的。

首先，我們在一個Excel文件中保存的一份數(shù)據(jù)，這份數(shù)據(jù)，就相當于MVC中的Model。

接下來，我們選中這些數(shù)據(jù)，然后使用插入圖表的功能，并選擇一種圖表類型;比如我們選擇了折線圖，這其中“插入圖表”就是一個Controller，而折線圖就是一個View。

這時假設我們不想用折線圖了，想換成柱狀圖;那么，稍微對Excel有一些了解的同學都知道，為了把折線圖換成柱狀圖，我們不需要復制一個Excel文件，也不需要再安裝一套Excel軟件，只需要改變一下圖表類型。

為什么這么簡單?

保存在Excel里的數(shù)據(jù)Model變了嗎?沒有。

“插入圖表”這個功能Controller變了嗎?也沒有。

要做的只是切換一下View。

所以，假設我們想在自己的產(chǎn)品中，增加一個類似“把折線圖換成柱狀圖”的功能，我們實際要增加的只是一個View，而不需要改變已經(jīng)有的Model和Controller。

除非我們把“插入折線圖”和“插入柱狀圖”當做完全不相干的兩個功能來設計;不過這顯然不合理，而且已經(jīng)超綱了，我們不在這里討論。

三、怎么用MVC設計產(chǎn)品功能?

現(xiàn)在你有體會到MVC在產(chǎn)品設計中的魅力嗎?那我們再舉個例子：

協(xié)作型的產(chǎn)品通常都會增加權限管理模塊。

按照標準的RBAC(Role Based Access Control，基于角色的訪問控制)，我們需要設計的功能包括：

單個/批量管理用戶和給用戶賦權;

單個/批量管理角色和給角色賦權;

權限校驗，返回校驗通過或拒絕;

聽起來像是個很復雜的功能模塊吧?別慌，如果用MVC的理念怎么設計呢?

這里只考慮了最核心的功能部分，在實際功能落地時，多少還會有其他功能補充進來，比如單點登錄、讀取用戶信息等。

首先我們有3個重要的Controller(不是全部哦)，包括：

1個更新用戶與角色關系的Controller，支持批量;

1個更新角色與權限關系的Controller，支持批量;

1個校驗權限的Controller，支持不支持批量都行;

其次，我們只有3個重要的Module，包括：

1個用戶與角色對應關系的Model;

1個角色與權限對應關系的Model;

1個用戶與權限對應關系的Model;

其實，我們也可以把這三個Model合并成1個，這樣我就只需要一個“用戶-角色-權限”的Model了。

最后，我們也只需要1個View了，因為在交互上無非是查詢或者更新“用戶-角色-權限”三者之間的關系。

此時，如果之前我們確實沒有考慮到“批量修改”的情況，但是隨著用戶量增加，越來越多的用戶想要這個功能了。怎么辦?

如果我們在設計功能時用MVC的理念來考慮這個問題，只需要修改某一個Controller;并在前端的View上增加一些復選框的功能。

數(shù)據(jù)模型Model不需要做任何修改，所以數(shù)據(jù)庫也就不需要做什么改動了。