如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

小時(shí)候我們很多經(jīng)驗(yàn)都是來(lái)自于寓言故事，故事總能幫你更好地理解一些事情和道理。關(guān)于設(shè)計(jì)，這個(gè)道理同樣適用。今天的文章，我們就跟著一個(gè)設(shè)計(jì)師的經(jīng)歷來(lái)學(xué)點(diǎn)什么吧。

我有一個(gè)朋友，名字叫做 Jimmy，這的確是一個(gè)很普遍的名字。當(dāng)我認(rèn)識(shí)他的時(shí)候，他正供職于一家名為 Shmuckle 的公司，而他正是這家公司的設(shè)計(jì)師。和所有的設(shè)計(jì)師一樣，他日思夜想夢(mèng)寐以求的，是成為一名著名的設(shè)計(jì)師，而喬布斯的經(jīng)歷對(duì)他有著不可磨滅的影響。Jimmy 和很多設(shè)計(jì)師一樣，著迷喬教主。好在 Jimmy 的崇拜并不是停留在嘴上，而是身體力行，力圖在公司里面推行好的設(shè)計(jì)。在 Jimmy 的眼中，好的設(shè)計(jì)應(yīng)該是直觀的、創(chuàng)新且令人愉悅的。

當(dāng)然，故事的發(fā)展如果總是一帆風(fēng)順就沒有意思了。Jimmy 果然一如正常的劇情推進(jìn)……他碰到障礙了。

這一次，Jimmy 正在執(zhí)行一個(gè)重要的項(xiàng)目，這個(gè)項(xiàng)目的成敗將會(huì)直接影響到他的職業(yè)生涯。這次的任務(wù)，他需要為他們公司的一款產(chǎn)品，重新設(shè)計(jì)整個(gè)控制面板。而就在這次的項(xiàng)目當(dāng)中，Jimmy 發(fā)現(xiàn)他沒有辦法拿出一套足夠優(yōu)秀的解決方案。好在他還有 Plan B，那就是重新找靈感。Jimmy 開始重新播放他最喜歡的設(shè)計(jì)類的視頻，閱讀曾經(jīng)給他啟發(fā)的文章，收聽其他同行所開設(shè)的播客，以期在其中找到感覺或者靈感。

可惜，靈感并沒有如期而至。局面尷尬了。

就在此刻，援手到了。Sarah 是公司的資深設(shè)計(jì)師，正巧這個(gè)時(shí)候路過(guò) Jimmy 的工位，看到了 Jimmy 糾結(jié)掙扎的樣子。這是多么熟悉的場(chǎng)景啊，她早年入行的時(shí)候，同樣經(jīng)歷過(guò)這樣的狀態(tài)，為求一好設(shè)計(jì)而痛苦不已。如今，她已經(jīng)能夠輕松駕馭不同的需求，足以應(yīng)對(duì)復(fù)雜多變的設(shè)計(jì)項(xiàng)目。

「Hey Jimmy，老遠(yuǎn)就看到你正在揪頭發(fā)，看樣子正在構(gòu)思新設(shè)計(jì)吧，瞧你這個(gè)狀態(tài)，應(yīng)該不太順利吧？」

「誒，客戶說(shuō)讓我給他們重新設(shè)計(jì)整個(gè)控制面板。他們覺得不夠好使，希望新的控制面板能夠更好展示信息，提升效率，最好再把幾個(gè)比較明顯的可訪問(wèn)性問(wèn)題給解決一下。但是我怎么設(shè)計(jì)……都覺得不對(duì)。客戶那邊有不少人參與了測(cè)試，有人覺得挺棒的，有人又非常討厭，還有一部分直接說(shuō)還得接著改?，F(xiàn)在，我覺得無(wú)能為力，不知道要怎么弄了?！笿immy 保持著撓頭的姿勢(shì)，盯著屏幕說(shuō)道。

