DESIGN HISTORY · SWISS STYLE
QUICK ANSWER
瑞士風格(Swiss Style),又叫國際主義設計(International Typographic Style),是 1950 年代在巴塞爾與蘇黎世成形的平面設計方法:無襯線字、文字靠左對齊、網格、大片空白、用照片取代插畫。它的核心是先問「看不看得懂」,所以七十年後還活在機場指標、地鐵標誌和每一個 App 的網格裡。
CONTENTS
03
下次在機場找登機門的時候,抬頭看一眼那塊指標。
黑底白字、一個箭頭、一行英文、一行中文。你不用讀完,就已經知道該往哪走。
一般會覺得,設計風格是流行一陣子就退場的東西。但這塊指標的長相,七十年前就定好了,到今天幾乎沒變。它有個名字——瑞士風格。
我最近做了一支三分鐘的剪紙動畫,從 1928 年一路剪到今天,這篇是它的文字版。每一個年份、人名和冷知識都查過原始資料;動畫裡沒空講的細節,這裡一次補齊。
▲ 三分鐘剪紙動畫《Swiss Style 瑞士風格》
CHAPTER 01 · WHAT IS IT
瑞士風格(Swiss Style)也叫國際主義設計(International Typographic Style)。它是一套方法,不是一套裝飾:設計師不從「我想要什麼感覺」出發,而是從「讀的人需要先看到什麼」出發。
拆開來,就是五條到今天還在用的規則:
01
無襯線字
Sans-serif
筆畫粗細均勻、沒有裝飾腳,遠看近看都清楚。代表字體是 Akzidenz-Grotesk 和後來的 Helvetica。
02
靠左對齊
Flush left, ragged right
左邊切齊,右邊長短不齊。字距不會被硬撐開,閱讀節奏最自然。
03
網格
Grid
先畫欄位,再把文字和圖片放進格子裡。每個元素的位置都有理由。
04
大片空白
White space
空白是結構的一部分,用來分組、用來讓重點被看見。
05
照片取代插畫
Photography
照片被認為比手繪更客觀,搭配黑白對比與幾何形狀使用。
五條加起來指向同一件事。過去的設計先問好不好看;瑞士設計師把順序倒過來——先問看不看得懂,好看是排整齊之後自然出現的。
CHAPTER 02 · ORIGINS
故事要從德國說起。1928 年,設計師 Jan Tschichold 在柏林出版了《新文字設計》(Die neue Typographie),出版者是德國印刷工會的教育部門。
當時的印刷品滿是花邊、裝飾字和置中排版。Tschichold 主張全部拿掉:只用無襯線字,版面不必對稱,每一個元素都要有存在的理由。這本書寫給的不是藝術家,是每天在工廠排版的排字工人。
1933 年納粹上台,他被扣上「文化布爾什維克」的罪名,和妻子一起被捕,警察還在他家裡搜出蘇聯海報。獲釋後,他帶著家人逃到瑞士的巴塞爾,此後的著作也都在巴塞爾出版。
有個常被略過的後話:1942 年前後,Tschichold 回頭批評自己當年的主張太極端、太權威,晚年改做古典的置中排版。開創規則的人親手修正了規則——這件事後來在瑞士還會再發生一次。
CHAPTER 03 · WHY SWITZERLAND
一套德國人寫下的主張,為什麼最後叫「瑞士」風格?
第一個原因是時機。二戰期間瑞士保持中立,設計師、印刷廠和學校都沒有中斷,想法得以在這裡繼續長大。
第二個原因更實際。瑞士有德語、法語、義大利語和羅曼什語四種國家語言,同一則訊息常常要讓說不同語言的人都看懂。清楚,在這裡不是品味,是生活需求。
這份刊物把瑞士風格的樣子推向全世界。《Neue Grafik》1958 年在蘇黎世創刊,由 Müller-Brockmann、Richard Paul Lohse、Hans Neuburg 和 Carlo Vivarelli 四位設計師共同編輯,到 1965 年一共出了 18 期(最後兩期合刊)。每一頁都用三種語言並排——三語版面本身,就是網格最好的示範。
CHAPTER 04 · TWO SCHOOLS
1950 年代,這套想法在兩座城市長成了完整的教學方法。
1942
Emil Ruder 開始在巴塞爾工藝學校教字體排印
1947
Armin Hofmann 加入巴塞爾工藝學校任教
25 年
Müller-Brockmann 替蘇黎世音樂廳等場館做海報與節目冊
18 期
《Neue Grafik》1958–1965 年的總期數
巴塞爾那邊,Emil Ruder 從 1942 年起在巴塞爾工藝學校(Allgemeine Gewerbeschule Basel)教字體排印,Armin Hofmann 在 1947 年加入。兩人後來合開了一個平面設計進階班,全世界的學生都跑來巴塞爾上課。
他們的課從最基本的練起:黑與白的對比、正形與負形、點線面的構成。目的不是做出漂亮的成品,而是讓眼睛學會判斷什麼是多餘的。
蘇黎世這邊,Josef Müller-Brockmann 把版面當成數學。先畫網格,再把文字和圖片放進格子裡。
從 1950 年代起的二十多年,他替蘇黎世音樂廳(Tonhalle)等場館做海報和節目冊。他的太太是音樂廳樂團的小提琴手,這層關係讓他對「把節奏畫出來」特別有感:海報上只有幾何圖形和字,卻能讓人看見音樂。
“
先問看不看得懂,好看是排整齊之後自然出現的。
CHAPTER 05 · HELVETICA
1957 年,瑞士明興施泰因(Münchenstein)的 Haas 鑄字廠推出一款無襯線字,叫 Neue Haas Grotesk。設計者是曾在 Haas 當業務的 Max Miedinger,委託他的是鑄字廠的老闆 Eduard Hoffmann。它不是憑空長出來的,最主要的參考對象是德國更早的 Akzidenz-Grotesk。
1898
Akzidenz-Grotesk
德國 Berthold 鑄字廠的無襯線字,瑞士設計師的愛用款
→
1957
Neue Haas Grotesk
Miedinger 為 Haas 鑄字廠設計,在洛桑的展覽首次亮相
→
1960
Helvetica
德國母公司 Stempel 為了賣到國外改名,取自拉丁文的「瑞士」
★
1960 年前後,德國的母公司 Stempel 要把它賣到國外,覺得原名不好記,改成 Helvetica——來自瑞士的拉丁文名稱 Helvetia。這個名字等於直接把「瑞士設計」當成賣點掛在字上。後來它成了世界上最常見的字體之一。
有趣的是,1950 年代瑞士設計師最常用的其實是 Akzidenz-Grotesk。Helvetica 會變成「瑞士風格的代表字」,很大一部分要歸功於這個名字。
CHAPTER 06 · GOING GLOBAL
1960 年代以後,這套方法走出了瑞士,進到企業識別、機場和地鐵。它的優點在這裡變得無可取代:要讓說不同語言、趕時間的陌生人在三秒內看懂,沒有比網格加無襯線字更好的解法。
1970 年,Unimark 事務所的 Massimo Vignelli 和 Bob Noorda 替紐約地鐵寫了一本標誌手冊。很多人以為從那時候起紐約地鐵就用 Helvetica——其實不是。
常見說法
查證後
1970 年手冊指定 Helvetica
手冊指定的是 Standard Medium,也就是在美國販售的 Akzidenz-Grotesk
設計師不想用 Helvetica
Vignelli 和 Noorda 其實想用 Helvetica,是地鐵自己的招牌工廠不想多花錢換字
從此全線統一
新舊招牌混在一起好多年,到 1989 年 Helvetica 才成為全線正式字體
1972 年慕尼黑奧運,德國設計師 Otl Aicher 從 1966 年起就負責整屆奧運的視覺。他做了一整套運動圖示:頭、身體、手腳的比例和角度全部由網格決定,只用垂直、水平和 45 度的線。不管觀眾說哪種語言,都找得到場館。這套圖示的邏輯,後來成了全世界公共標誌的共同語言。
想看瑞士風格影響了多少設計師,蘇黎世設計博物館(Museum für Gestaltung Zürich)的官方頻道有一系列訪談,這集是荷蘭設計師 Wim Crouwel 談他眼中的瑞士風格:
▲ 蘇黎世設計博物館官方頻道〈Talking About Swiss Style: Wim Crouwel〉
CHAPTER 07 · REBELLION
當然,任何規則最後都會遇到挑戰者。到了 1960 年代,網格在瑞士已經變成例行公事。
Wolfgang Weingart 1964 年從德國來到巴塞爾,先當旁聽生,1968 年起在巴塞爾的設計學校教字體排印。他開始讓字傾斜、層疊、跑出格子,把照片、網點和文字疊成拼貼。這股潮流後來被叫做 New Wave(新浪潮)。
但他的反叛有個前提。他說自己是把瑞士字體排印當成起點,「然後把它炸開」;他也承認瑞士字體排印有太多好東西,不可能整個拋棄。換句話說——要打破網格,得先懂網格。
“
要打破網格,得先懂網格。
CHAPTER 08 · TAKEAWAYS
TIMELINE · 一頁看完
1928
Tschichold 在柏林出版《新文字設計》
1933
Tschichold 被捕後逃到巴塞爾
1942–47
Ruder、Hofmann 先後在巴塞爾任教
1957
Neue Haas Grotesk 推出
1958
《Neue Grafik》在蘇黎世創刊
1960
改名 Helvetica
1968
Weingart 在巴塞爾開始教書
1970
紐約地鐵標誌手冊(指定 Standard)
1972
慕尼黑奧運圖示
1989
Helvetica 成為紐約地鐵正式字體
2026
網格還在每一個 App 裡
回頭看,瑞士風格留下來的從來不是某個字體或某張海報,而是一個工作順序:先定結構,再放內容。今天你在 Figma 開 12 欄網格、用 8 的倍數排間距,其實就是在用同一套方法。我在網頁排版的間距系統那篇整理過網格和間距怎麼落地,可以接著看。
這也是為什麼它不會退流行。風格會輪替——網頁設計三十五年的歷史就是一場一場的輪替——但「讓陌生人在三秒內看懂」這個需求不會消失。機場、地鐵、醫院、銀行、App 的設定頁,都還需要它。
最後說一點動畫本身。這支片的每一格畫面都是用程式碼算出來的,做法跟純程式碼動畫那篇一樣;畫面上的中文用的是臺灣道路體,字幕用的是開源的昭源黑體——一套模仿交通標誌的字,剛好拿來講一段關於標誌的歷史。字體授權和選字的眉角,可以參考德拉黑體與饅頭黑體那篇。
“
一套五〇年代在瑞士教室裡寫下的規則,到今天還藏在你每天滑的每一個 App 裡。
RELATED READS · 延伸閱讀
網頁設計的發展歷史:從第一個網頁到 AI 生成的三十五年演變
平面設計的網格,後來怎麼走進網頁。
閱讀文章 →網頁排版的間距系統:8pt 網格與四層間距
瑞士風格的網格,在今天的網頁裡長這樣。
閱讀文章 →平面設計 vs UI 設計:差在哪、薪水差多少、轉職難不難?
從海報到介面,兩條路的差別。
閱讀文章 →單色印刷的海報,AI 做得出來嗎?
兩塊印版、留白比例與字體角色,也是很瑞士的規格思維。
閱讀文章 →合格很便宜,好看很貴:Sagmeister 訪談裡,AI 跨不過的那條線
另一位大師怎麼看「清楚」與「好看」。
閱讀文章 →怎麼運用可變字體來設計文字筆畫
Helvetica 之後,字體設計還能怎麼玩。
閱讀文章 →繁體中文圓體字型去哪找?昭源環方完整解析
同一個開源字型家族,換一種情緒。
閱讀文章 →EXTRA · LINKS
MoMA 館藏:Josef Müller-Brockmann〈Der Film〉,1960
本文那張海報的原件資料
Lars Müller Publishers:Neue Grafik 1958–1965 復刻合輯
18 期《Neue Grafik》的完整復刻
蘇黎世設計博物館 Museum für Gestaltung Zürich
瑞士海報與設計的最大館藏
紀錄片《Helvetica》(2007,Gary Hustwit)官方預告
整部片都在講這一款字
FAQ
A:是。Swiss Style(瑞士風格)與 International Typographic Style(國際主義設計、國際字體排印風格)指的是同一套 1950 年代在瑞士成形的平面設計方法,前者強調發源地,後者強調它後來通行全世界。
A:五個最常被提到的特色是:無襯線字、文字靠左對齊右邊不齊、用網格安排版面、大量空白,以及用照片取代插畫。它們共同的目的是讓資訊最快被看懂。
A:Helvetica 由 Max Miedinger 為瑞士 Haas 鑄字廠設計,1957 年以 Neue Haas Grotesk 的名稱推出。1960 年前後,德國母公司 Stempel 為了外銷改名為 Helvetica,名稱來自瑞士的拉丁文 Helvetia。
A:不是。1970 年 Vignelli 與 Noorda 的標誌手冊指定的是 Standard Medium(也就是 Akzidenz-Grotesk 的美國名稱),因為地鐵的招牌工廠不想花錢換字。Helvetica 要到 1989 年才成為紐約地鐵的全線正式字體。
A:一是二戰期間瑞士保持中立,設計教育與印刷業沒有中斷;二是瑞士有德、法、義、羅曼什四種國家語言,訊息常要多語並排,清楚易讀成了實際需求。
A:適用。它留下的是一套工作方法:先定網格與層級,再放內容。今天的網頁 12 欄網格、8pt 間距系統、交通與醫院的指標系統,都是同一套邏輯的延續。
A:可以從 Jan Tschichold(理論起點)、Emil Ruder 與 Armin Hofmann(巴塞爾)、Josef Müller-Brockmann(蘇黎世、網格系統),再到 Wolfgang Weingart(反叛與新浪潮)依序看,就能看懂這套方法怎麼建立、又怎麼被打破。