精選 · 開放 · 免費
Richardekwonye
具大膽排版表現的極簡主義創意開發者作品集
PortfolioBold TypographyCleanDeveloperPhotographic
01
設計氣質 DNA
極簡專業排版導向設計工程師
一份結構完善的數位作品集建築藍圖
02
色彩
#000000Ink
#E1DFDDBG
rgba(0,0,0,1.0)Line
高對比的單色調,搭配溫暖的中性色背景
03
字型
geometric-sans
- display
144px · 500 - h2
40px · 500 - body
16px · 400
所有標題與展示文字皆為大寫 · 大型排版採用緊湊的字距調整 · 內文使用 400 字重,標題使用 500 字重,形成字重對比
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
170px
基於 4px 格線的垂直節奏,搭配寬裕的留白
05
表面 (圓角 / 陰影 / 邊線)
sm · 0px
md · 0px
lg · 0px
pill · 999px
無可見邊框;簡潔的邊對邊佈局
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
具寬裕負空間的非對稱格線
07
動效與互動
220msmicro
400mssmall
1000msmedium
cubic-bezier(0.62, 0.05, 0.01, 0.99)easing
捲動時平滑的 transform 過渡效果 · 所有元素皆已定義 transition 屬性
互動元素上顯示游標指標 · 具視覺回饋的即時反應
08
組件
- button 極簡的文字式導覽,採用大寫處理
- card 無邊框或陰影的攝影元素
- hero 全出血的排版首頁區塊,整合大型圖片
09
文案語氣與禁用清單
- 語氣 自信、專業、內斂
- 標題風格 大膽、大寫、直接的陳述
- 按鈕文案 極簡的文字式導覽,無按鈕
- 不要使用圓角——截圖顯示的是銳利的矩形邊緣
- 不要添加陰影——截圖顯示的是平面、無陰影的表面
- 不要使用多種顏色——截圖僅顯示黑色與溫暖灰色
- 不要建立擁擠的佈局——截圖顯示寬裕的留白
- 不要使用小寫標題——截圖顯示全大寫文字
- 不要添加裝飾性邊框——截圖顯示無邊框的設計
- 避免: 裝飾性元素
- 避免: 複雜的動畫
- 避免: 鮮豔的色彩
- 避免: 擁擠的佈局
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
這是一個極簡主義的創意開發者作品集,屬於目前任職於 Stripe 的設計工程師 Richard Ekwonye。設計採用嚴格的單色調色板,包含溫暖的中性色背景 (#E1DFDD) 與黑色文字 (#000000)。排版使用幾何無襯線字體 (PP Neue Montreal),具有極端的尺度對比,以 144px 的展示字型搭配 16px 的內文字型。關鍵設計原則:維持所有標題的大寫處理,保留寬裕的留白 (170px 垂直內距),避免任何裝飾性元素或邊框,使用銳利的矩形形狀且無 border-radius,並實作流暢的 1 秒 cubic-bezier 過渡效果。佈局為非對稱的 12 欄格線,專注於排版表現而非視覺裝飾。
en · zh-CN · zh-TW · ja · ko