精选 · 开放 · 免费

Wandelmaier

为产品设计策略师打造的精致、高对比度作品集

PortfolioTypographyCleanStudioRefined

Wandelmaier 网站截图

↓ 下载设计系统包 (65 MB)在 OpenDesign 中打开

原站: http://wandelmaier.com

📦 浏览包内文件 →

01

设计气质 DNA

专业以人为本策略性创意

一个极简主义建筑工作室的作品集

02

色彩

#FFFFFFInk

#191816BG

#A9A9A9Muted

rgba(255, 255, 255, 0.1)Line

采用柔和的中性文本色的高对比度深色主题

03

字体

transitional-serif · humanist-sans

display187px · 300
heading50px · 300
body24px · 300
caption16px · 300

04

间距

4px

8px

16px

24px

32px

48px

64px

96px

以 32px 为基础增量的宽松垂直节奏

05

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

sm · 4px

md · 48px

lg · 72px

pill · 9999px

大多数元素无可见边框

06

布局

1440container

12columns

32pxgutter

768 / 1024breakpoints

大尺寸、居中的内容块，配有充足留白

07

动效与交互

220msmicro

400mssmall

800msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

交互元素上的细微背景色过渡 · 即时的视觉反馈

08

组件

button 药丸形或大号圆角矩形，采用纯色填充
card 以图片为主的项目卡片，下方附有简洁的文字描述
chip 无
input 无
hero 超大字体的主视觉，搭配重叠的彩色形状

09

文案语气与禁用清单

语气专业、简洁、直接
标题风格 小写、极简且高度风格化
按钮文案 简洁的文本或基于图标的操作号召

避免使用多种相互竞争的强调色——截图显示使用了三种 distinct、醒目的强调形状，且使用克制，绝不同时作为界面装饰
避免将所有文本内容居中——截图显示正文和描述采用了清晰的左对齐
避免使用复杂的卡片边框或阴影——截图显示使用了扁平、无边框的图片卡片
避免使用小而紧凑的排版——截图显示使用了极大、宽松的展示型字体
避免使用浅色主题——截图显示采用了统一、深邃的深色背景
避免标题使用大写字母——截图显示主视觉文本采用了小写
避免: 过度行话
避免: 杂乱的布局
避免: 模糊的描述

10

包内真实截图

Wandelmaier — 桌面首屏（hero） — 桌面首屏（hero）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Wandelmaier — 移动首屏 — 移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

这是一个产品设计策略师的个人作品集。定位专业、精致，专注于高端工艺。关键色彩为深邃温暖的近黑色背景（#191816），搭配纯净白色文本（#FFFFFF）和用于次要信息的柔和灰色（#A9A9A9）。调色板以三个醒目的纯色形状点缀：鲜明的绿色（#34A847）、柔和的粉色（#FBCBCB）和温暖的珊瑚色（#F27851）。字体使用人文无衬线体（PolySans）用于界面，以及过渡衬线体（Canela）用于表现力强的展示文本，两者都采用极轻的字重。关键禁忌：避免使用小而密集的文本；避免同时使用多种相互竞争的强调色；避免在卡片上使用厚重的阴影或边框；避免标题使用大写字母；避免使用浅色配色方案；避免使用复杂、杂乱的布局。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko