# 相信旅遊 BE.LIVE TRAVEL｜Corporate Identity v1.0

更新日期：2026-07-14

適用範圍：網站、社群、簡報、行程文件、廣告、影片、印刷與所有 Agent 產出

品牌持有人：相信日本株式会社

> 這份文件與 `brand-tokens.json` 是相信旅遊品牌的單一事實來源。任何 Agent 開始視覺、文案或前端工作前都必須先讀取；若與既有頁面或臨時指令衝突，先停止並請品牌負責人確認。

## 0. 品牌核心

### 品牌主張

**相信，是把麻煩先處理好。**

### 對旅客的承諾

讓素食旅伴安心吃、自由玩。相信旅遊把查餐廳、確認飲食、安排路線與合法交通等繁瑣細節先整理好，旅客只需要享受旅程。

### 品牌性格

- 溫暖：理解吃素旅行真正的焦慮，但不販賣焦慮。
- 清楚：價格、流程、包含與不包含都說明白。
- 可靠：用真實資料、專業經驗與人工確認建立信任。
- 克制：資訊有層級，不堆滿裝飾與話術。
- 有品味：像一本成熟的旅行編輯誌，不像促銷型旅行社。

### 核心受眾

以台灣素食旅客為主，包含孝親旅行、小家庭、伴侶與 2–6 人小團；他們重視安心、飲食品質、移動舒適與透明溝通。

## 1. Logo 系統

### 核心意義

標誌以雙環流線形成一個向前的路徑與定位意象；金橘代表出發時的陽光與期待，青綠代表安心、自然與抵達。留白中心代表旅伴與每一趟被好好照顧的旅程。

### 使用層級

1. 優先：彩色標誌＋「相信旅遊 BE.LIVE TRAVEL」標準組合。
2. 小尺寸：只用彩色標誌，適用 favicon、頭像與 24–48px 圖標。
3. 深色底：使用白色反白版本。
4. 單色製程：使用 Deep Teal `#357970`；不可自行描邊或轉灰階。

### 安全距離與最小尺寸

- 安全距離：四周至少保留標誌高度 `H` 的 25%，即 `0.25H`。
- 數位標誌最小高度：24px。
- 印刷標誌最小高度：8mm。
- 數位標準組合最小寬度：120px。
- Logo 附近不可放按鈕、邊線、照片主體或其他品牌標誌。

### 禁止事項

- 不可壓縮、拉長、旋轉或改變比例。
- 不可更換漸層、套濾鏡、加外框、陰影或發光。
- 不可將 Logo 放在低對比、複雜或干擾辨識的照片上。
- 不可重新打字模仿標準字。
- 不可把標誌拆解成裝飾圖形或另做新版本。

## 2. 色彩系統

### 品牌主色

| 名稱 | HEX | RGB | 建議 CMYK 起點 | 用途 |
|---|---|---|---|---|
| BE.LIVE Teal | `#499F94` | 73 159 148 | C54 M0 Y7 K38 | Logo、圖標、焦點、大型裝飾 |
| Deep Teal | `#357970` | 53 121 112 | C56 M0 Y7 K53 | 標題、按鈕、深色底、可讀文字 |
| Sunrise Gold | `#F6AD3C` | 246 173 60 | C0 M30 Y76 K4 | Logo 漸層起點、深色底 CTA |
| Warm Brass | `#A97F2C` | 169 127 44 | C0 M25 Y74 K34 | 眉題、編號、細線、資訊層級 |

### 中性色

| 名稱 | HEX | 用途 |
|---|---|---|
| Travel Cream | `#FAF8F3` | 主背景 |
| Section Cream | `#F3EFE6` | 區塊分層 |
| Ink | `#1C1C1A` | 正文與高對比資訊 |
| White | `#FFFFFF` | 深色底文字、乾淨表面 |

### 無障礙功能色

| 名稱 | HEX | 用途 |
|---|---|---|
| Accessible Brass | `#8D6924` | 淺色背景的小型金色文字；Warm Brass 保留給細線、大型文字與圖形 |
| Gold Tint | `#FFF0C5` | Deep Teal 背景的小型金色文字；Sunrise Gold 保留給 CTA 與大型高光 |

印刷 CMYK 僅為起始值，實際輸出必須依紙材、印刷機與打樣結果調整。

