作者 / Liam Spradlin, UX Design, Google

在我畫畫時...我看着畫布，告訴自己，"那個角落還需要加上一點藍色"，然後我在那裏加上些藍色，然後我又看了眼，那裏看起來也要來一下，於是我拿起畫筆，把它移到那裏，讓那裏也變藍了一些。

這番話，以及《The Philosophy of Andy Warhol * 》這本書裏提到的很多事情，多年來一直讓我念念不忘。當我第一次看到它時，它似乎暗暗地向我傳達出了一種我無從體會的源自直覺的美學力量——這是一種查看自己作品的方式，這種方式使得作品能夠以 "與創作者對話" 這種形式存在。

* 安迪・沃霍爾 (Andy Warhol)，美國藝術家，視覺藝術運動波普運動開創者之一。

在書中，沃霍爾描述了他在畫布上移動藍色畫筆的過程，直到一切都看起來沒問題之後，他會再用綠色畫筆做同樣的事情，然後繼續審視，並決定什麼時候這幅畫纔算大功告成。從表面上來看，這種做法可能會讓人覺得繪畫過程是缺乏考慮的，或者說缺乏規劃的。但我認爲，這些畫作的創作過程體現了一種通過學習掌握的用於構圖的審美直覺。

而且，像沃霍爾的繪畫一樣，字體設計中也包含着一種強大的直觀構圖方法，而這種方法可以跨領域應用到其他設計課題中去。

在 Type@Cooper 項目 * 裏，學生可以參加 Herb Lubalin 系列客座講座。在一次關於木頭與形式的演講中，演講者 David Shields 探討了 Rob Roy Kelly 的書《藝術桌墊和支架的收藏指南》，這本書詳盡地列出了充滿美學細節的日常物件。Shields 提出，桌墊的設計實際上和字體設計頗有相似之處。我想知道可能的聯繫是什麼，然後才意識到，他指的可能是桌墊的構圖機制。

* Type@Cooper，是庫伯高等科學藝術聯盟學院針對字體設計開設的繼續教育認證計劃。

△ 《藝術桌墊和支架的收藏指南》

我學習使用筆畫來平衡對沖的幾何形狀，以便創建出有說服力並易於閱讀的字母。同理，也有人想通過平衡鐵模中的鏤空比例，設計出具有說服力和可用性的桌墊用來擺放菜餚。

每週我們都會舉辦設計研討會，我會將最新的設計概念拿給 Hannes Famira *  看，聽取他對工作的評論和方向建議。Hannes 在審視字母設計時的洞察能力是我所不及的，他可以隔着老遠的距離就挑出一個有問題的曲線控制點 (經常做矢量繪圖的讀者應該會懂)，甚至可以閉着眼睛告訴您這段輪廓不夠圓潤。

* 知名字體設計師以及該領域的教育家。

在研習進行到一半的時候，我思考着兩個有趣的主題。第一個是字體構成規則 (是比大小寫比例、襯線構造等概念更高一層的總體規則) 的概念可以廣泛應用於其他類型的設計和創作。第二個是，專家們擁有高超的構圖直覺，而我並沒有這種能力。

當然，這個想法並不是憑空而來的。"善於平衡構圖要素" 並不是沒有人做到過。但是，我沒有簡單地說 "知道如何構成是很重要的" ，而是想要拋出這兩個想法，並將它們整合到用戶界面的設計實踐中去——這纔是我最擅長的，而且我傾向於實踐每一個新想法。

什麼是設計？什麼不是？

在最近的一次設計訪談中，我說出了一段我想了很久但從未公開說過的話——"所有被創造出來的東西都是藝術"。

至少在某種程度上，我說那番話的意思是，費力地去區分什麼 "是藝術"，什麼 "不是藝術"，可能是沒有任何意義的。我不想先說某些東西 "不是藝術" ，然後又無法斷定 "到底什麼纔是藝術" 。但我也想說，我們應該更多地把事物作爲有意義的創造物來考慮，它們擁有自己的內在意義，並承擔着代表創造者與使用它們的人們交流的使命。

我認爲，"藝術和設計" 的文氏圖可能從一開始就是完全重合的兩個圓圈。

△ 文氏圖示例: A 代表 "兩隻腳的動物"，B 代表 "會飛的動物" (CC-BY SilverStar)

這句話的後半部分是，"所有被刻意創造的東西都是被設計出來的"。是的，我認爲藝術是設計出來的。

我認爲將藝術和設計視爲完全不同概念的想法是很誘人的，因爲設計給人的感覺不同——它似乎擁有不同的目標，不同的執行流程，而且似乎通常在產品生產過程中發揮着更系統的作用。在我和 Fictive Kin 的 Cameron Koczon 錄製的一集  Design Note   節目中，他是這樣說的:

……當我運營 Brooklyn Beta 項目時，我發現設計方面很受重視，風險投資人都在談論它，商業領袖說，"你必須擁有它。你必須做好設計。"……"設計" 這個詞，現在到處都是，"設計" 這個詞出名了。但是設計師和社區，我認爲他們並沒有從中獲得太多的東西，我認爲我們作爲設計產品的接收端，並沒有從中獲得太多。

