想從美工變成真正的設(shè)計(jì)師，學(xué)習(xí)設(shè)計(jì)之上的原則很重要。這篇譯文收集了全球各個(gè)最優(yōu)秀的產(chǎn)品設(shè)計(jì)原則，讓我們了解這些產(chǎn)品設(shè)計(jì)背后更高的設(shè)計(jì)指導(dǎo)原則。

騰訊視頻TVD：在我們進(jìn)行產(chǎn)品設(shè)計(jì)的時(shí)，總會(huì)遇到一些很難決策的地方或者沒(méi)有頭緒的時(shí)候，例如兩個(gè)方案看上去都很不錯(cuò)，究竟選使用哪個(gè)才是對(duì)的?在設(shè)計(jì)時(shí)該往哪個(gè)方向進(jìn)行?

在表層設(shè)計(jì)之外，探索和制定更高層級(jí)的產(chǎn)品設(shè)計(jì)原則應(yīng)當(dāng)是需要我們努力的方向，這些設(shè)計(jì)原則能幫助產(chǎn)品設(shè)計(jì)保持更高的一致性。

最近我需要為我的產(chǎn)品設(shè)定最高層級(jí)的原則。我尋找著那些簡(jiǎn)單卻有力量的設(shè)計(jì)準(zhǔn)則，那些可以在設(shè)計(jì)決策時(shí)引導(dǎo)我們，和在討論中打破僵局的準(zhǔn)則。

首先，對(duì)于設(shè)計(jì)原則，我發(fā)現(xiàn)需要先理清一些誤會(huì)，在開(kāi)始前我們先明確一下這個(gè)概念。

設(shè)計(jì)原則的范圍

如果你嘗試google”設(shè)計(jì)原則“，很可能會(huì)得到一些平面設(shè)計(jì)的基本定理：鄰近、平衡、對(duì)比、留白，等等都是些設(shè)計(jì)師已經(jīng)熟爛于心的事情。

另一部分你可能還會(huì)看到一些科學(xué)的設(shè)計(jì)流程的原則。這些流程可以指導(dǎo)你高效地產(chǎn)出優(yōu)秀的設(shè)計(jì)方案。使用這些設(shè)計(jì)流程可以為團(tuán)隊(duì)設(shè)定一個(gè)標(biāo)準(zhǔn)，為新加入的成員可以快速上手。

例如英國(guó)政府電子服務(wù)的設(shè)計(jì)原則GOV.UK Design Principles.

1. 從用戶的需求著手。

2. 少做。多考慮可復(fù)用性和共享，做政府部門應(yīng)該做的事。

3. 通過(guò)數(shù)據(jù)來(lái)做設(shè)計(jì)決策。

4. 盡最大的努力讓事情變簡(jiǎn)單。

5. 迭代，再迭代。

6. 為所有人設(shè)計(jì)。

7. 深刻的理解用戶的使用場(chǎng)景。

8. 創(chuàng)建電子服務(wù)，而不是網(wǎng)站。

9. 保持一致，但不是死板的一成不變。

10. 保持開(kāi)放，與全世界分享我們的代碼、設(shè)計(jì)、想法，這樣才會(huì)越來(lái)越好。

這十條準(zhǔn)則看上去很合理，但我認(rèn)為這已經(jīng)是業(yè)界的基本標(biāo)準(zhǔn)，誰(shuí)不是通過(guò)數(shù)據(jù)、理解用戶場(chǎng)景才設(shè)計(jì)呢。我相信如果你要為自己的團(tuán)隊(duì)設(shè)定設(shè)計(jì)原則，你應(yīng)該找到那些可以幫助團(tuán)隊(duì)走得更遠(yuǎn)、更有挑戰(zhàn)性的原則。

有些團(tuán)隊(duì)會(huì)把他們的設(shè)計(jì)原則寫在網(wǎng)上，我有時(shí)候會(huì)看到諸如”人性化“”樂(lè)意溝通“這樣的話。我深信這樣的話完全不值得作為準(zhǔn)則掛在墻上，除非你團(tuán)隊(duì)里充滿了垃圾設(shè)計(jì)師，從一開(kāi)始你就不應(yīng)該雇傭這樣的人。

