Banner
VISUAL IDENTITY SYSTEM

– 視覺識別系統 –

USER’S GUIDE

– 使用指南 –

1. 應先掌握基礎系統

本手冊按照由基礎至應用系統的順序編排,基礎系統是整個視覺識別系統的基石,應用系統是基礎元素的具體使用。兩系統既相對獨立,又有關聯性。在使用時,應首先明確基礎系統的指導原則和基本規定,在按照應用系統的規範執行,避免錯誤使用。

2. 嚴格執行規定

(一) 凡手冊明確規定的項目、規範和規格,如基礎部分和應用系統中的各項具體規定,應嚴格遵守,不得隨意更改。
(二) 凡手冊明確規定的部分,如今後新增的應用設計項目,凡設計標誌、標準字、標準色等基本要素,必須嚴格遵守基礎系統的有關規定,不得擅自更改。其具體表現形式、風格,也應參照本手冊類似的應用設計項目,保持整體風格一致。

3. 盡量採用誤差小的使用方式

實施應用設計項目時,對使用的圖形,應儘量從本手冊下載。在無法使用電子文件的情況下,可按本手冊規定的制圖法生產。使用的色彩以本手冊提供色值為基準。

DESIGN SIGNIFICANCE

– 設計概念 –

Designsignificance01

每一次的品牌溝通都應該把握住這些特色,讓人能看到品牌商標時就能充分連結這些想法。商標設計的方向與品牌宗旨須有一定的連結,後面章節會更詳細界定商標的制定準則。

STANDARD GRID

– 標準網格製圖 –

藉由精密繪製與視覺修正,主要用於快速繪製出準確的標誌,從單位方格中將標誌的造型比例、空白距離等相互關係表達出來,製作時候依照此標準原樣放大、縮小與複製。
註:a 為一個基本計算單位。

Standardgrid01a
Standardgrid 1
Standardgrid 2
Standardgrid 3
Standardgrid 4
CLEAR SPACE

– 淨空區域 –

商標周邊需要保留一定的淨空區域,才能保證商標在每次出現時,都保有一定的辨識度,不至於被其他因素或元件干擾而影響品牌商標的獨特性。

  1. 使用時請確認商標的淨空範圍內,無嚴重干擾。
  2. 不同商標組合設定或有差異,使用時請確認淨空範圍量測基準點與設定範圍。
Clearspace 2
Clearspace 3
Clearspace 1
MINIMUM SIZE

– 最小使用尺寸 –

為因應商標在各種條件下都能維持一定的辨識度與一致性,因此制定了最小使用尺寸,讓使用者得以依照需求使用合適的呈現。

  1. 右圖為標誌的最小使用尺寸,在使用時不得小於此,以避免因標誌太小而不易辨識。
  2. 右圖標示以印刷使用 (最細線段不小於0.25pt) 為基準,不同製作加工方式有不同的限制,應依右圖設定為基礎調整。
  3. 先掌握各元素最小尺寸設定,再依據實際使用狀況調整使用。
Minimumsize 1
Minimumsize 2
BRAND COLOR

– 品牌色彩 –

品牌應遵照制定出的形象來經營,其中一個環節-標準色,即是在第一線與消費者接觸最廣泛快速的部分,也是幫助辨識品牌很重要的形象元素。品牌經營時請確保使用中的顏色都是正確的,除非遇到特殊狀況,或是在不同平台媒介所造成的設備誤差,否則皆以手冊提供具有固定數值的顏色為準。

PANTONE
Black 7C / Black U

RGB 61 57 53
HEX 3D3935
CMYK 63 60 64 65
K 91

PANTONE
White

RGB 255 255 255
HEX FFFFFF
CMYK 0 0 0 0
K 0

PANTONE
554C / 554U

RGB 32 92 64
HEX 205C40
CMYK 80 16 72 51

PANTONE
363C / 363U

RGB 76 141 43
HEX 4C8D2B
CMYK 64 0 100 24

PANTONE
2188C / 2188U

RGB 0 66 106
HEX 00426A
CMYK 100 43 0 55

PANTONE
2184C /2184U