### 建議比例

- 60% 暖米白與留白。
- 20% Ink 文字與資訊。
- 10% Deep Teal 結構與主操作。
- 10% Logo Teal／Gold／Brass 焦點。

### 對比規則

- 正文：Ink on Travel Cream。
- 品牌文字：Deep Teal on Travel Cream。
- 反白：White on Deep Teal。
- `#499F94` 不作淺底小字；`#F6AD3C` 不作正文。
- 淺底小型金色文字使用 Accessible Brass；深底小型金色文字使用 Gold Tint。

## 3. 字體與排版

### 字體家族

- Display／標題：`Noto Serif TC`, `Source Han Serif TC`, `Songti TC`, `Shippori Mincho`, serif。
- Body／介面：`Geist`, `Noto Sans TC`, `PingFang TC`, system-ui, sans-serif。
- 數字價格：沿用 Body，開啟 tabular numerals。

### 字重

- Display：500 或 600。
- Body：400。
- 導覽、按鈕、重要資訊：500 或 600。
- 不使用 700 以上的中文粗黑做大面積標題。

### 排版原則

- 大標題維持 1–3 行，行寬約 8–14 個中文字。
- Display XL 上限 96px，字距不得小於 `-0.04em`。
- 正文每行 28–38 個中文字，行高 1.75–1.9。
- 英文眉題使用大寫、字距 0.08–0.16em，不以英文代替中文資訊。
- 重要頁面採大標題＋安靜留白；不靠大量卡片製造層級。
- 內容以左對齊為主，只有短標語、數據或儀式性畫面可置中。

## 4. 版面與空間

- 基礎單位：4px。
- 間距序列：4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96 / 128。
- 最大頁寬：1440px。
- 主內容寬：1152px。
- 長文閱讀寬：720px。
- 欄位：手機 4 欄、平板 8 欄、桌面 12 欄。
- 頁面 gutter：手機 20px、平板 32px、桌面 48px。
- 區塊垂直間距：手機至少 72px、桌面 112–160px。

### 圓角

- 小型控制：12px。
- 卡片與表單：20px。
- 圖片與大型面板：32px。
- 膠囊按鈕只在簡短單一操作使用。

### 陰影

陰影必須暖、薄、低對比；不可使用黑色厚重陰影或霓虹光暈。優先用留白、底色與細線建立層次。

## 5. 攝影方向

### 優先內容

1. 真實旅程與目的地。
2. 真實餐食、食材與餐廳空間。
3. 真實車款與移動情境。
4. 自然互動的旅伴；避免刻意看鏡頭的商業姿勢。

### 視覺比例

- 60% 環境與目的地。
- 30% 餐食、細節、材質。
- 10% 人物互動。

### 處理方式

- 自然光、暖色高光、保留陰影與材質。
- 飽和度克制；綠色與金色可呼應品牌，但不可強制套色。
- 圖片裁切保留主體呼吸空間，人物視線方向應朝向內容。
- 路線與車款資訊只能使用可追溯的真實照片。

### 禁止事項

- 不可用生成圖冒充真實景點、餐廳、車款或旅客回饋。
- 不使用廉價庫存商務照、過度 HDR、塑膠感食物或假笑團體照。
- 不在照片上燒入長文；資訊回到版面層處理。

## 6. 圖標與圖形語言

- 24px 基準網格、1.5px 線寬、圓頭端點。
- 單色線性、幾何簡潔；同一畫面只使用一套圖標。
- 圖標用於辨識，不作無意義裝飾。
- 可使用路徑、定位點、圓環與細金線呼應旅行與 Logo 流線。
- 除 Logo 外不使用任意漸層。

禁止用 Emoji 當功能圖標、混用填色與線性圖標、加入 3D 黏土圖標或藍紫 AI 光效。

## 7. UI 元件

### 主要按鈕

- Deep Teal 底、白字、最小高度 44px。
- 行動文字直接，例如「填寫需求」「查看精選行程」。
- Hover 改為 Logo Teal；Active 縮放不超過 3%。

### 次要按鈕

- 透明底＋Deep Teal 細框或文字連結。
- 同一畫面只允許一個主要行動。

### 卡片