所以，我想找的是產(chǎn)品設(shè)計(jì)的準(zhǔn)則。英國(guó)政府的設(shè)計(jì)原則至少有一條是我認(rèn)為好的：

為所有人設(shè)計(jì)

無(wú)障礙設(shè)計(jì)是好的。所有我們創(chuàng)造的產(chǎn)品都應(yīng)該是盡可能清晰、易讀。如果我們需要為此犧牲優(yōu)雅，那就犧牲吧，我們是為了滿足需求而設(shè)計(jì)，不是要設(shè)計(jì)出擺在那里的花瓶。我們?yōu)槿珖?guó)的人設(shè)計(jì)，而不是為某一個(gè)人。那些最需要我們服務(wù)的人，通常都是覺(jué)得我們服務(wù)最難用的人。讓我們一開(kāi)始就考慮到他們，為他們?cè)O(shè)計(jì)。

產(chǎn)品的設(shè)計(jì)原則應(yīng)該可以告訴你的團(tuán)隊(duì)和參與者在艱難決策時(shí)應(yīng)該往哪個(gè)方向走。他應(yīng)該關(guān)注在如果讓你的產(chǎn)品與競(jìng)爭(zhēng)對(duì)手區(qū)別開(kāi)，你的用戶在其中應(yīng)該感受到什么樣的體驗(yàn)。

你肯定聽(tīng)說(shuō)過(guò)蘋果的人機(jī)界面原則和google的material design。系統(tǒng)背后的設(shè)計(jì)原則是想要盡可能的把平臺(tái)里的產(chǎn)品統(tǒng)一為一種體驗(yàn)。

如果你的產(chǎn)品存在于不同的平臺(tái)，你就應(yīng)該考慮設(shè)立一個(gè)設(shè)計(jì)系統(tǒng)或設(shè)計(jì)原則。因?yàn)槟慵刃枰屪约旱漠a(chǎn)品與競(jìng)爭(zhēng)對(duì)手的區(qū)分開(kāi)，又需要在不同的平臺(tái)系統(tǒng)內(nèi)符合他們的設(shè)計(jì)原則。

這會(huì)導(dǎo)致同一個(gè)問(wèn)題：一些團(tuán)隊(duì)會(huì)設(shè)定一些顯而易見(jiàn)的設(shè)計(jì)原則：清晰、簡(jiǎn)潔、可用。但缺少這些你根本不可能創(chuàng)造出一個(gè)好產(chǎn)品，這已經(jīng)是最最最基本的了。

總結(jié)一下

好的設(shè)計(jì)原則

是指能指導(dǎo)偉大設(shè)計(jì)的一系列規(guī)則

設(shè)計(jì)流程的準(zhǔn)則

是指解釋如何創(chuàng)造偉大產(chǎn)品的流程步驟的準(zhǔn)則

為產(chǎn)品而定的設(shè)計(jì)原則

產(chǎn)品應(yīng)該帶給用戶什么感覺(jué)，帶來(lái)什么情緒，如何和競(jìng)爭(zhēng)產(chǎn)品區(qū)別開(kāi)

系統(tǒng)的設(shè)計(jì)原則

為你的產(chǎn)品在不同環(huán)境不同平臺(tái)體驗(yàn)保持一致的原則。

為什么你的產(chǎn)品需要設(shè)計(jì)原則?

有很好的設(shè)計(jì)原則并不代表著你的產(chǎn)品也可以笑到最后。顯然，好的產(chǎn)品需要在所有層面上優(yōu)秀的執(zhí)行，而設(shè)計(jì)準(zhǔn)則只是其中很小的一部分，他能幫助你在有分歧的時(shí)候打破僵局，節(jié)省時(shí)間，讓團(tuán)隊(duì)有一致的目標(biāo)。

什么才是好的原則？

簡(jiǎn)潔的

有真實(shí)的案例

可以引領(lǐng)設(shè)計(jì)決策

反映著你的品牌

