01
设计气质 DNA
技术性实用主义档案创新极简
工业设计实验室遇上高端户外服装
02
色彩
#000000Ink#FFFFFFBG#666666Mutedrgba(0,0,0,0.1)Line高对比度单色基底,严格克制,让产品摄影承载视觉重量。
03
字体
- display
48px · 700 - body
16px · 400
主要导航和分类标签使用大写字母。 · 展示型文字保持紧密的字间距。
04
间距
4px8px16px24px32px48px64px96px慷慨的垂直间距营造出高端时尚电商典型的清爽、透气的布局。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 0px
无边框,或使用非常微妙的1px实线 rgba(0,0,0,0.1) 来划分卡片。
06
布局
1440container
12columns
24pxgutter
768 / 1024breakpoints
产品网格,配合慷慨留白和简洁的左对齐或居中结构。
07
动效与交互
150msmicro
300mssmall
600msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
页面切换时微妙的淡入效果。 · 长产品页面的平滑滚动。
按钮和链接上微妙的透明度变化或颜色反转。 · 即时视觉反馈,无繁重动画。
08
组件
- button 极简主义,高对比度文字,无圆角,注重排版而非形状。
- card 简洁的矩形,采用出血式图像和最小化文字,棱角分明。
- chip 用于产品分类的简单矩形标签。
- input 用于搜索和表单的带下划线或极简边框的输入框。
- hero 大幅编辑式摄影,叠加极简文字,优先确保产品可见性。
09
文案语气与禁用清单
- 语气 权威、技术化且低调。
- 标题风格 简短、有力的短语,常为大写,聚焦于材料或创新。
- 按钮文案 直接且功能化(例如:“探索”、“立即购买”)。
- 不要使用圆角——截图显示的是棱角分明的矩形几何形态。
- 不要使用亮色点缀色——截图显示的是严格的单色调色板。
- 不要使用装饰性字体——截图使用的是简洁的几何无衬线字体。
- 不要让界面显得杂乱——截图展示了大量留白和极简网格。
- 不要使用厚重的投影——截图显示的是无可见阴影的扁平表面。
- 不要使用随意、俏皮的语言——截图展示的是技术性、权威性的语调。
- 避免: 过度促销的语言。
- 避免: 明亮、饱和的调色板。
- 避免: 圆润、趣味性的UI元素。
- 避免: 密集、杂乱的布局。
- 避免: 装饰性排版或过度加粗。
11
System Prompt
这是一个高端时尚品牌,具有鲜明、实用且技术化的美学。核心设计依赖于严格的单色调色板(#000000墨色在#FFFFFF背景上)和简洁的几何无衬线字体。布局宽敞,采用12列网格,优先呈现高质量产品摄影而非UI装饰。关键约束:避免圆角,切勿使用亮色点缀色,并保持高度克制、建筑感十足的风格。交互应微妙而功能化,聚焦于通过产品类别实现无缝导航。