OpenDesign·你的设计资产库

网页参考

Bastienallard

一位高级艺术总监的极简个人作品集,采用单色方案并具有强烈的排版存在感。

PortfolioStudioTypographyMonochromeCuration
Bastienallard 网站截图

01

设计气质 DNA

极简逻辑优美毫不费力工作室

一个干净、高对比度的编辑式布局,旨在展示数字设计专长。

02

色彩

#000000Ink
rgba(0,0,0,0.8)Ink soft
#FFFFFFBG
#7F7F7FMuted

极端高对比度的单色方案,无强调色,依赖排版和摄影来构建视觉层次。

03

字体

geometric-sans · monospace

  • display56px · 540
  • body16px · 540

所有界面文字使用 Diatype Variable 字体 · 保持标题紧凑的字间距 · 仅将系统字体用作后备方案

04

间距

4px
8px
16px
24px
32px
48px
64px
96px

充足的留白,采用严格的 4px 基线网格。

05

表面 (圆角 / 阴影 / 边线)

sm · 4px
md · 8px
lg · 12px
pill · 999px

使用 rgba(0,0,0,0.8) 实现的细微 1px 边框,用于分隔。

06

布局

1440container
12columns
24pxgutter
768 / 1024breakpoints

简洁的三栏页脚布局,拥有宽敞、开阔的主要内容区域。

07

动效与交互

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

所有交互元素使用平滑过渡 · 悬停时微妙的光标变化

链接上微妙的不透明度变化或颜色反转。 · 立即反馈,无沉重动画。

08

组件

  • button 无背景填充的极简文本按钮。
  • card 以图片为主的项目卡片,带有细微的排版叠加。
  • chip 用于分类的简单文本标签。
  • input 干净、无边框的文本输入框。
  • hero 大尺寸、高冲击力的排版,搭配编辑式摄影。

09

文案语气与禁用清单

  • 语气 专业、自信且内敛。
  • 标题风格 粗体、直接且高度易读。
  • 按钮文案 引导而非张扬的微妙文本链接。
  • 不要使用深色模式 — 截图显示为纯白背景。
  • 不要添加明亮的强调色 — 方案严格为单色。
  • 不要使用装饰性衬线字体 — 截图显示全文使用几何无衬线体。
  • 不要添加厚重的投影 — 表面是扁平的,依赖边框或排版来营造深度。
  • 不要用多种颜色使界面杂乱 — 采用严格的黑、白、灰方案。
  • 不要在所有地方使用圆角 — 设计是锐利且建筑感的。
  • 避免: 过度装饰
  • 避免: 刺眼的颜色
  • 避免: 复杂的动画

10

包内真实截图

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

这是一位高级艺术总监的极简作品集,采用单色方案(黑色油墨 #000000,白色背景 #FFFFFF,柔和灰色 #7F7F7F)。排版使用几何无衬线体(Diatype Variable),展示尺寸下字间距紧凑。布局宽敞,留白充足,具有清晰的编辑感。关键禁忌:不要引入明亮的强调色,不要使用装饰性衬线体,不要用厚重的阴影或复杂的界面组件使界面杂乱。设计依赖强有力的摄影和粗体排版来创造冲击力。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明,可复制给 Agent。