收集

我收集了一些我覺(jué)得好的設(shè)計(jì)原則。這里面不會(huì)包括基本的平面設(shè)計(jì)原理或設(shè)計(jì)流程，但我把設(shè)計(jì)系統(tǒng)的準(zhǔn)則也加在里面了，因?yàn)樗c產(chǎn)品的設(shè)計(jì)原則有重合的地方。

Airbnb

統(tǒng)一的

每一個(gè)部分都是為更好的整體提供積極的貢獻(xiàn)。不應(yīng)該有分離或局外的功能。

全球化的

Airbnb是一個(gè)會(huì)被全球用戶使用的產(chǎn)品。我們的產(chǎn)品和視覺(jué)語(yǔ)言對(duì)全球用戶都要是友好的和可用的。

清晰聚焦的

當(dāng)我們呈現(xiàn)設(shè)計(jì)和功能時(shí)，都應(yīng)該是十分聚焦的。圍繞聚焦的內(nèi)容，我們的設(shè)計(jì)應(yīng)該清晰和大膽的傳達(dá)給用戶。

口語(yǔ)化的

我們的產(chǎn)品與用戶溝通時(shí)，應(yīng)該與現(xiàn)實(shí)生活一樣，輕松易懂。

作為“共同的朋友”

讓用戶在線上盡量減少不確定的內(nèi)容、可以方便設(shè)定好自己的期望，從而更好的匹配用戶需要的結(jié)果，真實(shí)生活中的線下體驗(yàn)才會(huì)很棒。我們產(chǎn)品是為了房東、租客可以更好的互相認(rèn)識(shí)而設(shè)計(jì)的。我們還會(huì)不斷了解你的需求，通過(guò)好的產(chǎn)品設(shè)計(jì)，持續(xù)為用戶創(chuàng)造更好的新體驗(yàn)。我們?yōu)橛脩艋ハ嗾J(rèn)識(shí)搭好舞臺(tái)，互相介紹，然后就離開(kāi)，把空間留給用戶。就像好朋友的角色一樣，當(dāng)你需要我的時(shí)候，我就在你身邊。

為第一印象而設(shè)計(jì)

盡管airbnb在用戶下訂單的時(shí)候需要一些信息，但并不需要所有事情都開(kāi)誠(chéng)布公。所以我們需要客人告訴我們他是誰(shuí)，但具體他是什么樣的人，由客人決定吧。

互相信任需要努力

就和現(xiàn)實(shí)生活中一樣，你在airbnb里投入什么，就會(huì)收獲到什么。airbnb里的信任是相互共享的。我們發(fā)現(xiàn)租客對(duì)房東越真誠(chéng)，房東也會(huì)更愿意信任租客。

(譯者補(bǔ)充：剛好前陣子使用airbnb在美國(guó)租房子，在向房東提出申請(qǐng)的時(shí)候可以寫一封信介紹自己，寫得越詳細(xì)和真誠(chéng)，房東的通過(guò)率越高，畢竟房東要拿出自己的房子給你住，總不愿意雜七雜八的人糟蹋自己的房子，所以大部分房東挑選房客都很謹(jǐn)慎。當(dāng)你住宿完離開(kāi)后，可以互相打評(píng)價(jià)，你覺(jué)得房東的房子有什么優(yōu)缺點(diǎn)都可以寫到評(píng)論里作為下一個(gè)房客的依據(jù)。如果你很愛(ài)護(hù)房東的房子，他也會(huì)對(duì)你寫出很好的評(píng)價(jià)。下次你再向別的房東提出申請(qǐng)時(shí)，就像有推薦信一樣，更容易通過(guò)。所以這是個(gè)互相信任的過(guò)程。)

Facebook

全球化的

我們的使命是讓全世界更加開(kāi)放，這意味著我們的產(chǎn)品要觸達(dá)世界每一個(gè)角落、每一個(gè)人。我們要為每一個(gè)人、每一種文化、每一種語(yǔ)言、每個(gè)生命階段而設(shè)計(jì)。這就是為什么我們的產(chǎn)品總是做90%用戶的功能，而不做少數(shù)人的功能，即使這樣意味著我們短期內(nèi)可能后退一點(diǎn)。