「別糾結(jié)，」Sarah 微笑道：「如果一直盯著問(wèn)題解決問(wèn)題是常常會(huì)陷入這樣的困境的，解決方案其實(shí)并不復(fù)雜，你需要從根子上來(lái)想辦法。只要讓整個(gè)設(shè)計(jì)方案貼合規(guī)則基礎(chǔ)穩(wěn)固了，問(wèn)題就會(huì)迎刃而解了。其實(shí)，關(guān)鍵也就是幾個(gè)基本的設(shè)計(jì)原則?！?

「雖然這話經(jīng)常聽到，但是真的能行？」Jimmy 狐疑地盯著 Sarah，思忖兩秒感覺到大姐頭這是要傳授秘籍，便摸過(guò)小本子，端正坐姿，準(zhǔn)備做筆記：「那么，都有哪些原則呢？」

Sarah 拍了拍 Jimmy 的肩膀，端了杯咖啡，說(shuō)道：「下樓散步吧，咱們邊走邊聊?！?

「其實(shí)，在產(chǎn)品完成之后，是需要基于幾個(gè)基本的原則來(lái)重新審視和調(diào)整設(shè)計(jì)的?！筍arah 喝了一口咖啡，慢慢地開始說(shuō)。

保持清晰

Jimmy，如果腦子里面的思路沒有梳理清晰，很難做出條理清晰的產(chǎn)品的。因此，在設(shè)計(jì)產(chǎn)品之前，先應(yīng)當(dāng)消除思維中的混亂，有幾個(gè)事情，在設(shè)計(jì)的過(guò)程中要始終保持關(guān)注：

• 業(yè)務(wù)目標(biāo)，客戶的問(wèn)題和需要的功能則會(huì)催生設(shè)計(jì)，而這幾個(gè)因素之間是存在關(guān)系的。
• 永遠(yuǎn)不要為了好看而犧牲功能。
• 下一步要做的事情始終要是不言自明的。
• 對(duì)于最重要的內(nèi)容，要借助負(fù)空間、色彩、字體、圖形和其他的 UI 元素來(lái)進(jìn)行突出展示的。
• 各種尺寸的文本都應(yīng)該清晰可見。
• 圖標(biāo)應(yīng)該而銳利。
• 除此之外，要讓設(shè)計(jì)保持微妙而恰到好處。
• 通過(guò)設(shè)計(jì)，你的用戶應(yīng)該本能的知道他在哪里，以及該做什么。

產(chǎn)品的外觀最終都是在清晰的設(shè)計(jì)（或者不夠清晰的設(shè)計(jì)）之下的副產(chǎn)物。清晰的設(shè)計(jì)意圖，最終會(huì)轉(zhuǎn)化為清晰的產(chǎn)品設(shè)計(jì)?！狹assimo Vignelli

「我記得 Massimo Vignelli 在他的《The Vignelli Canon》中寫道，一個(gè)混亂而復(fù)雜的產(chǎn)品始終是源自于制造者本身的混亂，說(shuō)明這個(gè)人本身內(nèi)心深處心態(tài)復(fù)雜而想法混亂?！筍arah 說(shuō)道。Jimmy 此刻若有所思。

可操作的界面

「接下來(lái)的這一點(diǎn)也同樣很重要。我們?cè)O(shè)計(jì)的數(shù)字產(chǎn)品必須清晰，也要專注于當(dāng)前的任務(wù)，一個(gè)交互性強(qiáng)、可操作性優(yōu)秀的 APP 才是用戶所需要的，而要做到這一點(diǎn)，屏幕上的內(nèi)容應(yīng)當(dāng)始終是的，并且始終保持較高的相關(guān)性。與此同時(shí)，APP  也應(yīng)當(dāng)作為用戶意圖的延伸。如果用戶打開了你的 APP，想要解決某個(gè)問(wèn)題，執(zhí)行某個(gè)任務(wù)，而你的 APP 做不到這一點(diǎn)，那么情況就很糟糕了?！筍arah 說(shuō)道。

她停了幾秒鐘，梳理了一下思路，繼續(xù)說(shuō)道：「你看，我們所做的一切都是為了確保我們的方案，能夠在正確的環(huán)境中，面對(duì)著對(duì)的用戶，解決亟需解決的問(wèn)題。當(dāng)然，我們要經(jīng)歷很多次的迭代，才能靠近這一目標(biāo)?！?

