精選 · 開放 · 免費
Taiki Murayama
一個大膽、編輯式的設計作品集，強調大型字體、高對比影像，以及極簡的介面裝飾，以展示作品。
PortfolioStudioCleanTypographyEditorial
01
設計氣質 DNA
設計作品集極簡編輯式高端
一個策展過的設計師作品展廊，以大膽的字體排印和克制的優雅來呈現。
02
色彩
#42ff00Accent
#0b0b0fInk
#bbbbbbInk soft
#f7f7f7BG
rgba(11,11,15,1)Line
高對比的單色調色板搭配單一鮮明強調色，使用淺色中性背景，讓作品影像得以突出。
03
字型
geometric-sans · humanist-sans · monospace
- display
110px · 400 - heading
54px · 400 - subhead
34px · 400 - body
28px · 400 - caption
16px · 400
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
一種寬鬆的編輯式節奏，運用充裕的 padding 與間隙，創造出開放、可呼吸的版面。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 15px
lg · 300px
pill · 999px
使用近乎黑色的細實線作為內容區塊間的主要分隔線。
06
版面
1440container
12columns
24pxgutter
768 / 1024breakpoints
不對稱的編輯式網格，包含重疊的影像與大型文字區塊，打破傳統欄位結構。
07
動效與互動
140msmicro
200mssmall
600msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
互動元素的平滑縮放與透明度過渡 · 影像群組的類 Parallax 移動
元素在 hover 時會略微放大。 · 所有互動元素使用標準指標游標。
08
組件
- button 極簡的文字式導覽，單一作用項目以鮮明的綠色背景區塊來標示。
- card 影像以寬鬆、重疊的群組呈現，無嚴格容器，漂浮於背景之上。
- chip 未使用。
- input 未使用。
- hero 一種動態的拼貼風格構圖，包含大型重疊攝影作品與大膽的超大字體。
09
文案語氣與禁用清單
- 語氣 自信、專業且具藝術性的大膽。
- 標題風格 超大型、緊密追蹤的幾何無襯線字體標題與姓名。
- 按鈕文案 極簡，依賴文字和單一星號圖示，而非傳統按鈕形狀。
- 不要使用投影——截圖顯示的是邊緣清晰的平面影像。
- 不要使用卡片容器來放置圖片——截圖顯示圖片自由漂浮並重疊。
- 不要使用多種字體粗細來強調——截圖幾乎只顯示粗細 400，依賴大小來建立層級。
- 不要將標題置中對齊——截圖顯示的是左對齊或不對稱放置的文字。
- 不要使用多種強調色——截圖只顯示一種鮮明的綠色強調色。
- 不要使用密集的段落文字——截圖顯示的是簡短、有力的陳述和清單。
- 避免: 避免裝飾性花紋或手寫字體
- 避免: 避免使用多種強調色
- 避免: 避免密集的文字區塊或雜亂的版面
- 避免: 避免使用卡片或彈窗等標準 UI 元件模式
- 避免: 避免複雜的背景或漸層
- 避免: 避免使用投影來營造深度
10
包內真實截圖
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏擷取自真實頁面 · 真 computed styles
11
System Prompt
這是一個為創意總監設計的高端設計作品集，定位為大膽、編輯式的自信風格。其設計 DNA 建立在一套嚴謹、高對比的單色調色板上：極淺的灰色背景 (#f7f7f7)、近乎黑色的墨色 (#0b0b0f)，以及單一、鮮明的綠色強調色 (#42ff00)，僅用於作用狀態。字體排印以幾何無襯線展示字體 (Helvetica Neue) 為主，使用巨大尺寸（最大可達 110px）並搭配緊密追蹤，內文則搭配人文無襯線字體。版面採用不對稱、打破網格的構圖，並留有充裕的空白。關鍵禁忌：絕不使用投影、絕不將影像放入卡片容器、絕不使用多種強調色。此網站採用寬鬆的編輯式節奏與平滑過渡 (cubic-bezier(0.4, 0, 0.2, 1)) 作為互動效果。
en · zh-CN · zh-TW · ja · ko