← 所有文章

設計哲學:Susan Kare——有意義、令人難忘、清晰明確

核心原則

「有意義、令人難忘、清晰明確。」——Susan Kare,談定義優秀設計的三個形容詞1

Kare 設計了最初的 Macintosh 圖示——微笑 Mac、炸彈、垃圾桶、畫筆、Command 鍵——用的是 32x32 像素格線和一本 2.5 美元的方格紙素描本。每個圖示都必須讓從未使用過電腦的人一眼理解其功能。限制條件是絕對的:1,024 個黑色或白色方格,要傳達一個不需要說明就能理解的概念。她不把限制當作阻礙,而是當作問題本身來解決,並從最古老的視覺傳統中汲取靈感:十字繡、馬賽克拼貼、民間符號和交通標誌。

她的圖示賦予了 Macintosh 個性。在 Kare 之前,電腦透過命令列溝通。在 Kare 之後,電腦透過你可以指向的隱喻來溝通。垃圾桶代表刪除。帶摺角的文件代表檔案。微笑的電腦代表一切運作正常。這些隱喻已深深嵌入計算機運作中,我們甚至不再注意到它們是被設計出來的。這種「隱形」正是對這些作品最高的讚美。

背景脈絡

1982 年,Susan Kare 是住在舊金山灣區的雕塑家。她擁有紐約大學美術博士學位,博士論文研究的是 Honore Daumier 和 Claes Oldenburg 雕塑中的漫畫特質。她曾在舊金山美術博物館擔任策展人。當電話響起時,她正在為阿肯色州的一間博物館焊接一座等身大的野豬雕塑。2

高中老友 Andy Hertzfeld 是 Macintosh 團隊的軟體工程師,他提議用一台 Apple II 電腦交換她「手繪一些圖示和字型元素」。Kare 毫無電腦繪圖經驗,也不懂字型設計。她去帕羅奧圖公共圖書館借了幾本排版書籍,在 University Art 文具店花 2.5 美元買了能找到的最小方格紙,然後去參加了一場只持續五分鐘的面試。「你什麼時候可以開始?」他們讓她成為 Macintosh 軟體部門的第 2 號員工,職稱是「Macintosh 藝術家」。2

時機至關重要。Apple 正在打造第一台面向大眾市場、具備圖形使用者介面的電腦。Lisa 已經建立了概念,但 Macintosh 必須價格親民且平易近人。螢幕上的每一個元素——圖示、字型、游標、對話框——都需要與從未碰過電腦、甚至可能害怕電腦的人溝通。Kare 後來說:「我希望能幫助打破電腦冰冷、令人生畏的刻板印象。」3

她沒有接受過數位設計的訓練,因為這個領域尚不存在。她擁有的是美術教育背景、雕塑家在限制條件下掌握形式的能力,以及從民間藝術、十字繡和符號系統中培養出的視覺隱喻直覺。「點陣圖形就像馬賽克、十字繡和其他偽數位藝術形式,這些我在進入 Apple 之前都已經實踐過了,」她說。3 對一個多年來在方格紙上填格子、在刺繡中數針數的人而言,像素格線並不陌生。

作品

Macintosh 圖示(1983-1984):讓機器有人性

Hertzfeld 告訴 Kare 去買方格紙,畫出 32x32 的格線。每個填滿的方格就是一個像素。她用鉛筆和彩色筆繪製圖示,在紙上測試隱喻,然後才搬到螢幕上。當 Hertzfeld 寫了一個圖示編輯器讓她用滑鼠切換位元時,素描本成了設計工具,編輯器成了製作工具。她的原始素描本現在是 MoMA 的永久收藏品,2015 年與 SFMOMA 聯合購入。4

微笑 Mac——開機時迎接使用者的微笑電腦臉——是為了消除恐懼而設計的。炸彈圖示——在系統錯誤時出現——設計意圖是「俏皮而非令人驚慌」。油漆桶曾測試過油漆滾筒和其他幾個方案,最終 Kare 選定了傾倒的漆桶,因為它「對人們來說最合理」。垃圾桶的概念源自 Lisa,但因 Macintosh 的像素尺寸不同而重新繪製。2

每個圖示都經歷了一套特定的設計流程:Kare 會製作多個方案,然後拿給人們看,觀察他們的反應。「我會嘗試做出幾個選項,然後徵求大家的意見,」而非直接宣布最終設計。她刻意避免使用文字和雙關語:「我盡量不用文字,也不用雙關,因為它們無法翻譯。」這個決定——只用視覺隱喻,不依賴英語——意味著這些圖示從發布起就能跨越所有語言。2

Command 鍵有一段最具體的起源故事。Steve Jobs 走進軟體部門宣布:「螢幕上的蘋果太多了!簡直荒謬!」團隊原本把 Apple 標誌用作鍵盤修飾鍵符號,Jobs 要求替換。鍵盤硬體已接近定案——他們只有幾天而非幾週的時間。Kare 在一本國際符號辭典中找到一個環狀方形符號(Bowen 結,在瑞典露營地地圖中表示「景點」),並創建了一個 16x16 像素的點陣圖。團隊通過了。自 1984 年起,這個符號出現在每一台 Mac 鍵盤上。5