以人為中心

用戶使用我們產(chǎn)品是因?yàn)檫@里有他的朋友和他附近的人。 “你在乎的人都在這里“就是我們產(chǎn)品的核心價(jià)值。這就是為什么人的臉龐、人們發(fā)的消息比一切視覺(jué)設(shè)計(jì)都重要。

干凈的

我們的視覺(jué)設(shè)計(jì)干凈而素雅，就是為了給用戶提供一個(gè)干凈的畫布呈現(xiàn)他們的生活。一個(gè)極簡(jiǎn)的、明亮的空間可以讓參與者真誠(chéng)的交流。干凈并不是視覺(jué)設(shè)計(jì)最容易的方法。相反的，因?yàn)橄霕O力減少視覺(jué)樣式，邊緣的距離、字體的比例，顏色的設(shè)計(jì)都變得尤其重要。

始終如一的

擁抱可重復(fù)使用的控件樣式。我們認(rèn)識(shí)到當(dāng)使用一致的交互控件后，可用性會(huì)大大提高，因?yàn)椴恍枰貜?fù)的學(xué)習(xí)。我們保持用同一種聲音和用戶說(shuō)話，建立信任。盡量做減法、重復(fù)的使用，不要什么都重新設(shè)計(jì)。

實(shí)際有用的

我們的產(chǎn)品不像娛樂(lè)類的產(chǎn)品，它會(huì)被每天重復(fù)使用，需要有效率的為用戶提供價(jià)值。這就是為什么我們用戶每天最主要的交互方式就是時(shí)間流，為用戶大大節(jié)省了要沒(méi)必要的點(diǎn)擊和空間的浪費(fèi)。

快速

我們珍惜用戶的時(shí)間比自己的更甚。我們認(rèn)識(shí)到更快速的體驗(yàn)可以讓人感覺(jué)更有效率和不費(fèi)勁。網(wǎng)站性能不是用戶應(yīng)該關(guān)心和注意到的。我們的網(wǎng)站應(yīng)該盡我們所能的快。

透明

用戶把信任交給我們，他們的身份、照片、想法、對(duì)話都因?yàn)樾湃味唤o了我們。我們要以最大程度的誠(chéng)實(shí)和透明作為回報(bào)。對(duì)于現(xiàn)在發(fā)生了什么，為什么會(huì)這樣，我們都要對(duì)用戶如實(shí)告知。

Apple

整體的美學(xué)

整體的美學(xué)是指一個(gè)app應(yīng)該從外觀、行為與它的功能保持高度的一致性。例如，如果一個(gè)app要幫助用戶完成一個(gè)嚴(yán)肅的任務(wù)，圖形的設(shè)計(jì)就應(yīng)該更微妙而不張揚(yáng)，使用標(biāo)準(zhǔn)的控件，這樣用戶可以很輕松的預(yù)測(cè)操作后的反饋。如果一個(gè)app是沉浸式的如游戲，就應(yīng)該有一個(gè)抓人眼球的外觀，提供有趣、激動(dòng)人心、鼓勵(lì)發(fā)現(xiàn)的體驗(yàn)。

保持一致

通過(guò)使用系統(tǒng)提供的界面元素、大家熟知的icon、標(biāo)準(zhǔn)的文字樣式、統(tǒng)一的術(shù)語(yǔ)來(lái)可以使App保持一致。app所包含的功能和行為，都應(yīng)該與用戶期待的所一致。

直接的操作感

對(duì)屏幕內(nèi)容的直接操作，使用戶有參與感和容易理解。當(dāng)旋轉(zhuǎn)設(shè)備或使用手勢(shì)來(lái)控制屏幕上的內(nèi)容時(shí)，用戶應(yīng)該直接體驗(yàn)到他操作后十分迅速的結(jié)果呈現(xiàn)。

反饋

