TVBS AI · Corporate Identity v0.1 Concept · 2026-06-10

TVBS AI
Brand Identity

TVBS AI 子品牌的兩個正式標誌。 方形版參考 TVBS 新聞 同系統「大 T 包小字」,把 VBS + 新聞 換成 AI。 橫式版用官方 TVBS wordmark + AI,給文字流場景。

方形主標誌 · Square Emblem
出品標、認證徽章、節目片頭、文件封面、App icon
AI
橫式 lockup · Horizontal Lockup
頁首、文字流、簡報、email 簽名、名片
TVBS AI · T·AI icon
迷你 lockup · T·AI
電視角落 badge、icon strip、chip、小尺寸標記
出品TVBS AI 科技部
階段v0.1 修正後
設計來源TVBS 新聞 同系統
首發應用即時翻譯字幕
索引 策略 · 主標誌 · 色彩 · 字體 · 電視規範 · 應用
01 · Brand Strategy

從「功能」
升格成「品牌」

TVBS AI 科技部已經做出好幾個強大的 AI 應用,問題不在能力, 在於觀眾記得「翻譯很準」卻記不得是「TVBS AI 做的」。 這次 CI 的目標:建立一個能跨所有 AI 產品的識別系統, 讓「TVBS AI 出品」這四個字本身變成品質保證。

Brand Promise

新聞級信任
× AI 級智慧

TVBS 30 年新聞媒體的信譽,加上一線科技團隊的 AI 能力。我們做的 AI,不是炫技玩具,是專業內容生產的工具。

Positioning

TVBS 旗下
AI 子品牌

「TVBS AI」跟「TVBS 新聞」是同層級的 TVBS 子品牌。所有由 AI 科技部開發的產品,都掛上這個標誌。

Audience

觀眾 · 業界 · 內部

觀眾看到代表「正在使用 AI 服務」;業界看到代表「TVBS 的技術實力」;內部看到代表「跨產品共用的品牌資產」。

Voice & Tone

沉穩 · 精準
不喧賓奪主

內容才是主角,AI 是讓內容變好的工具。標誌存在感要剛好被看見,但不搶走內容焦點。

02 · Master Mark

TVBS AI
方形主標誌

跟 TVBS 新聞 用同一套設計系統 —— 大 T 從官方 SVG 拿來,不修改, 原本 VBS + 新聞 的位置改放 italic 粗體「AI」。 這樣每個 TVBS 子品牌(新聞、AI、未來其他)都共用一個視覺骨架, 使用者一眼就讀出「這是 TVBS 家族的 X」。

T 來源
官方 SVG TVBS_id50FqcltZ_1.svg 第二個 path,原樣使用、不縮放比例
AI 字形(v0.1 暫用)
Inter Black Italic(900),font-size 68、letter-spacing −3、貼合 T 的右側 cradle。Inter Black 字寬厚重、有魄力,跟 TVBS T 的視覺重量匹配。
⚠️ 字型限制
根據 Logopedia,TVBS 的「TVBS」標準字 typography 註明為 「Custom」客製設計,不是任何商業字型。要做到 100% 跟 VBS 同字感,AI 也應該手繪 SVG path 跟 T 同 DNA — 這條移到 v1。曾試 Barlow Condensed 但太細、沒魄力。
主色
TVBS Blue #003894
對應 TVBS 新聞
原版的「VBS(藍)+ 新聞(橘)」整組 → TVBS AI 用單一「AI(藍)」取代
畫布
200 × 200,T 佔約 95% 寬度、70% 高度,AI 字佔右下 cradle
構造 · A

大 T 是聖物

T 的 path 直接取自官方 SVG,無任何修改 — 縮放、平移可以,輪廓不能動。所有 TVBS 子品牌共用同一個 T,這是家族認同的關鍵。

構造 · B

AI 字位置

跟 TVBS 新聞 的 VBS 文字同位置 —— 嵌在 T 的右側 cradle(右下方那塊由橫桿和直幹圍出的空間)。italic、粗體、貼齊 T 的視覺重心。

構造 · C

未來延伸

