探究:打造“設計原則”的步驟和條件上榜經歷2020年12月21日 192期站酷文章總榜第3名

探究:打造“設計原則”的步驟和條件上榜經歷2020年12月21日 192期站酷文章總榜第3名

探究:打造“設計原則”的步驟和條件,觀點,海邊來的設計師,原創文章站酷網,中國設計師互動平台。

2017年,所在團隊開始以“設計原則”指導設計工作。

設計原則和其他“工具”一樣,推行初期難免需要經歷試錯的階段,構成了本文的初稿。實操部分多源自海外資料收集。

本文約4000字,由五個部分組成:

1、被弱化的視覺規範

2、什麼是設計原則

3、好原則需要具備的特徵

4、打造原則的4個步驟和條件

5、後記:突破認知局限

#1被弱化的視覺規範

在多人協作的項目中,為保證團隊產出的一致性,設計團隊往往會建立一套規範文檔。
並在其中標註常用的參數,比如字號、圓角和間距等:

undefined

此外,還需要確定常用組件的樣式和使用場景
不過,從2017年起,我當時所在的團隊開始逐步弱化過去那種大而全的規範文檔。改為製定統一的設計原則(Design Principle)
這是為什麼?

從小處思考:規範文檔的整理和維護本身就需要投入大量的資源,每次改版之後,之前輸出的規範文檔也就作廢了。設計師又得重新輸出,這樣一來未免造成了一定的資源浪費。

往大處思考:團隊負責多條產品線,這些產品的屬性和視覺風格也會存在較大差異,某一套產品的規範文檔顯然無法幫助大團隊輸出高一致性的設計決策;再放大一步來說,一個大型公司有上百名設計師,互相也不認識,如何保證公司的設計具有一致性?
為了解決上述兩個問題,一些設計團隊開始嘗試制定一套設計原則。
設計原則和近兩年很火的OKR一樣,是一個“如果運用得當”則非常有效的工具。

#2什麼是設計原則

undefined

簡單來說,設計原則就是在設計產品時要遵循的一個信念系統和甄別條件。
設計原則的作用在於,幫助團隊系統地思考產品的價值系統和理念。在設計過程中做出高一致性的產品設計決策,抵禦各種削弱產品價值和理念的嘗試。組織,個人和產品團隊都可以從編寫和遵循自己的原則中受益。
但正如大家所熟悉的那樣,任何新事物都不會一帆風順的發展壯大。都要經過試錯的階段,比如我所在的團隊。
先來看看我之前團隊在2017年制定的三條設計原則:
在我看來,這三條原則在實操層面,過於“大而無當”
理論上來說,如果設計師能做到上述三點,自然能出好的設計。
但如果回到實際工作中,這些放之四海而皆準的原則,似乎給人一種不知道怎麼用的感覺。試想,哪個產品不是從用戶的需求出發,哪個產品不想簡潔、高效?

undefined

畢竟一線做事的設計師,只是從業幾年的普通人,而上圖中的設計大師。

如果制定的原則,無法指導設計決策,無法對實際的商業和現實世界的問題能產生影響,那它僅僅是一段文字。
那麼,可用的設計原則應該是什麼樣子?

#3好原則需要具備的特徵

提到設計原則,相信很多同學最先想到的還是蘋果的Human Interface Guidelines,裡面提到六條設計原則:

1.美學完整性(aesthetic integrity)

2.直接操作(direct manipulation)

3.運用比喻(metaphors)

4.一致(consistency)

5.反饋(feedback)

6.讓用戶控制(user control)

但由於蘋果設計團隊幾乎不對外進行分享,有關其原則設定背後的故事,及其在使用中的注意事項,外人也就無從得知。
即便是把HIG的六條原則,當做自己公司產品的設計原則,也很難實際運用。
比如,在實際應用中,設計師要同時滿足上述六條,還是滿足一條即可?如果在一個設計中,不同的原則相互衝突,該如何取捨?
基於上述的問題,在蘋果之外,我們還需要了解更多知名企業有關設計原則的分享。
在實際指導層面,Facebook對設計原則的分享,有很強的借鑒意義。
Facebook的設計VP ,Julie Zhuo曾談到過,好的設計原則需要滿足以下幾點:

1.幫助人們解決關於具體設計的實際問題;

2.能應用到一個品牌下面所有的設計決策上,包括我們現在已經想到的全部問題,以及還沒有想到的未來會冒出來的問題;

3.能解釋清楚為什麼,讓非設計師也能理解這些設計原則背後的道理;

4.包含一個清晰的觀點和優先級排序邏輯,可以讓人們贊同或者否認;