• Design Note

  https://design.google/library/design-notes-podcast-episode-9/

Koczon 的觀點 是，"設計" 這個概念，特別是在技術圈，被神聖化了，並且——這裏加上一點我自己的理解——這個詞本身變成了一個空洞的容器，我們可以用它裝下我們自己的強烈信念和理想，裝下我們想要或希望的東西。根據 Koczon 的說法，這樣實際上並不會導致設計師們——也就是創建出這些神聖容器的人們——獲得更高的地位，而只是讓 "設計" 這個詞以及相關的 "設計理念" 火了起來而已。

• Cameron Koczon 設計的重要時刻

  https://alistapart.com/article/an-important-time-for-design

我認爲，通過理解這種觀點，讓自己從這種單一的思維模式——即設計在某種程度上是一種更高級一些的運營模式——中抽離出來，讓我發現，也許在技術領域，設計的正統地位還有挑戰的餘地。

我曾經考慮過根據用戶的個人狀況來自我調整的用戶界面，但當下我們仍然需要使用比較靜態的用戶界面來完成交互。 我們可以放下對 "設計" 這個詞彙概念的執着，重新從字體設計等學科的直觀實踐中找回初心，以便爲我們的工作提供借鑑和動力。

學會相信直覺

當我開始學習字體設計時，有一件事情我必須適應，那就是拋棄對數字的依賴。每當我開始注意字寬和字距時，我都有衝動去做一套量化的系統，去計算出字母間的正確距離，一定可以這樣的對吧？——我錯了。而且錯得很離譜。

字體設計的許多細節是通過視覺效果來調整的 ，雖然聽到 "字體" 二字您會很習慣加上 "系統"，但字體系統本身卻並不是一套死板的標準，而是一個個變通與調整互相融合的產物。從界面設計到字體設計，基於視覺和基於數字的兩套思維模式始終會在字形細節這裏出現衝突。爲了擺脫這種撕裂 * ，我必須學會憑直覺行事。爲了做到這一點，我需要一個全新的視角。

* 譯者注:  經常做圖文混排的設計師們可以回想一下自己有多少次在純文本和圖形控件對齊時糾結不已。

留白不是浪費

在 John Downer 開辦的一個關於字母造型的週末研討會上，我發現了這個新視角。Downer 爲我們提供的一些觀點無疑改變了我對自己正在創造的東西的看法。

他說，不要把字母形狀看作躺在背景上的離散物體，而是要把它看成受背景約束的形狀。我們要塑造的是字母內部和其周圍的空間，而不是字母本身。我們應該清理墨水池 (做消減法)，而不是創建一個墨水池 (做加法)。

這番話讓我久久難忘。不僅是因爲它極大地影響了我對字體間距的理解，以及如何看待與背景和彼此相關的字母的方式，而且也因爲這番話對界面設計也有廣泛的適用性。

根據我接觸到的信息來看，對當今的界面最常見的批評之一，特別是在瀏覽器或大屏幕上，就是有太多的留白區域——對寸土寸金的小屏幕界面，這種批評只會更甚。這個留白空間通常被稱爲 "浪費"、"未使用" 或 "空白"，但如果我們按照 Downer 看待字體的方式來看待它，就會發現，我們可以重新審視留白是否就等於浪費空間。我認爲答案可能會令人喫驚。

留白也是一種造型手段，留白與留白聯手在它們之間塑造了一個有形式、有意義的空間。

通過這種視角，我們可以給各種空間賦予造型職責——它可以創建或消除間距、連續性或區塊。如果不在這些地方留白，各個內容塊的功能將被大大削弱。傳統的量化體系在這裏不太適用，在界面佈局上，我們不要簡單地理解爲 "劃出一塊界面來承載信息"，而是要統合考慮各個區域在整體佈局中的角色。

一組靈活的概念

我不是一個喜歡說 "我知道的最好的 xx 是這樣做的" 的人，所以當我說我知道的最好的設計系統並不是約束性系統的時候，請不要批評我。

(自移動互聯網以來)，界面設計已然是一幅復興的局面，但這個局面所招致的一個主要批評是，平臺的設計系統對於設計師而言過於嚴格，扼殺了表達、擴展以及直覺 (而直覺恰恰是我希望在這篇文章中提倡的)。我們早期在 Google 確實聽到了關於 Material Design 過於死板的批評，但是 Material 也在進步。2018年， Material Theming   的概念爲這套系統提供了一系列廣泛的子系統和可以調節的參數，使設計師能夠在創建獨特且富有表現力的設計體系的同時，依然保持 Material 的基本概念和可用性。

例如，4dp 圓角半徑，並不意味着所有組件都將具有 4dp 的圓角——這個弧度可以變化，依據的可以是組件的體積，它在界面中的權重，甚至用戶對它採取的操作。組件以及組件的風格可以被修改，並使其不對稱，以適應或強調某個交互。Material 中的形狀系統具有堅實的內部邏輯，但依然保留了廣闊的表達空間。

