精選 · 開放 · 免費
Tparkes
展示品牌與網站作品的個人數位設計主管作品集。
PortfolioStudioCleanBold TypographyRestraint
01
設計氣質 DNA
數位設計主管作品集Tom Parkes倫敦
一個簡潔、專業的數位作品集,具備大膽且具表現力的排版。
02
色彩
#333333Ink
#FFFFFFBG
#A7A7A7Muted
rgba(51, 51, 51, 1)Line
高對比的單色調色盤,依賴字型比例而非色彩強調。
03
字型
sans-serif
04
間距
4px
8px
16px
20px
24px
32px
48px
120px
慷慨的留白與內邊距,強調大尺寸排版。
05
表面 (圓角 / 陰影 / 邊線)
sm · 8px
md · 12px
lg · 16px
pill · 999px
使用主要文字顏色的細微邊框,常用於卡片或介面元件。
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
全幅主視覺區塊,文字左對齊,頂部設有導覽列。
07
動效與互動
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.46, 0.45, 0.94)easing
滾動觸發的專案卡片顯示效果
互動元件上的細微透明度變化或游標指標變化。 · 直接導航或平滑滾動至專案區段。
08
組件
- button 極簡的文字連結或圖示按鈕(例如:漢堡選單、「探索我的作品」)。
- card 大型、全幅的圖片/影片卡片,帶有圓角。
- hero 主導性的排版陳述,搭配內嵌圖示與大型單色圖片。
09
文案語氣與禁用清單
- 語氣 專業、自信且直接。
- 標題風格 使用柔和灰色與黑色圖示的大型、粗體無襯線字體陳述。
- 按鈕文案 簡潔、低調的文字連結,如「探索我的作品」。
- 避免使用彩色漸層——截圖顯示嚴格的單色調色盤。
- 避免使用襯線字體——排版嚴格使用無襯線字體。
- 避免隱藏導覽——漢堡選單在手機版上應顯著。
- 避免使用小而擁擠的文字——主視覺字型尺寸極大(86px)。
- 避免使用繁雜的背景——背景為乾淨的白色。
- 避免使用厚重的陰影——表面應為平面且簡潔。
- 避免: 避免使用鮮豔色彩
- 避免: 過度裝飾
- 避免: 過於複雜的導覽
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
這是一個具有簡潔單色美學的個人數位設計作品集。使用大型無襯線展示字型(86px)呈現大膽陳述,並以小巧、高對比的黑色圖示作為點綴。主要顏色為白色(#FFFFFF)作為背景,深灰色(#333333)作為墨色,淺灰色(#A7A7A7)作為柔和元素。關鍵色碼包括 #333333、#A7A7A7 和 #FFFFFF。關鍵限制:絕不使用彩色強調、襯線字體或複雜的介面模式。佈局寬敞,依賴慷慨的留白與單欄式容器。導覽極簡,專注於作品展示。
en · zh-CN · zh-TW · ja · ko