RGB 0 132 212
HEX 0084D4
CMYK 87 32 0 0

PANTONE
525C / 525U

RGB 87 44 95
HEX 572C5F
CMYK 64 98 1 33

PANTONE
2039C / 2039U

RGB 230 56 136
HEX E63888
CMYK 0 87 3 0

PANTONE
2034C / 2034U

RGB 231 60 62
HEX E73C3E
CMYK 0 89 76 0

PANTONE
116C / 116U

RGB 255 205 0
HEX FFCD00
CMYK 0 10 98 0

PANTONE
171C / 171U

RGB 255 92 57
HEX FF5C39
CMYK 0 74 85 0

PANTONE
Cool Gray 9C

RGB 117 120 123
HEX 75787B
CMYK 50 40 34 17

PANTONE
Cool Gray6C

RGB 164 166 168
HEX A4A6A8
CMYK 32 24 20 8

PANTONE
Cool Gray 1C

RGB 217 217 214
HEX D9D9D6
CMYK 10 7 5 0

TYPEFACE & RULES

– 字體設定 –

網頁、商品、印刷品或是文件,都應考慮到字體表情的一致性,嚴禁任意使用不同的字型,尤其是字體樣式相差許多的字型。

標準用法:

此處所展示的,是本品牌文字在所有介面呈現上,所能使用的三種字體。字體的使用上,視情況而區分出不同的選擇和使用方式。

主標 Heading

思源黑體 Bold 字體 24pt / 行距30pt Montserrat SemiBold Font-Size 26px / Line-Height 30pt

標題 Title

思源黑體 Regular 字體 12pt / 行距 17pt Montserrat Regular Font-Size 13pt / Line-Height 17pt

內文 Contents

思源黑體 Light 字體 9pt / 行距 12pt Montserrat Light Font-Size 9pt / Line-Height 12pt

思源黑體 + Montserrat

