精選 · 開放 · 免費
Descript
為頂尖 AI 影片編輯平台設計的簡潔、溫暖且高度實用的介面。
aivideo
01
設計氣質 DNA
AI 影片編輯器協作直覺專業
一個既強大又易於使用的現代工作室。
02
色彩
#1A1A1AInk
#F1EAEDBG
#D1C7CBMuted
rgba(229,231,235,1.0)Line
溫暖的米白色基調，搭配高對比的深色墨水以利閱讀，並在首頁橫幅區域使用深勃艮第紅作為強調色。
03
字型
transitional-serif · humanist-sans · monospace
- display
56px · 400 - body
18px · 400
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
以 4px 為基準的標準間距，並清晰採用 8px/16px/24px 的遞增層級用於 padding 與間隔。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
1px solid #E5E7EB
rgba(0,0,0,0.16) 0px 2px 4px 0px
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
全幅的首頁橫幅區域，採用置中版面呈現關鍵訊息，後接多欄網格展示功能卡片。
07
動效與互動
100msmicro
200mssmall
300msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
hover 與 focus 時的淡入過渡 · 流暢的背景顏色變化
互動元素上的細微背景顏色變化或透明度轉變。 · 即時視覺回饋，無延遲動畫。
08
組件
- button 簡潔的矩形按鈕，具 4px 圓角與 16px 垂直 padding。
- card 具 12px 圓角的卡片，搭配大型背景圖與疊加文字。
- chip 簡潔的文字標籤，用於分類。
- input 標準的表單輸入框，帶有細微邊框。
- hero 大型置中的首頁橫幅區塊，採用深勃艮第紅背景與粗體襯線字型。
09
文案語氣與禁用清單
- 語氣 專業、清晰、賦能。
- 標題風格 粗體、大型襯線字型，傳達權威感與清晰度。
- 按鈕文案 直接且行動導向（例如：「免費開始使用」）。
- 勿使用深色模式介面 — 畫面截圖顯示以明亮、溫暖的米白色作為主要基調。
- 勿使用高度幾何感的無襯線字型作為標題 — 當前截圖顯示使用經典的過渡襯線字型。
- 勿使用霓虹或電光藍作為主要強調色 — 截圖使用深勃艮第紅與柔和的珊瑚紅作為強調。
- 勿使用過度圓潤或「膠囊狀」形狀作為主要按鈕 — 截圖顯示按鈕圓角為 4px。
- 勿使用過重的陰影或 3D 效果 — 截圖顯示平面、乾淨的表面，僅使用細微的單層 box-shadow 來營造層次。
- 勿使用擁擠的多側邊欄導覽 — 截圖顯示乾淨的水平頂部導覽列，留有充足空白。
- 避免: 過度技術性的術語
- 避免: 雜亂的版面配置
- 避免: 刺眼的霓虹色彩
- 避免: 圓潤、膨脹的 UI 元素
- 避免: 過多裝飾性動畫
- 避免: 深色模式作為主要主題
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
Descript 的設計呈現出簡潔、專業的 SaaS 美學，平衡了溫暖感與權威性。採用明亮的米白色背景 (#F1EAED)，搭配高對比的深色墨水 (#1A1A1A) 以確保可讀性。排版上，使用經典的過渡襯線字型作為粗體標題，並以人文主義無襯線字型作為內文，營造出既精緻又親切的感受。關鍵設計元素包含：基於 4px 的間距層級、細微的 1px 邊框 (#E5E7EB)，以及在首頁橫幅區域克制地使用深勃艮第紅。重要設計規則包括：1) 避免預設使用深色模式；2) 不使用過度圓潤或膨脹的 UI 元件；3) 切勿使用霓虹或高飽和度的強調色；4) 保持寬裕的空白與結構化的 12 欄網格版面。
en · zh-CN · zh-TW · ja · ko