01
设计气质 DNA
极简简洁精心策划专业以摄影为核心
一面简洁的白色画廊墙,项目即是艺术品。
02
色彩
#000000Ink#999999Ink soft#FFFFFFBGrgba(0,0,0,0.1)Line鲜明的单色,以最大化作品集图像的视觉冲击力。
03
字体
- display
18px · 600
所有排版均为大写,尺寸紧凑一致,以形成统一的网格。 · 粗体黑色标题与浅灰色类别标签之间形成高对比度。
04
间距
4px8px16px24px32px48px64px96px项目卡片和标签之间保持一致的24px-32px垂直节奏。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 0px
无可见边框;元素通过间距和颜色对比来定义。
06
布局
1440container
3columns
24pxgutter
768 / 1024breakpoints
一个简洁的三栏瀑布流或等宽网格,展示大型、高质量的项目缩略图。
07
动效与交互
200msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
静态布局,截图中无可见的复杂动画。
在项目缩略图上进行微妙的不透明度或缩放过渡,以表示可交互性。 · 立即导航到详细的项目案例研究。
08
组件
- button 简单的文本链接,无背景或边框,作为清晰的导航元素。
- card 项目卡片由一张大型全宽图片和其下方的两部分文字行(粗体黑色的标题,浅灰色的类别)组成。
- chip 不适用 - 项目通过顶部简单的文本链接进行筛选。
- input 不适用
- hero 不适用 - 网站采用基于网格的即时画廊方式,而非传统的首屏区域。
09
文案语气与禁用清单
- 语气 专业、客观、自信。
- 标题风格 大写、粗体、高可读性的几何无衬线字体。
- 按钮文案 极简且不突兀,通常只是一个简单的“联系”链接。
- 不要使用装饰性或手写字体——截图显示的是简洁、几何的无衬线排版。
- 不要使用复杂的背景或渐变——截图显示的是鲜明、纯白的背景。
- 不要在元素上使用圆角——截图显示项目图片具有清晰、方形的边缘。
- 不要使用厚重的投影或深度效果——截图显示的是完全扁平的二维布局。
- 不要用过多的UI元素使界面杂乱——截图中只显示项目图片和极少的文字。
- 不要使用彩色或高饱和度的调色板——截图几乎是完全的单色,只有黑色和灰色文字。
- 避免: 过度装饰性文字
- 避免: 大型装饰性标题
- 避免: 草书或手写字体
11
System Prompt
这是一个专业的设计作品集网站,采用鲜明、极简的美学风格来展示作品。定位为一个精心策划的画廊,其中图像是主要焦点。关键颜色是纯白(#FFFFFF)背景,配以纯黑(#000000)文字和浅灰(#999999)的辅助文字。排版依赖于简洁、大写的几何无衬线字体。关键禁忌:避免使用装饰性或手写字体,避免复杂的背景或渐变,且绝不使用圆角或厚重的投影。布局是一个简单、高对比度的三栏网格。