精選 · 開放 · 免費
Julienrenau
為創意技術專家打造的極簡排版作品集，透過精簡設計強調技術專業。
Developer ToolsPortfolioCleanMinimalTypography
01
設計氣質 DNA
作品集創意技術專家webgl極簡技術
一個極簡、高對比的數位作品集，展示進階創意技術專案。
02
色彩
#272727Ink
#EBEBEBBG
#898989Muted
rgba(39,39,39,0.15)Line
極度克制；單色調色板搭配高對比度以利閱讀。
03
字型
grotesque-sans
- display
45px · 500 - body
16px · 400
所有文字元素使用 Founders Grotesk。 · 標題維持緊湊行高。 · 使用粗體字重（700）以強調與標註中繼資料。
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
嚴格垂直節奏，搭配大區塊空白。
05
表面 (圓角 / 陰影 / 邊線)
sm · 0px
md · 0px
lg · 0px
pill · 0px
使用主要墨水顏色的 1px 實線邊框作為分隔。
06
版面
1440container
12columns
24pxgutter
768 / 1024breakpoints
不對稱網格，具有大區塊空白與水平線。
07
動效與互動
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
互動元素具有細膩的 hover 轉場效果。 · 專案展示區採用水平捲動或滑動。
細膩的顏色或透明度變化。 · 直接導覽至專案詳情。
08
組件
- button 純文字連結，無背景或邊框。
- card 大型橫向區塊的專案卡片，帶有頂部邊框。
- hero 以文字為主的主視覺區塊，搭配大型排版與極簡影像。
09
文案語氣與禁用清單
- 語氣 專業、簡潔且具技術性。
- 標題風格 簡短、具描述性的標題，以破折號分隔。
- 按鈕文案 極簡、以文字為主的行動呼籲。
- 不要使用裝飾性插圖——截圖僅顯示簡潔文字與攝影作品。
- 不要使用明亮的強調色——截圖顯示單色調色板。
- 不要使用圓角——截圖顯示銳利的矩形元素。
- 不要使用投影——截圖顯示扁平化、以邊框為主的設計。
- 不要使用複雜的導覽——截圖顯示簡潔的文字連結。
- 不要使用活潑字體——截圖顯示乾淨的 grotesque 無襯線字體。
- 避免: 避免裝飾性元素或插圖。
- 避免: 避免明亮或飽和的色彩。
- 避免: 避免複雜的版面結構。
- 避免: 避免活潑或非正式的語言。
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
這是一個為創意技術專家設計的極簡作品集，採用強烈、高對比的單色調色板（墨水 #272727 搭配背景 #EBEBEB），並使用單一 grotesque-sans 字體（Founders Grotesk）。版面為不對稱設計，具有大區塊空白並以水平線分隔區塊。關鍵特徵包括：大型粗體排版用於專案標題、純文字導覽，以及完全不使用裝飾性元素或陰影。重要注意事項：避免使用明亮的強調色、圓角以及活潑的語言。定位為專業且技術性強調 WebGL 與 Unity 專案。
en · zh-CN · zh-TW · ja · ko