在產(chǎn)品設(shè)計(jì)中要做到“簡(jiǎn)單直觀”，首先要讓產(chǎn)品概念淺顯易懂，其次是要打造最直觀的交互方式，最后一點(diǎn)就是產(chǎn)品對(duì)于用戶的操作要有反饋。只有設(shè)計(jì)“簡(jiǎn)單直觀”的產(chǎn)品，才是好產(chǎn)品。

今天談一談產(chǎn)品設(shè)計(jì)中的一個(gè)原則——“簡(jiǎn)單直觀”。

這個(gè)原則聽起來(lái)也很“簡(jiǎn)單直觀”，但是它既是一個(gè)最低、最基礎(chǔ)的要求，也是做產(chǎn)品最高的境界。要真正做到這一點(diǎn)，其實(shí)并不容易。

所謂“簡(jiǎn)單直觀”，就是：要讓產(chǎn)品做到憑直覺(jué)就能理解并上手使用。

無(wú)論是日常生活用品、社會(huì)公共設(shè)施，還是高科技的軟件、硬件產(chǎn)品，都應(yīng)該符合這個(gè)原則。

下面，先從我們辦公室里放置的一臺(tái)普通的飲水機(jī)說(shuō)起（如左圖所示）。

這臺(tái)飲水機(jī)看起來(lái)不錯(cuò)，但卻有一個(gè)問(wèn)題，那就是它不符合“簡(jiǎn)單直觀”的設(shè)計(jì)原則。當(dāng)你按下右側(cè)的熱水按鈕，憑直覺(jué)用杯子在下面接水時(shí)，會(huì)被從左邊流出的熱水給嚇到，一不小心就會(huì)被燙傷。

相比之下，右圖的這臺(tái)飲水機(jī)盡管看起來(lái)不夠高端大氣，但其設(shè)計(jì)卻很“簡(jiǎn)單直觀”。冷熱水開關(guān)和相應(yīng)的出水口連在一起，并且用紅藍(lán)兩種”直觀的“顏色來(lái)進(jìn)行區(qū)分。

這樣，一般情況下是不會(huì)搞錯(cuò)的。

在這個(gè)飲水機(jī)的例子中，體現(xiàn)出了一條讓產(chǎn)品“簡(jiǎn)單直觀”最基本的設(shè)計(jì)策略，就是“讓功能相關(guān)的元素，在位置上也相近”。

這也是平面設(shè)計(jì)的基本原則之一。在羅賓·威廉姆斯的《寫給大家看的設(shè)計(jì)書》中，他將優(yōu)秀設(shè)計(jì)的秘訣歸納為“對(duì)比、重復(fù)、對(duì)齊和親密性”四條基本原則。其中，“親密性”就是在說(shuō)這一點(diǎn)。

除了飲水機(jī)，我們經(jīng)常能在日常生活當(dāng)中看到，很多物品的設(shè)計(jì)都不符合“簡(jiǎn)單直觀”的原則。

比如：很多門把手的設(shè)計(jì)就有問(wèn)題——你每次都要想一下應(yīng)該是推還是拉。一種好的設(shè)計(jì)就是推的那一面根本就沒(méi)有把手，只有一個(gè)方塊區(qū)域引導(dǎo)你去推，這樣你就不會(huì)搞錯(cuò)了。

如此簡(jiǎn)單的設(shè)計(jì)問(wèn)題司空見(jiàn)慣，唐納德·A·諾曼博士在其著名的《設(shè)計(jì)心理學(xué)》一書中，就有過(guò)專門的論述。

再舉個(gè)例子：如果讓你設(shè)計(jì)車輛座椅的“頭枕、靠背和坐墊”調(diào)節(jié)按鈕，你該怎么做呢？

最“直觀”的想法，恐怕就是挨個(gè)放上“頭枕向前/向后、靠背向前/向后、坐墊向前/向后/上升/下降”等八個(gè)按鈕吧？

這個(gè)沒(méi)錯(cuò)，但太復(fù)雜了，一點(diǎn)都不夠“簡(jiǎn)單直觀”。而好的設(shè)計(jì)就類似下圖這樣，把按鈕做成座椅的形狀，那就容易理解、很好操作了。

