目錄
AUDI 的「數位優先（digital-first）」UI 設計策略
▲ 因應 Audi 的「數位優先」品牌重塑計畫，德國設計公司 Strichpunkt 幫 Audi 打造出極簡一致、功能為主的跨平台 UI 介面。主要元素為區塊佈局、簡單配色、獨特的 Audi 字體以及平面化的 Audi 標誌
現今人們上網的媒介已不再侷限於桌上型電腦，手機上網、或是在車上裝設平板電腦上網早已普及。因此德國汽車公司 Audi 早在於2017 年透露了他們的品牌重塑（rebrand）計畫，以「數位優先（digital-first）」為其主軸。
「數位優先（digital-first）」的品牌重塑（rebrand）計畫聚焦於數位裝置的 UI 設計，期望更多用戶，無論是使用平板、手機、桌上型電腦等上網媒介瀏覽 Audi 網站、或是使用 Audi 的 APP 等上網行為，都能有更好的使用者體驗（UX）。德國的設計公司 Strichpunkt 負責這次 Audi 品牌重塑計畫的 UI/UX 設計，並期望讓所有的數位平台 —— 從 Audi 的網站、app 應用程式到車上的數位裝置（包含數位螢幕、聲音 app 及包含智慧手錶在內的所有數位產品等）都維持一致。
▲ Audi 的「原子設計（atomic design）」基本概念。
此次「品牌重塑」專案可說是顛覆性的翻新，Strichpunkt 創建了新型態的「原子設計（atomic design）」思路：在評估數位設備的外觀時，我們將 Audi 的視角變化應用於設計上面。。 我們的思考過程不只是從最小的設備開始，而且是從設計的最小元素開始。」延續此「原子設計」的設計方法， Strichpunkt 建構出一套功能優先、走極簡風格的 UI 使用者界面。這套新 Audi UI 用戶界面已於 2017 年公開於網路上：任何人都可以從 GitHub 或是 Audi UI Photoshop kit 下載使用 Audi 圖標，UI 組件和字體。
▲ Audi 的新 UI 介面佈局
簡要概述一下這次 Audi 的新 UI 設計：「介面佈局大至上分為垂直和水平的區塊，以達成視覺上的平衡。內容則顯示在這些方形區塊中；而這些方形區塊也置入於與設備的（螢幕）邊緣隔開的網格中。當這些方形區塊被賦予其他的附加功能時，則被視為「卡片」。為了被使用者重視，所有的元素都在階層式的結構中突出顯示。
▲ 替 Audi 設計新 Logo 的設計公司 Strichpunkt 上傳的 Audi 品牌重塑影片-展示了 Audi 的品牌形象、字體、網站以及各裝置的 UI 使用者介面。
根據裝置螢幕的大小，Strichpunkt 使用了簡單的黑色、白色、灰色、紅色和不同色階的銀色，以及不同的字體大小。您可以在這裏找到更多有關Audi UI 使用者介面設計的詳細信息。
▲ Strichpunkt 為了 Audi 的新 UI 設計，所打造的全新 2D 化 Logo、新 Audi 字體、品牌配色；下方則是用於網站、app、車用數位裝置的線條化圖標以及 S 型曲線模式
新的Audi Logo-2D扁平化
▲ Audi 的新 Logo 由原本的立體風變為 2D 平面風，俐落的外型更適用於嵌入各式各樣的設計。
Strichpunkt 替 Audi 完成了新的 Logo 設計，一改原本的「仿3D」立體設計，而以 2D 的 Logo 取代之。Logo 造型為扁平的四個圈圈、沒有品牌文字在 LOGO 下方、顏色非黑即白。
字體
▲ 新 Audi Logo 與字體搭配的準則。
新的 Audi 字體也隨著新的 logo 曝光。Strichpunkt 表示：隨著新的「簡潔有力」的清新風格的 Audi logo。
▲ Audi 標語的使用範例（總是以小型字體出現在畫面的角落）。
圖標
▲ 各式新的 Audi UI icons 為線條化設計，靈感來自精確的車輛工程設計圖
而用於網站、app、車用數位裝置的 2D 線條線條化圖標，Strichpunkt 表示設計靈感來源自 Audi 車輛研發設計時，工程師繪出的精確的工程設計圖。
▲ 新的 Audi UI icons使用範例
影片
▲ Strichpunkt 替出現於新 UI 介面上的 Audi 影片立下「S 型曲線」原則：「一開始強而有力的加速啟動，然後在結束時迅速減速」。
而所有出現在數位裝置上的 Audi 形象影片動作也都遵循 S 型曲線模式，Strichpunkt 表示「一開始強而有力的加速啟動，然後在結束時迅速減速。」
奧迪也為此新視覺辨識制定了品牌指南，製作「Audi 品牌指南網站」，開放各式資源給大眾免費瀏覽、下載，包含全新設計的 Audi Logo、字體、形象圖片、影片，甚至連 HTML 原始碼、被淘汰的設計都有，讓用戶感到有參與到他們的品牌重塑過程。
現在，Strichpunkt 將在子網域上啟動一個互動式工具，使用戶可以模擬奧迪風格的設計、字型、排版，背景和顏色。然後，該工具會告訴他們：其模擬作品是否符合 Audi 的設計原則與方針。
▲ 各式新的 Audi 廣告，應用了所有 Strichpunkt 為 Audi 打造的 Logo、構圖、字體、等元素。
Strichpunkt 表示：這一連串的互動式工具，都是為了讓新的 Audi 品牌設計方針「更平易近人」，與 Audi 的新品牌識別「accessible to everyone（每個人都可使用）」相呼應。「這是汽車業的創舉，為新的開放式的象徵（a symbol of new open-ness）」。
不落後於 Audi，福斯跟進「數位優先」視覺辨識
▲ 新的福斯LOGO設計由原本的「仿3D」變回2D平面icon，就可零違和地嵌入於更多裝置的UI視覺設計。
而 2019 年 7 月，德國的另一間汽車公司-福斯汽車也宣布將推出全新 LOGO。同年的 9 月 10 日，在法蘭克福國際車展前夕的「福斯之夜」上，福斯正式發布了全新的品牌標誌——也是將原本的立體風 Logo「平面化」，也表示品牌接下來的將有嶄新的商業策略。
▲ 福斯LOGO進化史-一切的LOGO變化都是為了符合當時的UX
由以上影片我們可以看到：2019 年的新 LOGO 整體造型依然使用字母「V」和「W」上下組合的形式，不過變得更簡單直觀。原先設計成浮雕概念的立體造型，改為平面化 2D 風格，「V」和「W」兩個字母中間的空隙變大，「W」的底部和外部圓圈完全脫離，留下了空間。
其實「扁平化」是現代數位時代的設計趨勢，除了福斯，許多知名廠商的 LOGO 也都改頭換面、採用扁平化的設計，如 Google、YouTube、Netflix、ebay、Citroën等。
扁平化設計為去除陰影、漸層和反射光澤等3D要素，通常使用高亮度的色彩，搭配無襯線字體，呈現出簡約現代風格。目的為減少不必要的裝飾元素，將核心元素明確傳達，除了LOGO，UI設計也正流行扁平設計。
同時，這種簡約的設計無論在傳統印刷輸出、電視或螢幕相對較小的智慧手機上，都能更好更快地呈現，也更符合現今數位化的潮流。
新LOGO也是新戰略
值得注意的是，福斯這次不只換了Logo，連品牌識別聲音也換了。過去福斯汽車的廣告，結尾都是低沉渾厚的男性嗓音，但福斯大破大立，請到了德國著名的女演員露易絲‧海爾姆（Luise Helm）獻聲，打破多年聲音形象，改以溫暖、愉快、自信的女性聲音取代。以後的福斯廣告都將使用女聲來宣讀「福斯」品牌名了。
▲ 福斯熱門主打車款「Golf 8」廣告即為女聲宣讀品牌名稱
新LOGO的同時展現了福斯汽車朝向電動化新時代發展的決心。
福斯汽車準備電動化轉型雖已有一段時日，但關鍵轉捩點是在2016年，當時福斯集團（Volkswagen AG）爆出廢氣排放超標醜聞：福斯在美國銷售的車款中植入規避官方檢驗的軟體，在官方檢驗時自動調整數字以通過廢氣排放標準，但實際上這些車輛排放廢氣全超標10至40倍。
這起醜聞發生後，福斯集團便改變策略，朝新替代能源發展。
福斯近期全力主打的，就是在法蘭克福車展亮相的電動車ID.3，是全世界首款採用碳中和製程的電動車款，已在歐洲地區正式接單。明年系列車款ID. CROZZ SUV、ID.BUZZ、ID.VIZZION和ID.BUGGY等各式電動車也將陸續加入。
福斯第一款全電動車以「3」命名，代表正式在電動車領域踏出關鍵一步，與為了成為全球車壇的電動車領導品牌的決心。
現在是汽車產業全速往電動車發展的重要時間點，老牌車廠換上新裝，在這個新戰場的表現如何，就讓人拭目以待了。