Chicago 字型(1984):限制即媒材

Macintosh 需要一套系統字型。Kare 在每個字元 9x7 像素的格線內設計了 Chicago,筆畫僅限水平、垂直和 45 度角。沒有曲線。這個限制不是出於美學考量——在點陣解析度下,曲線會產生鋸齒狀邊緣(「jaggies」),使文字更難閱讀。透過限定使用直線和 45 度斜線,Kare 打造了一套在 Mac 72 dpi 螢幕上清晰可辨的字型。2

這套字型最初的佔位名稱是「Elefont」。Jobs 為它改了名。最初的 Macintosh 字型以費城主線通勤火車站命名,但 Jobs 認為它們應該是「世界級城市」——Chicago、Geneva、London、Toronto、Venice、New York。Chicago 從 1984 年一直擔任 Apple 的系統字型直到經典 Mac OS 時代,又在 iPod 介面(2001-2004)中重新啟用,持續使用超過二十年。2

Chicago 是大眾市場個人電腦上第一套比例間距的系統字型——一改大多數使用者所熟悉的等寬打字機字型。每個字母僅佔其字形所需的空間。單是這一個決定,就讓 Macintosh 螢幕的觀感從終端機變成了印刷頁面。

Windows 3.0 接龍紙牌(1990):跨平台的清晰度

離開 Apple 和 NeXT 後,Kare 開設了自己的工作室。Microsoft 聘請她為 Windows 3.0 的接龍遊戲設計紙牌圖案——這款遊戲的存在目的就是教使用者操作滑鼠:拖曳、放下、點擊。Kare 使用 Microsoft Paint 和 16 色 VGA 調色盤完成了設計。6

「紙牌面只需要黑色、紅色和黃色,」她說。「我從經典紙牌牌組中汲取靈感,最有趣的是嘗試將 J、Q、K 複雜的圖案轉化到 72 dpi 的格線上。」同一套紙牌設計被 Microsoft 從 1990 年使用到 2007 年——跨越數十億台 Windows 安裝持續使用了十七年。這項作品證明了她以限制為導向的方法並不侷限於特定平台。這套方法——理解隱喻、精煉到本質、讓真實使用者測試——從 Mac 移轉到 Windows,乃至任何擁有像素格線的媒介皆適用。6

方法論

四十年來,Kare 的流程始終如一:理解限制、找到正確的隱喻、將其精簡到能傳達概念的最少像素數,然後讓非設計師的人來測試。

她的主要參考書是 Henry Dreyfuss 的《Symbol Sourcebook》(1972),一本按類別編排的國際符號大全。她特別喜歡流浪者暗號那一章——流浪者旅行時用來溝通的符號。「我盡量不用英語,也盡量不用雙關,」她說,「因為它們無法翻譯。」2

她將自己的圖示哲學描述為設計「更像交通標誌而非插圖——一目瞭然,不堆砌多餘細節」。停車標誌不需要每兩年重新設計一次。設計得好的圖示也是如此。「似乎沒有人需要每兩年重新設計一次停車標誌,」她在一次播客訪談中這樣說。7

32x32 像素畫布——她認為「對圖示來說已經很慷慨了」——要求的是她所說的「一種獨特的極簡點描主義」。她熱愛「在 16x16 和 32x32 像素圖示格線中工作的解謎般樂趣,以及工藝與隱喻的結合」。8

當被問到限制是否會阻礙創意時,她直截了當地回答:「技術限制(例如只能用黑白,或螢幕空間有限)不一定會妨礙創意。重要的是了解什麼是可行的,然後從那裡出發。」9

影響脈絡

影響她的人

Paul Rand 是她公開表示的「設計英雄」。她奉行他的格言:「不要試圖做到原創,只要試圖做到好。」在 NeXT 時期,她把 Steve Jobs 引薦給 Rand,並聘請 Rand 設計 NeXT 標誌——將她職業生涯中最重要的兩個人連結在一起。(直接影響)1

Henry Dreyfuss 塑造了她的方法。他的《Symbol Sourcebook》(1972)是她圖示設計的主要參考。書中對通用符號的分類——交通標誌、流浪者暗號、科學記號——賦予了她一套無需語言就能溝通的視覺詞彙。(直接影響)2

民間藝術、十字繡和馬賽克拼貼為她提供了點陣圖工作的形式語彙。她認知到填充像素與在刺繡中數針數、在馬賽克中擺放磁磚結構上完全相同:「學過藝術史就會知道太陽底下沒有新鮮事——你有沒有看過 18 世紀的十字繡?」7

她影響了誰

1984 年以來的每一個圖形使用者介面。 Kare 的 Macintosh 圖示建立了後來成為通用標準的視覺隱喻:帶摺角的文件、垃圾桶、手型指標、搜尋用的放大鏡。這些並非理所當然。必須有人決定「刪除」看起來像垃圾桶,「檔案」看起來像摺頁。Kare 做出了這些決定,此後每一個作業系統都沿用至今。

