如何落實"數位優先"的UI設計?讓奧迪和福斯告訴你!(中)

 

 

這篇的UI設計介紹要延續上一篇的內容:奧迪和使用戶,如何靠著UI來連結彼此?

 

 

本篇為Audi篇的下集,上集「為落實“數位優先”的UI設計...Audi竟將LOGO壓扁了!(上)」請點此連結

 

 

字體

6.png

▲ 新 Audi Logo 與字體搭配的準則。

新的 Audi 字體也隨著新的 logo 曝光!

Strichpunkt 表示:隨著新的「簡潔有力」的清新風格的 Audi logo。

 

7.jpg

▲ Audi 標語的使用範例(總是以小型字體出現在畫面的角落)。

圖標

 

11.png

▲ 各式新的 Audi UI icons 為線條化設計,靈感來自精確的車輛工程設計圖

而用於網站、app、車用數位裝置的 2D 線條線條化圖標,Strichpunkt 表示設計靈感是來自 在Audi 車輛研發設計時,工程師繪出的精確的工程設計圖。

 

12.jpg

▲ 新的 Audi UI icons使用範例

影片

▲ Strichpunkt 替出現於新 UI 介面上的 Audi 影片立下「S 型曲線」原則:「一開始強而有力的加速啟動,然後在結束時迅速減速」。

而所有出現在數位裝置上的 Audi 形象影片動作,也都遵循著 S 型曲線模式,Strichpunkt 表示「一開始強而有力的加速啟動,然後在結束時迅速減速。」

奧迪也為此新視覺辨識制定了品牌指南,製作「Audi 品牌指南網站」,各式資源開放給大眾免費瀏覽、下載,包含全新設計的 Audi Logo、字體、形象圖片、影片,甚至連 HTML 原始碼、被淘汰的設計都在上面,讓用戶能親自感受參與他們品牌的重塑過程。

現在,Strichpunkt 將在子網域上啟動一個互動式工具,使用戶們都可以模擬奧迪風格的設計、字型、排版,背景和顏色。而之後,該工具會告訴他們其模擬作品是否符合 Audi 的設計原則與方針。

是不是沒想到UX和UI設計也能有這種功能!

 

13.jpg
▲ 各式新的 Audi 廣告,應用了所有 Strichpunkt 為 Audi 打造的 Logo、構圖、字體、等元素。

Strichpunkt 表示:這一連串的互動式工具,都是為了讓新的 Audi 品牌設計方針能「更平易近人」,與 Audi 的新品牌識別「accessible to everyone(每個人都可使用)」相呼應。

「這是汽車業的創舉,為新的開放式的象徵(a symbol of new open-ness)」。

由此可見,UI和UX設計也可以成為大品牌和使用戶的強力連結!

 

本篇為Audi篇下集,下一篇為福斯UI的介紹「不落後於 Audi,福斯跟進「數位優先」視覺辨識與UI」請點此連結

 

 延伸閱讀看這裡:

如何落實"數位優先"的UI設計?讓奧迪和福斯告訴你!(上)

如何落實"數位優先"的UI設計?讓奧迪和福斯告訴你!(下)

網路行銷重要,厲害的使用者介面更重要!-絕不要錯過的UI課程!

網頁設計課程入門1-如何讓HTML與CSS完美合作?

網頁設計時,要如何達到無痛優化呢?

醫療產業+UI課程=高薪專業人士,人生雙贏不GG

達內教育學員見證

2天考取Google Ads證照!新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證?五種 GoogleAds 廣告不藏私攻略

從無到有 挑戰14小時取得Google證照

 

arrow
arrow
    創作者介紹
    創作者 Uder.chain 的頭像
    Uder.chain

    娶了UI設計師的Python工程師-北歐生活

    Uder.chain 發表在 痞客邦 留言(0) 人氣()