字體設計

Spaceship 的字體環境採用兩種字體:親切且技術感的 Gotham Rounded,以及較簡約和幾何感的 Proxima Nova。

Hero Image

Spaceship 的字體設計自信且直接,讓我們能以親切和對話式的語氣與受眾溝通。



主要字體

Gotham Rounded是一款親切又具格調的字體。僅用於 Spaceship 標誌、產品子品牌及團隊身份識別。只允許使用中黑、書本和細字重。









次要字體

Proxima Nova是 Spaceship 圖像環境的關鍵元素。它是所有溝通的主要字體。僅允許使用粗體、中黑、常規和細字重。









比例

字體比例系統及所需的尺寸級距是根據黃金比例(1:1.618)建立和決定的。我們以主要基準尺寸建立了一套完整的字體比例組合,並配合字體比例計算器。由於黃金比例會產生較大的尺寸跳躍,因此需要一個次要基準尺寸(為基準尺寸的兩倍)來產生更理想的範圍。下方例子展示了以 16px 和 32px 為基準尺寸的字體比例。









文字樣式

Proxima Nova 在小型內文和大型標題中都能保持極高的光學一致性。其多樣的字重適合任何語氣或訊息。建議使用左對齊文字,但如有需要亦可使用置中對齊。




針對大型標題,請使用粗體、光學字距、自動行距,以及 80% 字間距。


一般標題請使用粗體、光學字距、自動行距,以及 80% 字間距。


針對短副標題,請使用中黑或常規字重、光學字距、自動行距,以及 100% 字間距。 


針對長副標題,請使用中黑或常規字重、光學字距、自動行距,以及 100% 字間距。


針對段落,請使用常規或細字重、度量字距、自動行距,以及 100% 字間距。


針對小型內文,請使用常規或細字重、度量字距、自動行距,以及 100% 字間距。







字體層次

為了有效建立內容層次,字體應該傳達標題、副標題和內文之間的組織關係。正確搭配字重和字體大小可營造強烈的視覺對比,並引導讀者。









安全邊距

我們以標題的行距作為行間距參考,確保最佳可讀性,並為後續文字區塊建立安全邊距。









色彩組合

使用純色背景時,只允許下列所示的色彩組合。










背景

在圖片或色彩背景上使用文字時,對比度和可讀性是關鍵要素。










指引

以下是處理文字時應避免的例子。




請勿大幅更改已定義的字距、字間距和行距數值。


請注意層次:標題要更突出,副標題較輕,內文等。


請勿使用右對齊段落。


請勿在任何文字上使用其他顏色,例如輔助色、產品色或子品牌色。


在色彩背景上僅可使用白色或深灰色文字。


可讀性最重要。請勿將文字放在複雜圖片或色調相近的背景上。