Emoji 設計師。 Kare 的 Cairo 字型(1984)是一套原型 emoji——一套包含棕櫚樹、新月、滑板和其他象形字元的字型。2 它是 Shigetaka Kurita 在 1999 年為 NTT DoCoMo i-mode 平台設計 emoji 的概念先驅。Cairo 利用字型欄位編碼象形意義而非字母字元——比 emoji 成為全球溝通系統早了十五年。

貫穿的主線

Kare 證明了限制不會扼殺創意——它聚焦創意。一個只有黑白兩色的 32x32 像素格線不是牢籠,而是設計簡報。限制迫使每一個像素證明自身存在的意義,這正是 Dieter Rams 的第十項原則應用在不同媒介上的體現。(系列連結)

我從中學到的

「給我 16x16 像素和一個概念,我就無所畏懼。」這就是那種態度。限制是工具,不是障礙。

常見問題

Susan Kare 的設計哲學是什麼?

Kare 的哲學建立在三個詞上:有意義、令人難忘、清晰明確。她將圖示設計視為在限制條件下的視覺問題解決,取材自民間藝術、十字繡和國際符號系統,而非插畫。她的圖示運作方式「更像交通標誌而非插圖——一目瞭然,不堆砌多餘細節」。7

Susan Kare 設計了什麼?

Kare 設計了原始 Macintosh 圖示(微笑 Mac、Command 鍵、垃圾桶、炸彈、油漆桶)、Chicago 字型、Cairo 原型 emoji 字型,以及 1984 年 Macintosh 的系統圖形。她後來為 Windows 3.0 接龍設計了紙牌面(使用期間 1990-2007),為 Facebook 設計虛擬禮物,並曾與 Pinterest 和 Niantic Labs 合作。26

Susan Kare 如何影響了現代設計?

Kare 建立了定義圖形計算的視覺隱喻:代表刪除的垃圾桶、帶摺角的文件圖示、手型指標,以及軟體應透過可辨識的符號而非文字命令來溝通的理念。她的 Cairo 字型(1984)是一套象形字型,比 Shigetaka Kurita 的 emoji 早了十五年。2

設計師能從 Susan Kare 身上學到什麼?

限制聚焦創意,而非限制創意。32x32 像素格線迫使每一個像素證明其存在的意義。用真實使用者測試設計,而非讓其他設計師來評判。避免使用文字和雙關語,因為它們無法翻譯。從現有的符號系統(交通標誌、民間藝術、國際象形圖)中取材,而非從零發明新的視覺語言。


參考資料


  1. Susan Kare, Q&A for Cooper Hewitt National Design Awards, 2019. “NDA 20 Yrs: Q&A with Susan Kare.” “Meaningful, Memorable, Clear” as her three adjectives for good design. 

  2. Susan Kare, interview with Alex Pang, Stanford University, September 8, 2000. Full transcript. Primary source for: graph paper process, icon design decisions, font naming, Paul Rand, Andy Hertzfeld recruitment. 

  3. Smithsonian Lemelson Center for the Study of Invention and Innovation, “Susan Kare: Iconic Designer.” “Bitmap graphics are like mosaics and needlepoint” quote and biographical context. 

  4. MoMA, “Apple Macintosh OS Icon Sketchbook, 1982.” Bound sketchbook, ink and felt-tipped pen on paper. Gift of Susan Kare. 

  5. Andy Hertzfeld, “Swedish Campground,” Folklore.org. Primary source for the Command key origin story, including Jobs’ “too many Apples” outburst. 

  6. Susan Kare, interview with Designboom, October 2014. “Interview with graphic designer Susan Kare.” “Give me 16x16 pixels” quote and Solitaire card design details. 

  7. Susan Kare, “Pixels and Personality,” Ledger podcast. “Nobody seems to need to redesign the stop sign” and needlepoint comparison quotes. 

  8. Susan Kare, AIGA Medal acceptance / New Yorker interview, 2018. “Puzzle-like nature” and “peculiar sort of minimal pointillism” quotes. 

  9. Susan Kare, interview with Quartz, October 2019. “Mac icon designer Susan Kare explains the inspiration for her designs.” “Technical constraints don’t necessarily hamper creativity” quote. 

相關文章

設計哲學:Tobias Frere-Jones——字體的存在是為了解決問題

Tobias Frere-Jones 逐街走遍曼哈頓,拍下招牌上的字母,再從中打造出 Gotham。他的字體是城市的基礎建設。

2 分鐘閱讀

設計哲學:Don Norman——錯不在使用者

Don Norman 發明了「使用者體驗」一詞,命名了「Norman Door」,並證明當使用者犯錯時,是設計出了問題——而非人的問題。

2 分鐘閱讀

字級階梯:我如何選擇 13 個級距,以及比例為何重要

本站使用12px到80px的13級字體比例。如何選擇比率、系統字體為何優於自訂字體,以及斜視測試的啟示。

3 分鐘閱讀