同一個 T 可以包不同 sub-brand 名稱 — 例如 TVBS 戲劇可以是「劇」、TVBS 體育可以是「Sports」。整個 TVBS 集團共用一套視覺架構。

三種主要色彩處理

字形 / 構造 不變,只變色彩處理。看哪個跟你想要的 TVBS AI 氣質最對。

處理 · 01

純藍 · 標準版

T 跟 AI 都是 TVBS 藍,最沉穩官方。所有正式場合預設用這版。

處理 · 02

藍 T + 橘 AI

呼應 TVBS 新聞 的「藍 VBS + 橘 新聞」配色 — 跟新聞 logo 並排時最有家族感。

處理 · 03

藍 T + 漸層 AI

AI 用 TVBS 藍 → 青 → 紫漸層,最有科技感,適合產品介紹、開場動畫、社群分享圖。

處理 · 04

反白版

深色 / TVBS 藍底用反白,TVBS 集團官方廣告 / 海報 / 名片底色經常用,必備版本。

橫式 lockup(用於 inline 場景)

文字流裡(簡報、頁首、email 簽名)用方形 emblem 會卡,這時改用「官方 TVBS wordmark + AI」橫式 lockup。 TVBS 字標也是直接從官方 SVG 取,不修改。

AI
AI
03 · Color System

色彩系統

TVBS 藍是不可動搖的主幹,AI 子品牌補上一條「TVBS 藍 → 青 → 紫」漸層當 signature gradient, 讓 AI 元素既有 TVBS 血統、又有獨立科技感。橘色保留呼應 TVBS 新聞 的家族色,可選用。

主幹 · TVBS Core(跟 TVBS 新聞 共用)

#003894
TVBS Blue RGB 0 / 56 / 148 主色,T 跟 AI 預設色。
#00226B
TVBS Blue Deep RGB 0 / 34 / 107 深底用、Hover 狀態、漸層尾段。
#0061D8
TVBS Blue Bright RGB 0 / 97 / 216 漸層中段、互動狀態。
#FF6F2C
TVBS Orange RGB 255 / 111 / 44 家族色,呼應 TVBS 新聞 的「新聞」橘。AI 處理 02 用此色。

AI 副幹 · Tech Accents

#00C8FF
AI Cyan RGB 0 / 200 / 255 漸層中段,象徵「智慧」「光速」。
#7C3AED
AI Violet RGB 124 / 58 / 237 漸層尾端,象徵「未來」「智能」。
#00E5A1
AI Mint RGB 0 / 229 / 161 輔助點綴,象徵「即時」「處理中」。
#0A0A12
Editorial Ink RGB 10 / 10 / 18 深色背景,做 AI 漸層光暈最強對比。

Signature Gradient · TVBS AI 漸層

唯一官方漸層,順序固定 TVBS Blue → Blue Bright → Cyan → Violet, 角度 115°小尺寸(< 24px)必須退回單色 TVBS Blue。

04 · Typography System

字體系統

CI 用三套字體:Inter(內文 UI 英文)+ Noto Sans TC(繁體中文)+ Barlow Condensed(AI logo 專用)。 全部都是免費商用、Google Fonts 可載。 關於 AI logo 字:原版「TVBS」標準字根據 LogopediaCustom 客製設計、不是現成商業字型,所以 100% 同字感不可能用任何字型達成。Barlow Condensed Black Italic 是 humanist condensed sans,跟 VBS 那種圓潤帶 italic 的字感最接近的 free 選項,當 v0.1 placeholder 用,v1 建議手繪 SVG path。