除了生活當(dāng)中的物品之外，在注重設(shè)計(jì)、強(qiáng)調(diào)用戶體驗(yàn)的IT/互聯(lián)網(wǎng)產(chǎn)品領(lǐng)域，“簡(jiǎn)單直觀”這個(gè)設(shè)計(jì)原則也非常關(guān)鍵。

比如：在整個(gè)人機(jī)交互（HCI）技術(shù)的發(fā)展史中，就一直體現(xiàn)著不斷趨向直觀化的演進(jìn)路線。

在最早期，輸入方式是打孔紙帶，后來(lái)出現(xiàn)鍵盤命令行輸入（CLI）、圖形化界面（GUI）+鼠標(biāo)輸入?？梢钥吹?，輸入方式越來(lái)越直觀。

近些年出現(xiàn)的觸摸屏、語(yǔ)音、肢體動(dòng)作識(shí)別等輸入技術(shù)，則是到達(dá)了一個(gè)更高的階段。

可以說(shuō)，最簡(jiǎn)單直觀的交互和輸入方式，就是利用人類數(shù)萬(wàn)年前就進(jìn)化出的機(jī)能（觸摸、說(shuō)話、動(dòng)作）來(lái)進(jìn)行輸入，而不需要再借用任何中間設(shè)備，或者預(yù)先學(xué)習(xí)輸入方法和指令才行。

直觀的交互方式，就是當(dāng)年iPad一問(wèn)世就大獲成功的原因之一。因?yàn)槲覀儠?huì)驚奇地看到，對(duì)于從來(lái)沒(méi)有摸過(guò)電腦的老人和小孩，給他一臺(tái)iPad，他就會(huì)很直觀地進(jìn)行“滑動(dòng)解鎖、左右滑動(dòng)屏幕、點(diǎn)擊圖標(biāo)打開應(yīng)用、用手指旋轉(zhuǎn)和縮放照片”等一系列操作。

我兒子也是在兩歲多的時(shí)候，就可以熟練操作各式智能手機(jī)了。當(dāng)我使用筆記本電腦進(jìn)行工作的時(shí)候，他還經(jīng)常會(huì)下意識(shí)地用手指在屏幕指指點(diǎn)點(diǎn)，企圖搗亂，盡管這并不是觸控屏。

由此可見(jiàn)，“觸摸”這樣交互方式，是多么的簡(jiǎn)單和直觀。

當(dāng)然，越是直觀的交互方式，需要更高的技術(shù)來(lái)實(shí)現(xiàn)。

這是因?yàn)?，輸入輸出技術(shù)本質(zhì)上是人與計(jì)算機(jī)之間的橋梁。然而，作為生物體的人，與計(jì)算機(jī)內(nèi)在的二進(jìn)制的、電子的裝置差異很大。因此，要讓計(jì)算機(jī)直接識(shí)別人類的“觸摸、說(shuō)話、動(dòng)作”這些生物信號(hào)，難度就很大。于是，之前的種種交互技術(shù)，比如鍵盤、鼠標(biāo)什么的，都是在中間做橋接。

再來(lái)說(shuō)說(shuō)手機(jī)軟件，我們也能看到很多簡(jiǎn)單直觀的設(shè)計(jì)。

比如：微信“搖一搖”就是一個(gè)很好的例子。

微信在幾年前就引入了“搖一搖”，來(lái)讓用戶以揮動(dòng)手機(jī)這種非常簡(jiǎn)單直觀、非常有參與感的交互方式，尋找同一時(shí)刻搖一搖的有緣人，或者識(shí)別當(dāng)前正在播放的歌曲和電視節(jié)目，并與之互動(dòng)。

現(xiàn)在，很多產(chǎn)品和H5互動(dòng)都效仿微信，用搖一搖的方式來(lái)參與抽獎(jiǎng)、添加好友等。其實(shí)“搖一搖”這個(gè)觸發(fā)產(chǎn)品功能的方法，換成點(diǎn)擊某個(gè)按鈕或菜單的話完全一樣，這也是最常見(jiàn)交互方式。但由于“搖一搖”參與起來(lái)非常有喜感，特別是非常簡(jiǎn)單直觀，不用做任何多余的解釋大家都能懂，因而更受歡迎。