字體的內部以相同的邏輯運作。不要將一個個字母像磚頭一樣生硬地堆砌在一起，而是要爲每一個字母賦予靈活性，讓它們以及它們周圍的空間可以被延展或壓縮，從而在整體上組成一幅和諧的圖卷。

當我設計 Wakehurst (上圖所示的字體) 時，我在一些有突出筆畫的字母上採用了有機的、"旺盛生長" 的枝葉。雖然它們看起來很像隨意生長的蕨類植物，但卻被包含在了一組理性的、有組織的字形中。它們更像是溫室中被精心培育的蕨類，而不是樹林中野生的。如果仔細查看字母 a 的頂部，然後對比 j、y、＆、c 字母，就可以看到隱藏在其中的一致性。

換句話說，字體系統，雖然有 "系統" 二字在裏面，但它其實是一個略微寬鬆的設計主題。一組具有相關性和獨特生物學意義的植物可以在 Wakehurst 紮根，也可以在您的設計系統中紮根。

在界面設計中，這些新的植物經常會響應新的或不斷變化的需求或環境而出現。比如說不同的土壤，不同的降雨和陽光。一隻覓食的生物也許會出現，並啃咬界面裏的按鈕組件。我是不是把這個比喻用得太過分了？——但希望能傳達出界面設計中 "靈活性" 這個概念。

對任何系統，不論是界面系統還是生態系統，擴展性、表達性和演變能力都至關重要。

給設計自我表達的空間

讓我們回到 Material Design，如果把同一個設計主題交給一個大型組織的各個產品團隊，然後讓他們刻板地執行這套設計的話，即便是靈活性很強的 Material Design 也會無力迴天。畢竟，刻板執行會帶來太多刻意的重複，就像是一套看了無數遍的表情一樣，難免會覺得乏味。

我更傾向於將這種統一的設計主題理解爲一個調料罐，裏面包含了表達自己產品特色的調料。我之所以這麼說，是因爲我們已經將其拓展成了 Google Material， 並將其應用在了不同的產品之中 ，並且它們都彰顯着自己的個性，同時 Google 整體的品牌感覺依然被完整保留着。

△ Google News, Google Home 以及 Gmail 都使用 Google Material 主題，但卻各有千秋

與許多設計系統一樣，Google Material 擁有自己內部的子規則，來實現前面提到過的擴展性、表達性和演變能力。雖然系統提供的各種組件和交互都非常品牌化，但團隊在將 Google Home、Tasks、Calendar、Keep 和 Gmail 等應用與 Google Material 結合時做得非常出色，讓每個產品都保持住了核心的個性與體驗。

就像 Wakehurst 會在不同的字母上使用不同的襯線細節一樣。比如將圓滑的襯線用在 $ 字母上，這樣它看起來就會和 S 字母更加不同。您確實可以死板地將同一套襯線規則用在所有的字母上，但如果仔細考慮每個字母被閱讀時用戶的感受，您就會做出不同的選擇。

善用直覺

事實上，作爲人類，我們都會在設計過程中 "摻雜私貨"。我們多年積累的經驗、閱歷、品味、乃至信仰，都會在我們的工作中得以體現。我們創造的東西當然是我們自身的延伸。雖然我們需要在工作中免受個人情感的干擾，但是我們不可能不在產品中看到我們自己的影子。

同一位開發者在兩天裏寫同一個功能，其代碼可能完全不同。同樣，作爲字體設計師，我也可能沒辦法重現之前繪製的弧線，所以我總是很小心地管理我的工作文件。

直觀的成分可能會給人以不穩定的感覺。如果一個系統裏缺乏準確可靠的規則，用戶就會感到風險的存在。

我們的工作會很自然地反映出我們個人生活的方方面面。首先，作爲設計師，我們很有必要去和擁有各種視角，去和來自不同背景，擁有不同經歷的人們合作。但與此同時，我們也很有必要利用好那些構成我們自身的本能和直覺的東西，從而構建出富有同理心、考慮周全，並擁有高可用性的符合普世價值的產品。

Warhol "讓那邊更藍一些" 的繪圖技巧雖然聽起來很主觀，但他也是一位印刷大師，他的選擇是他主動平衡大批量生產需求的思想產物。

不將印刷字形看作固定物體，而是看作由它們所佔據的空間限定的形狀，這種思維方式有助於創建出高可讀性、易於理解的文本。

按照組件大小、高程和重要性功能 對組件進行塑形 ，可以爲複雜的界面構建出強大的用戶心理模型——讓他們更容易知曉目前界面所處的狀態，以及需要做什麼。

這些例子的目標可能各不相同，但是整個過程、運作中的系統體現出的人文素養，以及我們圍繞這個過程建立的直覺，這些因素彼此之間的相似程度可能超出我們現有的認知。

因此，正如人們常說的 "藝術離不開設計"，我認爲，設計也離不開藝術。

在產品設計領域，一直都有 "功能優於美學" 的聲音，但也許這只是我們看待產品設計的一種角度而已。也許當我們從另一個角度看待產品時，會發現功能和美學，其實都是藝術的一種表現形式。

點擊屏末   |  閱 讀 原 文  |   進一步瞭解 Material Design 設計規範

推薦閱讀