AI Logo 專用
Inter Black Italic (900),font-size 68pt
Google Fonts · 免費商用
⚠️ Placeholder。v1 應換成 custom 手繪 path 跟 TVBS T 同 DNA
Display · 大字 (非 AI)
Inter Black Italic (900)
Noto Sans TC Black (900)
Heading · 標題
Inter ExtraBold (800)
Noto Sans TC Bold (700)
Body · 內文
Inter Regular (400)
Noto Sans TC Regular (400)
Caption / Meta
Inter SemiBold (600),全大寫,letter-spacing 0.18em
Mono · 技術註記
JetBrains Mono Regular,限用於 HEX / RGB / 程式碼
AI Logo Style · Inter Black Italic 96px
AI
Heading · Noto Sans TC Bold 36px
把功能變成品牌
Body · Noto Sans TC Regular 16px
TVBS AI 是 TVBS 集團專屬的 AI 應用品牌,跟 TVBS 新聞 同層級。
Caption · Inter SemiBold 11px
TVBS AI · CORPORATE IDENTITY · 2026
Mono · JetBrains Mono 13px
background: linear-gradient(115deg, #003894, #00C8FF, #7C3AED);
05 · On-Screen Rules

電視畫面
使用規範

Badge 有兩種格式: Format 01 白底藍字(100% 不透明)Format 02 黑底白字(60% Alpha 半透明)。 畫面用 1080p Full HD(1920×1080)為標準對標,所有像素值都按這個尺寸定義, Safe-area 對到 SMPTE RP 218 title-safe(HD 5% inset 標準)。

1920×1080
Broadcast 對標尺寸
1080p Full HD frame
249×63 px
Badge 尺寸
所有變體共用同一框
210, 120
Badge 定位(px)
x 從左、y 從下
SMPTE RP 218
Safe-area 標準
5% title-safe inset

Broadcast Spec Sheet · 給直播部用的精確規範

FRAME

解析度:1920 × 1080 px(1080p / Full HD / 16:9)
Action-safe(SMPTE RP 218):3.5% inset = (67, 38, 1853, 1042)
Title-safe(SMPTE RP 218):5% inset = (96, 54, 1824, 1026)

BADGE

尺寸:249 × 63 px(白底、黑底版同框)
定位(左下角):x = 210 px, y = 897 px(top-left 原點)
到 frame 邊距:left 210 px、bottom 120 px

SAFE-AREA Δ

距 title-safe-left:+114 px(額外向內收)
距 title-safe-bottom:+66 px
→ Badge 在 SMPTE title-safe 內側、再向內預留充裕氣口,跨機構播出都安全。

出現規則

出現時長:10 秒(跟字幕同步上下,字幕消失後同時淡出)
位置:固定,不漂浮、不變大、不蓋字幕
動態:淡入 0.3s / 淡出 0.5s

交給直播部的檔案(位於 翻譯Badge輸出/): 單獨Badge.png(249×63 白底)、 單獨badge半透明alpha遮罩.png(249×63 黑底 60% Alpha)、 滿版去背.png(1920×1080 透明底、badge 已 keyed 在 (210, 897) 等播出端直接 overlay)、 滿版badge半透明alpha遮罩.png(同上,黑底 alpha 版)。
NEWS
TVBS AI · 即時翻譯(白底藍字)

Format 01 · 白底藍字

249×63 px、left 210 / bottom 120(1920×1080 對標)。白底 100% 不透明、SMPTE title-safe 內側充裕氣口。

廣告
TVBS AI · 即時翻譯(黑底白字 60% Alpha)

Format 02 · 黑底白字

同樣 249×63 px、同樣定位(210, 120)。黑底 60% Alpha 半透明 + 白 emblem,高彩度背景上不被吃掉。

NEWS
TVBS AI · 即時翻譯(過小,反例)

尺寸縮小 / 違反 249×63 規格

不要任意改 badge 寬高比或縮小。直播部唯一接受的尺寸是 249×63 px,縮太小會掉到 sub-pixel、字會糊掉。

NEWS

裸 emblem · 不套膠囊

不要把 emblem 直接放在畫面上、沒套膠囊。一定要走 Format 01 或 02 兩種膠囊之一,膠囊是 badge 的構成元素。

06 · Real TV

真實畫面 · 直接 Key 上去

電視角落的 badge 尺寸跟位置是被綁死的,只能在那個方格內動。 Badge 本身有兩種格式:白底藍字(白底 100% 不透明)、黑底白字(黑底 60% Alpha 半透明)。 左邊先給一張現在電視上長相的對照,右邊兩張是兩種格式。

Before · 現在

「AI即時語音辨識」純文字小膠囊

沒有任何 TVBS AI 品牌識別,只是一個白底藍字的功能性 label。

TVBS AI · 即時翻譯(白底藍字)
Format 01 · 白底藍字

白底 100% · TVBS 藍 emblem

實心白底膠囊,emblem 用 TVBS 藍。對比最強、品牌色直出,正式 / 新聞 / 標準場景首選。

Format 02 · 黑底白字

黑底 60% Alpha · 白色 emblem

半透明黑底膠囊,emblem 用白色。半透明讓背景透出來、視覺輕一點,多元 / 戶外 / 高彩度背景上耐看。

檔案: Badge SVG(字已轉外框、235×59、4:1):TAI即時翻譯Badge.svg · Clean base:電視畫面_沒有badge.png
06 · Applications

應用場景

TVBS AI 主標誌不只在電視角落出現。未來所有 AI 科技部產品都會掛這個 emblem。 下面是幾個常見場景示範。

NEWS
Welcome to TVBS · 即時 AI 翻譯字幕
TVBS AI · 即時翻譯
應用 · 01

電視角落 · 即時翻譯指示器

首發場景。膠囊隨字幕同步上下,10 秒後淡出。

TVBS AI 出品
應用 · 02

節目開場 · 出品標

節目片頭 2 秒淡入淡出的 emblem + 「TVBS AI 出品」浮水印。

TVBS AI 出品

即時翻譯

支援多語言即時雙向翻譯,新聞節目原音同步上字幕。

應用 · 03

官網 / App · 產品卡

每個 TVBS AI 產品卡都帶 emblem,當品質印章。

TVBS AI · 即時翻譯

每一個畫面,
都用 AI 同步翻譯。

TVBS AI 出品 · POWERED BY TVBS AI
應用 · 04

社群 · OG / 分享圖

Signature gradient 全面展開,搭配標語。1200×630。

2026 / Q2 報告

TVBS AI
季度技術白皮書

TVBS AI 科技部
應用 · 05

對外文件 · 出品蓋章

白皮書 / 提案 / 報告封面右上角的 emblem。

Live · Processing
應用 · 06

App · 處理中狀態

App / 後台運行時的活動指示器:emblem + 跳動點。

Appendix · AI Typeface Lineup

AI 字型候選
並排看一眼

原版「VBS」是 Custom 客製字型(per Logopedia),沒有完美對應的 free font。 我從幾個方向幫你篩出 5 個 powerful + italic + bold 的候選, 用一樣的 T、一樣的位置、一樣的尺寸,只換 AI 字型。 看完直接告訴我哪個對。

AI
v0.1 現用

Inter Black Italic

Geometric grotesque。Power 強、字母寬厚、有壓場感。缺點:偏 mechanical、跟 TVBS T 的有機弧線對比明顯。

AI
Broadcast 經典

Helvetica/Arial Black Italic

電視台 90% 都用 Helvetica。最 broadcast feel、跟 TVBS 30 年新聞 DNA 同源。系統字、無需 web font。

AI
幾何溫潤

Saira Black Italic

介於 Inter 機械跟 Barlow 柔軟之間。略偏 condensed、現代、有 power 也有溫度。

AI
戲劇張力

Anton(強制斜體)

極壓縮 display sans,原沒 italic,CSS skew -10° 模擬。最戲劇、最有 newsroom title card 的氣勢。風險:太 display、可能搶 T 的光。

AI
現代人本

Plus Jakarta Sans 800 Italic

現代 humanist sans,比 Inter 圓潤、比 Helvetica 現代。字距較鬆、感覺友善。適合「AI 是工具不嚇人」的 voice。

AI
現代 grotesque

Albert Sans Black Italic

2022 推出的現代 grotesque,比 Inter 多一點個性、比 Helvetica 新。跟 TVBS T 的有機感較合得來。

選完後我會:把選定的字型統一套到所有 emblem variant + horizontal lockup + 電視 badge + Application showcase。
v1 終極建議:客製手繪 AI path 跟 TVBS T 同 DNA(曲線、筆畫粗細、italic 角度都對齊),完全擺脫字型限制。