主觀的愿景

「許多設(shè)計(jì)師和開發(fā)者都在說(shuō)，APP 應(yīng)該靈活，應(yīng)該滿足所有客戶的需求。好吧，Jimmy，這些說(shuō)法都是胡說(shuō)八道的。但是有一個(gè)說(shuō)法很真實(shí)，也需要你時(shí)刻謹(jǐn)記：試圖取悅每個(gè)人只會(huì)帶來(lái)無(wú)盡的壓力和痛苦，讓你沮喪，失去資源。所以，不要害怕失去一部分用戶，真正需要擔(dān)心的是失去愿景和遠(yuǎn)見。」

「一個(gè)偉大的而足夠優(yōu)秀的數(shù)字產(chǎn)品，必須始終清楚它到底是服務(wù)于誰(shuí)的。只有牢記真正的用戶，明白他們的需求，才能開發(fā)出真正有效的解決方案。最好的數(shù)字產(chǎn)品當(dāng)中，都是藏著愿景的?！筍arah 和 Jimmy 走到了大樓的窗戶附近，看著外面來(lái)往的人流，Jimmy 忍不住問(wèn)到：「那其他的用戶呢？」Sarah 笑著回答：「當(dāng)我們滿足目前的目標(biāo)之后，才能顧的上其他的人。我們的目標(biāo)用戶才是核心，其他的人不喜歡，和我們的愿景不匹配，也不用操心。市場(chǎng)上會(huì)有其他的應(yīng)用或者服務(wù)能夠滿足他們，讓他們高興，而我們總是只能身處一個(gè)陣營(yíng)，你不可能什么都擁有。」Sarah 笑著回答 Jimmy 的疑問(wèn)。

當(dāng)人們尋找軟件和服務(wù)的時(shí)候，他們要的并不是功能，他們要的是解決問(wèn)題的方法，一個(gè)和自己相匹配的愿景?！?7Signals《Getting Real》

反饋系統(tǒng)

下一個(gè)原則，也是一個(gè)很重要的注意事項(xiàng)，那就是反饋。反饋能夠幫用戶確定操作是否執(zhí)行了，明白結(jié)果是否發(fā)生，讓用戶明白當(dāng)前的情況：

• 交互發(fā)生時(shí)，相應(yīng)的交互元素應(yīng)該被凸顯出來(lái)
• 進(jìn)度指示控件應(yīng)該持續(xù)地顯示當(dāng)前狀態(tài)
• 動(dòng)畫和聲音的加入有助于用戶理解交互的狀態(tài)和結(jié)果

「我想你應(yīng)該知道，即使技術(shù)如此的進(jìn)步，人類本身的生物性決定了我們依然是依靠反饋來(lái)確知互動(dòng)的結(jié)果和狀態(tài)的。我們的身體（視覺或者觸感）需要感受到反饋，再像大腦發(fā)出信號(hào)，而虛擬的界面背后到底在發(fā)生什么，需要全面的交互設(shè)計(jì)傳遞出來(lái)，只有這樣用戶才不會(huì)費(fèi)勁巴拉地去思考之前的點(diǎn)擊或者滑動(dòng)交互是否操作成功了。反饋給用戶的信息也應(yīng)該是能夠被輕松理解的，用戶不應(yīng)該在這個(gè)事情上再費(fèi)勁去思考了。因此，你手邊應(yīng)該有關(guān)于心理學(xué)、行為學(xué)這類能夠揭示人類思考的圖書，因?yàn)樗鼈兡軌驇湍闾嵘寄??！筍arah 喝了一口咖啡，潤(rùn)了潤(rùn)嗓子，帶著 Jimmy 又溜達(dá)上樓，回到了辦公室。

善用隱喻

「隱喻——我這里說(shuō)的并不是文學(xué)中的隱喻，」Sarah 又提到了一個(gè)看似無(wú)用但是經(jīng)常被說(shuō)起的概念：「你看，UI界面中的設(shè)計(jì)元素和交互方式和我們的現(xiàn)實(shí)生活中的元素和交互方式是如此的相似，這就是借用隱喻將我們的熟悉的元素和交互都投射到虛擬的數(shù)字產(chǎn)品當(dāng)中。這樣一來(lái)，用戶會(huì)更快地學(xué)會(huì)和理解?！?