相比之下，支付寶的“咻一咻”就不夠簡(jiǎn)單直觀了。因?yàn)樗耆且粋€(gè)生造的交互方式，不像任何小孩和大人都能懂、都會(huì)做的“搖一搖”。用戶大腦當(dāng)中絲毫沒(méi)有什么“咻一咻”的概念，無(wú)法聯(lián)想到“咻一咻”是自然界哪種熟知的生物發(fā)出的聲響、做出的動(dòng)作。

最后，看看老羅的錘子手機(jī)。盡管這把錘子最終并沒(méi)有砸碎其他競(jìng)爭(zhēng)對(duì)手，但其產(chǎn)品中確實(shí)有不少簡(jiǎn)單直觀的設(shè)計(jì)，值得研究和學(xué)習(xí)。

比如：手機(jī)附帶的計(jì)時(shí)器工具，就很不錯(cuò)。拉出手環(huán)來(lái)設(shè)置時(shí)長(zhǎng)（表盤的指針會(huì)隨之轉(zhuǎn)動(dòng)），松開拉環(huán)就啟動(dòng)計(jì)時(shí)。在計(jì)時(shí)進(jìn)行的過(guò)程中，隨時(shí)可以拉動(dòng)拉環(huán)來(lái)調(diào)整時(shí)長(zhǎng)，以及關(guān)閉計(jì)時(shí)。工具雖小，但確實(shí)很好用。

再對(duì)主題做一下進(jìn)一步的總結(jié)和延伸，要打造“簡(jiǎn)單、直觀”的產(chǎn)品，需要從以下幾個(gè)方面來(lái)考慮：

1. 概念要簡(jiǎn)單

概念簡(jiǎn)單，產(chǎn)品才能簡(jiǎn)單；概念復(fù)雜，產(chǎn)品必然復(fù)雜。

“搖一搖、掃一掃”，都是非常淺顯易懂的概念，它把復(fù)雜的技術(shù)實(shí)現(xiàn)隱藏起來(lái)，讓用戶都能顧名思義、立刻理解。

其實(shí)，不光在設(shè)計(jì)某一個(gè)具體的產(chǎn)品功時(shí)要考慮概念上的簡(jiǎn)單，我們?cè)谧鋈魏我粋€(gè)復(fù)雜產(chǎn)品的整體設(shè)計(jì)之前，都應(yīng)該先把該產(chǎn)品的概念體系設(shè)計(jì)出來(lái)。

然而，在具體實(shí)踐當(dāng)中我們經(jīng)?？吹剑a(chǎn)品經(jīng)理一做起產(chǎn)品設(shè)計(jì)，首先想到的MRD、PRD，就去畫具體的頁(yè)面原型，跳入到種種細(xì)枝末節(jié)當(dāng)中。

結(jié)果是：在產(chǎn)品評(píng)審時(shí)頻頻被挑戰(zhàn)——要么是概念不一致，同一個(gè)東西一會(huì)兒叫這個(gè)名字一會(huì)兒叫那個(gè)；要么是體系結(jié)構(gòu)不一致（把不同級(jí)別的功能并列在了一起）、流程不順暢（出現(xiàn)斷裂或者死循環(huán)）。

我推薦的做法是：先把這個(gè)產(chǎn)品里面的所有概念和功能模塊列出來(lái)，從概念的命名和數(shù)量上，都確保極簡(jiǎn)。正所謂，如無(wú)必要，勿增實(shí)體。

其次，把所有的東西畫一個(gè)完整腦圖出來(lái)。按照產(chǎn)品功能的層級(jí)，一級(jí)一級(jí)列出來(lái)，然后不斷去梳理，在腦海當(dāng)中演練整個(gè)產(chǎn)品的所有功能和流程。這個(gè)腦圖的結(jié)構(gòu)，就對(duì)應(yīng)產(chǎn)品的架構(gòu)層級(jí)、導(dǎo)航層級(jí)，以及具體的頁(yè)面和基本概念模塊。

