精選 · 開放 · 免費
IDEO
高端設計顧問，以大膽、克制的自信展示以人為本的未來願景。
studioproduct
01
設計氣質 DNA
設計創新以人為本創意工作室策略性
一個高端創意機構的作品集，既感覺實驗性又結構嚴謹。
02
色彩
#D9FF00Accent
#333333Ink
#FFFFFFInk soft
#151F27BG
#F7FAFCBG soft
#2B2E35BG quiet
#7B92A5Muted
rgba(123,146,165,0.2)Line
高對比度深色模式，搭配單一、鮮明的黃綠色強調色，以達到最大衝擊力。
03
字型
didone-serif · humanist-sans
- display
56px · 400 - heading
40px · 400 - body
18px · 400
使用銳利、優雅的 Didone 衬線字體作為主要展示文字，以建立高端感受。 · 搭配乾淨的人文主義無襯線字體，用於所有支援性 UI 文字和正文。 · 在大型展示文字上保持緊湊的負字距追蹤，以呈現密集、具意圖的外觀。
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
以 8px 為基礎網格，搭配寬裕的 24px 和 32px 內距以創造呼吸空間。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 12px
pill · 999px
極少使用 1px 實線邊框，主要用於結構性分隔。
0px 1px 0px 0px rgb(21, 31, 39)，用於細微的邊框效果
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
寬幅、全出血的攝影主視覺，後接限制在 128px 居中容器的內容。
07
動效與互動
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
互動元素（如按鈕和懸停狀態）使用平滑的 0.3s 過渡效果。 · 基於變換的動畫，用於滾動或互動時細微的位置移動。
互動元素上的細微背景色或文字顏色變化。 · 即時的視覺反饋，使用 0.1s 的背景顏色過渡。
08
組件
- button 高對比度黃綠色 CTA，搭配黑色文字；次要按鈕為深色並帶有細微邊框。
- card 乾淨、無邊框的卡片，配有大型攝影和疊加的排版文字。
- chip 極簡、基於文字的導航標籤，無厚重容器。
- input 標準表單輸入，帶有細微邊框和符合主題的深色背景。
- hero 全出血攝影主視覺，搭配大膽的排版文字疊加和幾何線框圖形。
09
文案語氣與禁用清單
- 語氣 權威、具遠見且深度以人為本。
- 標題風格 大膽、發人深省且簡潔的陳述，挑戰傳統思維。
- 按鈕文案 直接且具邀請性（例如：「打個招呼」），強調連結。
- 不要使用多個相互競爭的強調色——截圖顯示單一、主導的黃綠色強調色與深色背景對比。
- 不要使用過度圓潤或氣泡狀的形狀——截圖顯示銳利的幾何線條和精確的線框疊加。
- 不要用密集的文字區塊 clutter 佈局——截圖顯示寬裕的留白和大型攝影間隔。
- 不要使用俏皮或漫畫風格的字體——截圖顯示精緻的 Didone 衬線字體和乾淨的無襯線字體配對。
- 不要使用明亮、多彩的漸層——截圖顯示實色深色背景搭配平面、高對比度的強調色。
- 不要用厚重的 UI 疊加層遮蓋主要內容——截圖顯示清晰、專注的關鍵資訊呈現。
- 避免: 充斥術語的企業用語
- 避免: 侵略性的銷售語言
- 避免: 過於隨意或俏皮的俚語
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（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
這是一個高端設計工作室網站，其特點是精緻的深色模式美學，搭配單一、鮮明的黃綠色強調色 (#D9FF00)。佈局使用銳利的 Didone 衬線字體作為標題，乾淨的人文主義無襯線字體作為正文，背景為深海軍藍 (#151F27)。關鍵元素包括全出血攝影、幾何線框疊加和寬裕的留白，強調具遠見、以人為本的方法。關鍵設計限制：不要引入多個強調色；保持嚴格的雙字體層級；並保留大尺度、寬敞的佈局，避免 clutter 以不必要的 UI 元素或厚重邊框。整體感受是高端、結構化且具意圖的實驗性。
en · zh-CN · zh-TW · ja · ko