「正是因?yàn)殡[喻的存在，現(xiàn)實(shí)的經(jīng)驗(yàn)和虛擬的交互產(chǎn)生了關(guān)聯(lián)，用戶交互因此而更加自然地發(fā)生。視線隨著被精心設(shè)計(jì)的布局而游移到重點(diǎn)上，用戶會(huì)下意識(shí)地點(diǎn)擊被高亮顯示的、和現(xiàn)實(shí)按鈕差不多的交互控件，他們還會(huì)下意識(shí)地在虛擬的屏幕上滑動(dòng)，在界面之前自然游走。因此，你有必要了解你的核心用戶每天都在使用哪些 APP，他們都是如何交互的。這有助于你吸收經(jīng)驗(yàn)，消除不良的體驗(yàn)，創(chuàng)造舒適的交互，降低學(xué)習(xí)的壓力，更好地轉(zhuǎn)化。」Sarah 一邊說(shuō)著，一邊下意識(shí)地模擬著交互并解釋道。

內(nèi)容的一致性

「接下來(lái)我們還是用案例來(lái)說(shuō)明一下，會(huì)更容易理解?！拐f(shuō)著 Sarah 坐到椅子上，并且打開電腦屏幕，說(shuō)道：「比如我們要做一個(gè)日歷，你認(rèn)為它應(yīng)該是網(wǎng)格，還是做成列表？」Jimmy 撓頭想了一下，遲疑道：「恩……我們應(yīng)該堅(jiān)持使用網(wǎng)格的樣式。它更加緊湊也更加有條理，我說(shuō)的對(duì)嗎？」

「其實(shí)這取決于用戶的主要目標(biāo)是什么。如果這個(gè)日歷元素是出現(xiàn)在報(bào)告文檔當(dāng)中，應(yīng)該是用網(wǎng)格的樣式還是列表的樣式呢？一樣的，這要看情況。我們是否要在每個(gè)應(yīng)用中都使用全局導(dǎo)航？同樣是需要基于上下文情況來(lái)決定的。一致的設(shè)計(jì)不止是表面樣式上的一致，還需要從需求、內(nèi)容、用戶使用場(chǎng)景和體驗(yàn)上來(lái)保持一致性。如果在特定的情況下，獨(dú)特的設(shè)計(jì)能夠帶來(lái)更大的價(jià)值，那么這是有意義的，這種特殊情況下不同是有必要的?！筍arah 細(xì)心地為 Jimmy 解釋道。

良好的設(shè)計(jì)，應(yīng)該是特定語(yǔ)境經(jīng)過(guò)評(píng)估后定制的副產(chǎn)物，而不是脫離使用場(chǎng)景而憑空創(chuàng)造出來(lái)的，否則，無(wú)論多么炫酷都是不合時(shí)宜的?！狹assimo Vignelli

防御性設(shè)計(jì)

「最后要說(shuō)的，是防御性設(shè)計(jì)?！筍arah 轉(zhuǎn)身對(duì)著 Jimmy，然后說(shuō)道最后一個(gè)規(guī)則。

「防御性設(shè)計(jì)？什么東西？」Jimmy 感覺今天學(xué)到了不少，最后這個(gè)原則也被他寫到小本子上了。「這個(gè)啊，也就是大家常說(shuō)的直覺性設(shè)計(jì)?！筍arah 微微一笑。

「我知道！喬布斯以前就經(jīng)常說(shuō)這個(gè)概念！」Jimmy 終于找到一個(gè)他足夠熟悉的概念，興奮不已。

「可是，你真的知道什么是直覺性的設(shè)計(jì)么？」Sarah 看著興奮的 Jimmy 賣了個(gè)關(guān)子。

「預(yù)測(cè)用戶行為？然后在用戶要執(zhí)行下一個(gè)操作之前幫他解決需求？」Jimmy 狐疑地問(wèn)道。

「是也不是。它并不是讓你去預(yù)測(cè)用戶的行為，防御性設(shè)計(jì)是為了避免出錯(cuò)。無(wú)論你如何謹(jǐn)慎地去做設(shè)計(jì)，總會(huì)有錯(cuò)誤發(fā)生，無(wú)論你做過(guò)多少調(diào)研，你計(jì)劃有多么妥帖，你的產(chǎn)品總會(huì)需要一個(gè)備用方案來(lái)規(guī)避問(wèn)題。」Sarah 說(shuō)道：「防御性設(shè)計(jì)，是讓你找到可能會(huì)出現(xiàn)的問(wèn)題。」

相信我，你的產(chǎn)品如果給了用戶負(fù)面的體驗(yàn)，他們絕對(duì)不會(huì)忘記。

「我還是沒明白你的意思……」Jimmy 習(xí)慣性地?fù)项^。Sarah 耐心地開始解釋：「以開車為例來(lái)說(shuō)明這個(gè)事兒吧。當(dāng)你開車的時(shí)候，總會(huì)盡量避免道路上各種可能出現(xiàn)的危險(xiǎn)情況，比如魯莽駕駛的大貨車，三心二意橫穿馬路的行人，懵懂無(wú)知在路邊打鬧的兒童，甚至野外竄上馬路的野鹿，等等。同樣的，作為設(shè)計(jì)師，我們需要預(yù)料到可能會(huì)出現(xiàn)的問(wèn)題，以及始終保持專注來(lái)修復(fù)這些問(wèn)題。這樣我們就不會(huì)破壞整個(gè)用戶體驗(yàn)。我們要有良好的防御性的設(shè)計(jì)意識(shí)，維持住體驗(yàn)，改善體驗(yàn)?！筍arah 說(shuō)到這個(gè)地方的時(shí)候，Jimmy 感覺她身上散發(fā)著某種光芒。