- 優先使用底線、分欄、留白與編號；只有真正需要群組時才使用卡片。
- 圖片、標題、摘要、操作的閱讀順序固定。
- 不使用「每個東西都裝進圓角白卡」的泛用 SaaS 版型。

### 表單

- 標籤永遠顯示，不只靠 placeholder。
- 必填、錯誤與協助文字必須清楚。
- 點擊／觸控目標至少 44×44px。
- 焦點狀態在淺底使用 2px Deep Teal、深底使用 2px Travel Cream，並保留 3px 間距。

## 8. 動態

- 微互動：180ms。
- 元件轉場：250ms。
- 區塊出場：600ms 以內。
- 標準曲線：`cubic-bezier(.22,1,.36,1)`。
- 一次只做一個明確動作；不使用循環漂浮、無目的視差或彈跳。
- `prefers-reduced-motion` 下取消位移、視差與自動播放。

## 9. 品牌語氣

### 原則

- 先說結論，再補必要細節。
- 像一位懂旅行的朋友，不像傳統旅行社話術。
- 價格、流程、包含與不包含具體說明。
- 尊重每一種飲食習慣，不把人分類成標籤。
- 不製造焦慮、不誇大、不保證無法控制的結果。

### 建議用詞

飲食習慣、旅伴、精選行程、人工確認、合法綠牌車、專業司機、參考費用、正式報價。

### 避免用詞

素別、日本團隊確認中、地接、純包車、保證零風險、全網最低價、只要車就好。

### 文案示例

- 建議：「吃素去日本玩很麻煩，我們都懂。」
- 避免：「日本素食沒你想的少，難的是這兩件。」
- 建議：「告訴我們你的飲食習慣與想去的地方。」
- 避免：「選擇你的素別，系統將自動配對。」

## 10. 無障礙與包容

- 所有正常文字至少符合 WCAG AA；小字對比至少 4.5:1。
- 圖片必須有描述內容與目的的 alt；純裝飾圖片使用空 alt。
- 不可只以顏色傳達狀態。
- 鍵盤焦點必須可見，DOM 順序符合閱讀順序。
- 觸控目標至少 44px，正文手機最小 16px。
- 中文使用繁體台灣用語；日期、金額、幣別與單位不可模糊。

## 11. Agent 執行規範

### 每次工作前

1. 讀取本文件與 `brand-tokens.json`。
2. 確認是內容更新、元件擴充或品牌系統變更。
3. 優先沿用現有元件、Logo 與已核准照片。
4. 不臆造價格、餐廳、行程、車款、評論或合作關係。

### 產出時

1. 只使用核准色票與字體。
2. 先建立清楚層級，再加裝飾。
3. 桌面與手機都要檢查；不能只對單一 viewport 修補。
4. 圖片必須可追溯，生成圖不能作為真實服務證據。
5. 文案遵循品牌語氣與台灣繁體用語。

### 完成前

1. 檢查 Logo、安全距離、顏色、字體、留白與圖像來源。
2. 檢查對比、鍵盤焦點、觸控尺寸、alt 與 reduced motion。
3. 若變更任何全站品牌 token，必須同步更新本文件、JSON、CI 頁與變更紀錄。

### Hard No

- 不重畫、變形或自行延伸 Logo。
- 不另創主色，不把品牌綠換回深墨綠。
- 不使用藍紫 AI 漸層、廉價霓虹、玻璃擬態或泛用 SaaS 風格。
- 不新增與品牌衝突的字體、圖標或攝影濾鏡。
- 不用生成圖冒充真實旅程。
- 不在沒有同步 CI 的情況下改全站品牌 token。

## 12. 治理與版本

- 本版：v1.0，2026-07-14。
- CI 頁、Markdown 與 JSON 必須保持同版號。
- Logo、品牌主張、主色與標準字屬核心資產，調整前需品牌負責人核准。
- 一般元件可在不改變核心識別的前提下擴充；新增模式後應回寫規範。
- 變更紀錄需包含日期、負責人、原因、影響範圍與回復方式。

## 官方資產

- 彩色標誌：`/brand/blive-mark-color.svg`
- 橫式標準組合：`/brand/blive-logo-horizontal.jpg`
- 白色反白：`/brand/blive-logo-white.svg`
- 方形頭像：`/brand/blive-logo-square.jpg`
- 機讀 tokens：`/brand/brand-tokens.json`