5.配合一個具體清楚的例子來示意這個設計原則為什麼成立。

按這個標準,一個更優秀的設計師,除了可以告訴你為什麼她的設計有這些決定,還可以向你解釋清楚背後的原則,讓你作為聽眾也能領會這個設計好在哪,另一個設計不好在哪,讓你能領會到她設計決策背後的核心價值。
下面我們再看下Salesforce的案例:
作為全球最大的B端軟件服務提供商,Salesforce的設計原則在產品開發過程中就起到了指導性的作用。他們的原則是:

1.清晰(clarity)

2.效率(efficiency)

3.一致(consistency)

4.美觀(beauty)

Salesforce的設計師JD Vot分享到:“我們可以做的事情是無窮盡的,但是我們真正要去做的事情是有限的。在Salesforce實際的產品設計討論中,很多產品設計決策因為多種原因會相互衝突,我們不僅需要設計原則告訴我們為什麼,還需要設計原則告訴我們什麼更重要”。
經過設計團隊的重重辯論以及與領導層的溝通,Salesforce最終決定把“清晰”擺在第一位。
清晰是整個企業服務的核心價值和基石,用戶需要清晰度來完成工作任務。
如果我們可以一次又一次地把信息和任務清晰地呈現給用戶,我們終將贏得用戶的忠誠、感激和信任。
這對於Salesforce的產品是最重要的。那麼“效率”和“一致”誰更重要呢? 企業軟件效率就是生命,我們設計產品當然要追求一致,但是效率一定是更重要的。 (一致性,可以理解為是否要遵循統一規範)
在下一次遇到“效率”和“一致”兩者相衝突的設計問題時,比如一個表單的設計會與整個設計系統的交互風格相衝突,但是如果它是服務於用戶效率,並且沒有明顯的可用性缺陷的話(前提),應該優先“效率”的方案。由此可見設計原則的排序能加速產品設計討論。

#4打造原則的4個步驟和條件

如何打造設計原則?這簡直就是分享大會的專屬話題,設計總監的領域。
懷著謙卑的心,以下內容多源自資料收集和個人在工作中的部分總結。
每個產品都有自己獨特的上下文、用戶目標和商業目標。這也就意味著每款產品(哪怕是同一個公司的產品)都應該在設計原則上有所區別。很難有一套通用的工作幫助大家快速打造一套自己的設計原則。
但我們可以通過一些大廠的經驗分享,管中窺豹,從中摸索了四個步驟(也是四個前提):

Step.1 設計原則必須是稍微具體和稍微具有爭議性的;

首先,設計原則必須是稍微具體一點(而不是“設計要美觀”)和稍微具有爭議性的(毫無爭議的話,通常是正確的廢話)。
微軟產品的Metro設計語言:
在項目啟動之初,設計團隊定下了“Content Not Chrome” (展現內容而不是展現傳遞內容的界面)這樣的設計原則。
你可以在微軟現在的各個操作系統裡感受到他們扁平化設計背後的力量:把用戶關心的內容放在最前面,對UI做最小化處理。 (過去的擬物化,是對UI進行複雜處理)

Step.2 把疑惑說出來,一次聊個夠!

其次,設計原則是對話。它能夠發揮的作用源自於對話,那麼自然它的產生也來自於對話。 (這句話有點繞,多看幾遍)
當然,我知道這件事很難,甚至在私下溝通中,一些同學都不知道如何在公司內部會議上發起討論。他們日常開會就是聽領導講話,會後去執行......
如果團隊可以發起自由討論,可以針對下面幾個問題進行對話溝通:

1. 我們(作為一個設計團隊)現在做得好的方面有哪些原則?

2. 我們做了哪些事可能是違背上面這些原則的?

3. 我們還有哪些設計原則是符合用戶與商業目標的?

4. 我們需要作出哪些改變來更好地遵循這些原則?

假設這個時候團隊列出了10個候選的設計原則,比如:

1.一切從用戶需求開始

2.專注

3.用數據設計

4.致力於簡潔

5.迭代,反复迭代

6.具備包容性

7.理解應用情景

8.建設數字服務,而不僅僅是網站

9.保持一致性,但不是千篇一律

10.公開化讓事情變得更好

接著下一步(也是最有意義的一個步驟),就是討論我們按照什麼思路來篩選將這些設計原則進行排序。
這個步驟可能會非常“痛苦”,因為大家的觀點可以完全相反。比如張三覺得專注最重要,李四覺得包容性比專注重要......
要知道,設計原則根本上是價值觀念,非常主觀。成員間的理解和堅持,都會有很大的區別。其次,設計原則很難自證,所以很難輕易讓團隊達成一致。
如果不能充分討論,只是領導層單方面的決定,在實際工作中中,團隊成員容易因理解不充分,讓設計原則難以起效。
所以,討論和製定設計原則,不是一次2小時的簡單會議就可以搞定的。我們需要建個工作坊!