然后 Sarah 起身，帶著 Jimmy 回到他的工位。「怎么樣，這些東西你都記下來(lái)了嗎？」Sarah 打趣地歪著頭看著低著頭還在琢磨的 Jimmy，如同大男孩一樣的 Jimmy 驚訝地抬頭問(wèn)道：「什么意思？這就是全部嘛？難道只有這些？」

Sarah 呼出一口氣，微笑著對(duì) Jimmy 說(shuō)道：「好了好了，設(shè)計(jì)原則、規(guī)則、規(guī)范、技巧有太多，可是對(duì)于每個(gè)人，每個(gè)公司而言，都有屬于自己的一套方法和策略。你可以盡興地去探索，但是即使你不知道全部，也可以借助你所熟知的幾個(gè)原則和策略，拿出足夠優(yōu)秀的設(shè)計(jì)。我把我最熟悉的、掌握地最嫻熟、體會(huì)最深刻的幾個(gè)原則分享給你，它們足以幫你開啟一條走向好設(shè)計(jì)的道路，我覺得你要是真的體會(huì)到了，就已經(jīng)能夠拿出比別人更好的東西了。其他的設(shè)計(jì)原則，只要你有耐心和時(shí)間，還可以繼續(xù)探索。該工作啦?！?

尾聲

就像 Sarah 說(shuō)的，設(shè)計(jì)原則太多了，誰(shuí)又規(guī)定死了具體有幾條呢？每個(gè)人心中的哈姆雷特都不一樣，每個(gè)人眼里的哈利波特又何嘗是一樣的呢？

最重要的問(wèn)題在于，許多人知道原則，卻并不會(huì)在設(shè)計(jì)項(xiàng)目當(dāng)中運(yùn)用它們。洞悉每個(gè)設(shè)計(jì)項(xiàng)目當(dāng)中的重點(diǎn)，了解客戶的需求，明白首要的設(shè)計(jì)目標(biāo)，在產(chǎn)品和用戶之間，找到平衡點(diǎn)，用心地思考，利用好設(shè)計(jì)原則這一利器。

藍(lán)藍(lán)設(shè)計(jì)( bouu.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ù)。