用戶行為后的及時(shí)反饋可以讓用戶馬上知道操作的結(jié)果。iOS的原生app對(duì)所有的用戶行為都提供了容易感知的反饋。交互的元素在點(diǎn)擊后會(huì)有高亮的點(diǎn)擊態(tài)，進(jìn)程的指示器會(huì)在稍長(zhǎng)時(shí)間的運(yùn)行時(shí)提供狀態(tài)告知，動(dòng)效和聲音的提示也可以幫助告知當(dāng)前行動(dòng)的結(jié)果。

隱喻

當(dāng)app中虛擬物體的行為與現(xiàn)實(shí)生活中相似時(shí)，人們會(huì)學(xué)習(xí)得更快。iOS的隱喻使用得很棒的原因是人們真的在與屏幕交互。你可以拖動(dòng)視圖來(lái)展示內(nèi)容的底部。你也可以拖拽或掃動(dòng)內(nèi)容。你還可以打開(kāi)切換按鍵，移動(dòng)滑塊，滾動(dòng)選擇器的數(shù)值。你甚至還可以對(duì)書籍和雜志進(jìn)行翻頁(yè)的操作。

用戶的操控感

在iOS里，人才是控制者，而不是app。app可以在遇到危險(xiǎn)結(jié)果時(shí)提出建議的操作，但如果app自作主張的幫用戶做決定就一定是錯(cuò)的。好的app能在糾錯(cuò)和讓用戶有操控感之間找到完美平衡點(diǎn)。好的app能通過(guò)熟悉的交互元素、再次確認(rèn)、容易取消之前的操作等來(lái)讓用戶覺(jué)得他們正在控制大局。

Google Material Design

實(shí)體感是一種隱喻

通過(guò)構(gòu)建科學(xué)合理化的空間和系統(tǒng)的動(dòng)效，形成了實(shí)體感的隱喻。由于在研究紙和墨水的時(shí)候受到啟發(fā)，實(shí)體感的營(yíng)造靈感來(lái)源于可觸摸的實(shí)體，實(shí)體感的技術(shù)上很先進(jìn)且充滿想象和魔力。

界面元素的表面和邊緣提供了基于現(xiàn)實(shí)的視覺(jué)暗示，熟悉的觸感讓用戶可以快速地明白其功能可見(jiàn)性。界面元素的靈活變化甚至創(chuàng)造了超越物理世界的新的功能可見(jiàn)性，但又不會(huì)脫離客觀的物理規(guī)律。

光線、界面、運(yùn)動(dòng)是傳達(dá)物體在移動(dòng)、交互和空間中相互關(guān)系的基礎(chǔ)。真實(shí)的光線會(huì)展現(xiàn)出兩個(gè)面之間交接線，劃分的空間以及移動(dòng)的部分。

大膽，生動(dòng)，有意為之

基于印刷設(shè)計(jì)的基本元素-字體、柵格、空間、比例、顏色、圖像的使用-是我們視覺(jué)處理的基礎(chǔ)。這些元素的作用遠(yuǎn)遠(yuǎn)不止養(yǎng)眼。他們創(chuàng)造了層次關(guān)系，意義和焦點(diǎn)。通過(guò)顏色選擇、圖像、大比例的字體，和有意的留白可以創(chuàng)造出一個(gè)讓用戶沉浸體驗(yàn)的大膽的、圖形化的界面。

我們要為用戶突出當(dāng)前的核心功能操作以及路徑的關(guān)鍵節(jié)點(diǎn)。

動(dòng)效提供意義

用戶才是操作后動(dòng)效的原動(dòng)力。因?yàn)橛脩舻男袨椴庞辛藙?dòng)效，這會(huì)改變整個(gè)設(shè)計(jì)。

所有動(dòng)作都在同一個(gè)環(huán)境里產(chǎn)生。呈現(xiàn)給用戶的物體即使在變形或重新組織時(shí)，也不應(yīng)該打斷整個(gè)體驗(yàn)的連續(xù)性。

為了讓用戶更好的聚焦和維持連續(xù)性，動(dòng)效要富有意義和適宜的。反饋要微妙細(xì)膩且清晰。轉(zhuǎn)變要高效連貫。