思源黑體 Light + Montserrat Light

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz一二三四五六七八九十百千萬上中下左右大小春夏秋冬東南西北金木水火土天地日月星黑白紅橙黃綠藍靛紫食住衣行育樂忠孝仁愛信義和平子曰父母兄弟夫婦君臣馬牛羊雞犬豕喜怒哀懼惡目耳口手足見聞聲貝車雨赤青言語魚鳥羽電不乃之乎人以何俱倫儀先光入具初則匏協去友同名ĂÂĐÊÔƠƯăâđêôơư1234567890?“!”(%)[#]{@}/&<-+÷×=>®©$€£¥¢:;,.*

思源黑體 Regular + Montserrat Regular

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz一二三四五六七八九十百千萬上中下左右大小春夏秋冬東南西北金木水火土天地日月星黑白紅橙黃綠藍靛紫食住衣行育樂忠孝仁愛信義和平子曰父母兄弟夫婦君臣馬牛羊雞犬豕喜怒哀懼惡目耳口手足見聞聲貝車雨赤青言語魚鳥羽電不乃之乎人以何俱倫儀先光入具初則匏協去友同名ĂÂĐÊÔƠƯăâđêôơư1234567890?“!”(%)[#]{@}/&<-+÷×=>®©$€£¥¢:;,.*

思源黑體 Bold + Montserrat SemiBold

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz一二三四五六七八九十百千萬上中下左右大小春夏秋冬東南西北金木水火土天地日月星黑白紅橙黃綠藍靛紫食住衣行育樂忠孝仁愛信義和平子曰父母兄弟夫婦君臣馬牛羊雞犬豕喜怒哀懼惡目耳口手足見聞聲貝車雨赤青言語魚鳥羽電不乃之乎人以何俱倫儀先光入具初則匏協去友同名ĂÂĐÊÔƠƯăâđêôơư1234567890?“!”(%)[#]{@}/&<-+÷×=>®©$€£¥¢:;,.*

思源黑體 Bold 24級字 + Montserrat SemiBold 26pt

思源黑體 Regular 12級字 + Montserrat Regular 13pt

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz一二三四五六七八九十百千萬上中下左右大小春夏秋冬東南西北金木水火土天地日月星黑白紅橙黃綠藍靛紫食住衣行育樂忠孝仁愛信義和平子曰父母兄弟夫婦君臣馬牛羊雞犬豕喜怒哀懼惡目耳口手足見聞聲貝車雨赤青言語魚鳥羽電不乃之乎人以何俱倫儀先光入具初則匏協去友同名ĂÂĐÊÔƠƯăâđêôơư1234567890?“!”(%)[#]{@}/&<-+÷×=>®©$€£¥¢:;,.*

Typeface

請依排版情況,將上述標準用法直接縮放,就能得到正確內文、標題和主題顯示比例。但需要注意,在任何視覺顯示媒體上,內文的顯示不得縮至小於 5pt。

網頁字體:
H1

font-size: 42px;
line-height:50px;

H2

font-size: 32px;
line-height:40px;

H3

font-size: 24px;
line-height:32px;

H4

font-size: 20px;
line-height:28px;

H5

font-size: 18px;
line-height:26px;

H6

font-size: 14px;
line-height:22px;

p

font-size: 12px;
line-height:20px;

思源黑體 + Montserrat

STAND

<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,600|<br />
Noto+Sans+TC:300,400,700&display=swap" rel="stylesheet">

@IMPORT

@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600| Noto+Sans+TC:300,400,700&display=swap');

Specify in CSS

font-family: 'Montserrat', 'Noto Sans TC', sans-serif;

H1H2H3H4H5H6

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz一二三四五六七八九十百千萬上中下左右大小春夏秋冬東南西北金木水火土天地日月星黑白紅橙黃綠藍靛紫食住衣行育樂忠孝仁愛信義和平子曰父母兄弟夫婦君臣馬牛羊雞犬豕喜怒哀懼惡目耳口手足見聞聲貝車雨赤青言語魚鳥羽電不乃之乎人以何俱倫儀先光入具初則匏協去友同名ĂÂĐÊÔƠƯăâđêôơư1234567890?“!”(%)[#]{@}/&<-+÷×=>®©$€£¥¢:;,.*

例外字體:

為了增加設計者的自由度,在強調表現時,可以運用例外字體作為強調文字,但需要考量版面中,已做設定的主標文字大小。使用上不能和主標字體相同大小,至少要大兩級以上才能使用此例外級數的字體。

思源宋體 + Crimson Text

STAND

<link href="https://fonts.googleapis.com/css?family=Crimson+Text:600|<br />
Noto+Serif:700&display=swap" rel="stylesheet">

@IMPORT

@import url('https://fonts.googleapis.com/css?family=Crimson+Text:600|<br />
Noto+Serif:700&display=swap');

Specify in CSS

font-family: 'Noto Serif TC', serif;<br />
font-family: 'Crimson Text', serif;

思源宋體 Bold + Crimson Text SemiBold

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz一二三四五六七八九十百千萬上中下左右大小春夏秋冬東南西北金木水火土天地日月星黑白紅橙黃綠藍靛紫食住衣行育樂忠孝仁愛信義和平子曰父母兄弟夫婦君臣馬牛羊雞犬豕喜怒哀懼惡目耳口手足見聞聲貝車雨赤青言語魚鳥羽電不乃之乎人以何俱倫儀先光入具初則匏協去友同名ĂÂĐÊÔƠƯăâđêôơư1234567890?“!”(%)[#]{@}/&<-+÷×=>®©$€£¥¢:;,.*

SUPPORTING GRAPHICS

– 輔助圖形 –

輔助圖形以企業標誌造型延伸,搭配整個品牌識別充實和豐富企業的視覺形象,於中心理念的基礎上發展出來的延伸設計,它使標誌在實際運用中達到更豐富的視覺效果,也有統一視覺形象的雙重作用,使最具代表性的企業形象得以正確的被塑造,進而建立社會公眾的一致認知。

Supportinggraphics05a
Supportinggraphics06 3
Supportinggraphics 1
Supportinggraphics05b
Supportinggraphics06 2
Supportinggraphics 1
Supportinggraphics05c
Supportinggraphics06 1
Supportinggraphics 1
Supportgraphic01
Supportgraphic02

Ocean

Bicycle

Bowls