最后，把這個(gè)腦圖翻譯成頁(yè)面原型即可。

先在大腦中構(gòu)建，再在電腦上繪制。

2. 交互須直觀

再解決了概念的問(wèn)題之后，對(duì)于每一個(gè)頁(yè)面模塊，我們要確保交互是直觀的——用戶一眼看過(guò)去，基本上就知道該怎么做了。

要打造直觀的交互方式，可以考慮如下的原則：

• 多采用“觸摸（包括指紋）、語(yǔ)音”等直觀的交互方式。
• 在交互設(shè)計(jì)上，讓“功能相關(guān)的元素，在位置上也要相近”。
• 在色彩的選用上，也要遵循常理。比如：紅色代表代表熱、藍(lán)色代表冷；紅色代表停止、綠色代表啟動(dòng)；紅色和黃色代表危險(xiǎn)、警示等等。
• 按照操作對(duì)象本身的特點(diǎn)來(lái)設(shè)計(jì)相應(yīng)的交互方式。例如：對(duì)于類似知識(shí)圖譜實(shí)體關(guān)系這樣網(wǎng)狀的、結(jié)構(gòu)化的數(shù)據(jù)，盡量用可視化的拖拖拽拽的交互來(lái)表達(dá)，而不是讓用戶通過(guò)填寫復(fù)雜的表單來(lái)構(gòu)建這樣的對(duì)象。
• 避免用戶誤操作。比如：接口設(shè)計(jì)要能防插反。我們注意到，在內(nèi)存、CPU插槽、SIM卡插槽等設(shè)計(jì)上，都有防止插反的設(shè)計(jì)——反了是插不進(jìn)去的。但最好的設(shè)計(jì)是，根本就不區(qū)分正反。你看，安卓和蘋果最新的手機(jī)充電線插頭，都采用這樣的設(shè)計(jì)，非常方便。

3. 狀態(tài)有反饋

用戶看到了直觀的交互，他按照預(yù)想的、下意識(shí)的方式去操作了。

然后，我們要將系統(tǒng)的狀態(tài)展示出來(lái)，對(duì)用戶的操作要有相應(yīng)的反饋。讓用戶知道我在哪里、我將要去哪里、我做了什么、系統(tǒng)處于什么狀態(tài)。這樣，用戶才不會(huì)焦慮，才不會(huì)誤操作。

這里，我們以電梯的設(shè)計(jì)來(lái)舉例。

大家經(jīng)常可以看到，有些電梯按鈕按下去，并沒(méi)有操作反饋或者給用戶的反饋很微弱，其背景或者邊框的亮光很不清楚。這樣，用戶就以為沒(méi)有按下去，就再去按一遍。

有時(shí)候，我們按下按鈕，在等電梯的時(shí)候還是感到很著急，這往往是因?yàn)殡娞輿](méi)有樓層指示，沒(méi)有顯示這部電梯運(yùn)行到哪一層。這樣，即使電梯距離本層并不遠(yuǎn)，但因?yàn)榭床坏綘顟B(tài)，用戶就很茫然、很焦慮，這個(gè)等待時(shí)長(zhǎng)在心理上也會(huì)被放大。

總之，無(wú)論是面對(duì)何種產(chǎn)品，無(wú)論其結(jié)構(gòu)和原理多么復(fù)雜，產(chǎn)品設(shè)計(jì)者都應(yīng)該想方設(shè)法用最簡(jiǎn)單最直觀的方式來(lái)進(jìn)行設(shè)計(jì)。

簡(jiǎn)單、直觀的產(chǎn)品，才是好產(chǎn)品。

#專欄作家#

朱百寧，微信公眾號(hào)：八點(diǎn)三十五，人人都是產(chǎn)品經(jīng)理專欄作家。前百度品牌總監(jiān)，著有《自傳播》一書，現(xiàn)在專注于人工智能以及產(chǎn)品設(shè)計(jì)等領(lǐng)域。個(gè)人微信：izhubaining，歡迎添加進(jìn)行交流。

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

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