OpenDesign·你的设计资产库

网页参考

Studio Dumbar

一家以动态优先的设计机构作品集,通过3D渲染与大胆视觉实验突破排版边界。

BrandMotion
Studio Dumbar 网站截图

01

设计气质 DNA

实验性动态3D排版设计工作室

一家将排版视为3D雕塑的实验性动态设计工作室。

02

色彩

#FFFFFFInk
#868686Ink soft
#000000BG
rgba(255,255,255,1.0)Line

严格的单色调色板,色彩仅通过展示的作品图像呈现。

03

字体

geometric-sans · humanist-sans

  • display56px · 400
  • body20px · 400

导航使用一致的20像素无衬线字体。 · 展示性排版依赖3D渲染形态,而非传统网络字体。 · 层级通过比例和维度渲染实现,而非字重变化。

04

间距

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

非对称间距,侧重视觉构图而非严格遵循网格。

05

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

sm · 0px
md · 0px
lg · 0px
pill · 999px

0 0 0 rgba(0,0,0,0) 用于平面UI元素 · 复杂3D光效渲染于项目图像内

06

布局

1920container
12columns
24pxgutter
768 / 1024breakpoints

全出血沉浸式布局,浮动导航且结构网格可见度极低。

07

动效与交互

200msmicro
400mssmall
1000msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing

状态变化时平滑的背景色过渡。 · 项目展示间的沉浸式全视口过渡。 · 主视觉区域内3D对象的旋转与变形。

通过过渡属性实现细微光标状态变化与链接高亮。 · 沉浸式过渡至项目详情视图。

08

组件

  • button 基于文本的极简导航链接,无可见按钮样式。
  • card 全出血项目展示,以视频/图像作为主要容器。
  • chip 未观察到。
  • input 未观察到。
  • hero 全视口沉浸区域,由大型3D排版或动态图形主导。

09

文案语气与禁用清单

  • 语气 自信、实验性、视觉驱动。
  • 标题风格 精简文本,依赖3D视觉形态传达项目身份。
  • 按钮文案 低调导航链接(作品、服务、关于、招聘、联系),隐退以突出作品本身。
  • 勿使用彩色UI元素——截图显示严格单色调色板,所有色彩均来自作品图像。
  • 勿为UI组件添加厚重投影——截图显示平面界面,所有维度感存在于项目渲染中。
  • 勿使用多种字重强调——截图显示UI全程使用一致的400字重。
  • 勿用次要UI元素杂乱界面——截图显示极简外观,仅含导航与项目标题。
  • 勿在容器上使用圆角——截图显示布局始终采用锐利、干净的边角。
  • 勿使用浅色背景——截图显示纯黑背景主导整个体验。
  • 避免: 装饰性边框
  • 避免: 繁复的背景图案
  • 避免: 文字密集的介绍

10

包内真实截图

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

11

System Prompt

这是一家实验性动态设计工作室的作品集,定位于3D渲染与排版的交叉点。视觉系统建立在严格的单色基础上:纯黑背景(#000000)、白色文本(#FFFFFF)及用于次要元素的柔灰(#868686)。UI层排版极简,导航采用几何与人文无衬线字体类别(20像素),而实际展示时刻则是3D渲染的排版雕塑,既作为主视觉也作为项目标识。布局采用全出血沉浸式设计,摒弃传统网格结构,追求电影感构图。关键约束包括:不使用彩色UI元素(所有色彩均源于作品)、不为界面组件添加厚重投影、容器不使用圆角。运动系统强调平滑的1秒过渡与3D对象操作。此方法确保作品集自身演示工作室的动态能力,而非仅作描述。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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