Step .3建個工作坊,聊上三天三夜

建議用2~3天的時間,組建一個工作坊(WorkShop),專門用於討論設計原則。 (設計工坊的教程網上很多,可百度,這里略過)
全員的深度參與,可以讓團隊成員深刻理解設計原則背後的思考並認同最終的結論。
當團隊定好工作坊的日程安排後,還需要注意以下三件事:

· 對話比結果重要。鼓勵大家討論自己產生和排序設計原則背後的道理是什麼,然後針對這些道理產生對話。

· 鼓勵對每一個原則舉出實際的例子,揭示這個原則在產品決策中扮演的角色和對用戶與商業帶來的影響。

· 引入不同職能的領導層和專家,比如產品專家、技術專家。從他們的高視角提供更寬廣的信息。

Step.4 讓領導參與關鍵決策,為原則背書

PS:這裡的領導指設計總監的上級。而No.2中的領導,指代設計leader。
我們不需要太多的設計原則,3~5條就足夠了。得到組織高層領導的支持是至關重要。
正是因為設計原則具有一定的具體性和爭議性,高層的支持在後期推進設計原則驅動的設計決策會起到至關重要的作用。一小群設計師自己確立的幾個沒有大團隊支持的設計原則是很難有影響力的,在和業務方的溝通中,分分鐘就被按在地面上摩擦。
理想的情況是,領導層的人應該參與到環節的討論中。盡量讓領導層的人參與,但是領導層的人往往很難,無法長時間參會。我們可以把他們安排在這些關鍵的決策時刻。這樣也能提高團隊的決策效率。
< Tips: >
如果你對設計原則感興趣,在動手打造設計原則之前,建議先評估下團隊是否具備上述四個條件,並完成上述步驟。
如果條件不成熟,又要構建設計原則,那勢必要加大前期投入。

#5後記:突破認知局限

前騰訊副總裁吳軍,在他的專欄中,談過《人類簡史》一書在中美兩國的不同處境:

“《人類簡史》在國內極為暢銷,但在美國賣得一般。

剛上架的第一年賣得很好,因為它裡面有些新觀點,但是從第二年開始銷量就斷崖式下跌,因為它提供的只是很多觀點中的一種,第二年又有新的觀點出來。
但是在中國,因為大家對西方歷史觀沒有什麼太多的了解,看到這樣一本講法和之前大不相同的書,就認為裡面說的都是歷史學的新發現,是唯一的正確解釋。因此,一直當正統歷史書在讀。 ”
提到設計原則,身邊很多設計師只知道蘋果的Human Interface Guidelines。這在很大程度上限制了自己對設計原則的理解。從而很難寫出符合自身產品特點的設計規範。
這就好像只有一塊積木的小孩,無論他多麼聰慧,也搭不出喜愛的玩具。所以在製定自己的設計原則前,開拓視野,打開思路是重要但常常被忽略的一步。

下面給大家推荐一個神奇的網站: https://principles.design/ (無需翻牆)

undefined

如果你對各大公司的設計原則感興趣,你可以通過這個網站全面地了解不同公司,不同產品的設計原則。並能訪問這些原則的原文鏈接:
在你嘗試製作自己的設計原則時,相信這個網站會給你很大的助力。

小結:

和OKR一樣,設計原則是一個“如果運用得當”非常有效的工具。
而製作這些“有效的工具”,不是看一兩篇文章,一兩本書就可以得到並加以運用。
所有團隊工具的誕生,都要團隊成員一起努力鍛造,調整使用方式。
在開始打造屬於自己的設計原則,先預估時間成本和試錯的周期,這拉近你和設計原則的距離。
【參考資料】
· https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/
· https://medium.muz.li/design-principles-behind-great-products-6ef13cd74ccf
· https://medium.com/salesforce-ux/defining-principles-to-drive-design-decisions-b647b68fb057
· https://zhuanlan.zhihu.com/p/19981631
· https://item.jd.com/12499249.html
· END ·

<!--

- 位站酷推荐设计师推荐 -

-->

Category

GogoShark 給你最好的網頁設計

無論您的事業才剛起步、漸上軌道,或計劃向大中華區拓展市場,GogoShark 團隊將提供全方位的服務,為您量身打造數位品牌形象。