---
name: decision-surface
description: "黑白决策面 (Monochrome Decision Surface) style skill for AI website building."
---

# 黑白决策面 (Monochrome Decision Surface)

## 适用场景 / Use When

决策看板 / 岗位优先级排序 / 风险对比面 / 需要把 constraints 和 options 同时放在一页的系统

## 适合做 / Best For

- 决策看板
- 优先级排序面
- 岗位比较系统

## 不适合做 / Not For

- 彩色营销首页
- 纯灵感瀑布流
- 只有 hero 没有取舍结构的页面

## 长这样 / Visual Traits

- 左侧约束固定
- 右侧排序与雷达
- 黑白克制
- 表格与分数清楚

## 配色系统 / Color System

- 黑白高对比最稳
- 颜色只用于极少量状态提示
- 不要让强调色盖过数据与层级

## 排版系统 / Typography

- serif 标题负责定调
- 标签和元数据要短而准
- 表格、分数和轴标签必须一眼能扫

## 版式规则 / Layout Rules

- 左边是固定 constraint spine，右边是排序与比较主面
- 需要同时容纳雷达、列表和表格
- 每个模块都要服务取舍而不是装饰

## 图片处理 / Image Treatment

- 图像很少，优先使用雷达、分数条、表格和结构化卡片
- 不要依赖摄影 hero
- 图形只服务判断，不服务气氛

## 动效节奏 / Motion

- 滚动以稳定和定位感为主
- sticky spine 可以保留
- 不要用过多过场动画干扰判断

## 推荐结构 / Recommended Structures

- 工作台型 / Workbench / Tool Shell
- 目录索引型 / Catalog Explorer

## 历史来源 / Historical Roots

- 瑞士风格 / Swiss Style
- 包豪斯 / Bauhaus

## 参考网站 / Reference Sites

- SiteInspire: https://ourworldindata.org/
- Are.na / Board: https://www.are.na/

## 注意避坑 / Avoid

- 彩色营销 landing
- 只有卡片没有排序逻辑
- 把 decision board 做成纯灵感看板

## Prompt DNA

```text
请参考黑白决策面（Monochrome Decision Surface）风格建站：
视觉特征：左侧约束固定 / 右侧排序与雷达 / 黑白克制 / 表格与分数清楚
适合场景：决策看板 / 优先级排序面 / 岗位比较系统
不适合：彩色营销首页 / 纯灵感瀑布流 / 只有 hero 没有取舍结构的页面
推荐页面组织：工作台型 / Workbench / Tool Shell / 目录索引型 / Catalog Explorer
历史来源：瑞士风格 / Swiss Style / 包豪斯 / Bauhaus
参考网站：SiteInspire: https://ourworldindata.org/ / Are.na / Board: https://www.are.na/
配色系统：黑白高对比最稳 / 颜色只用于极少量状态提示 / 不要让强调色盖过数据与层级
排版系统：serif 标题负责定调 / 标签和元数据要短而准 / 表格、分数和轴标签必须一眼能扫
版式规则：左边是固定 constraint spine，右边是排序与比较主面 / 需要同时容纳雷达、列表和表格 / 每个模块都要服务取舍而不是装饰
图片处理：图像很少，优先使用雷达、分数条、表格和结构化卡片 / 不要依赖摄影 hero / 图形只服务判断，不服务气氛
风格要求：Use a monochrome decision surface family: a sticky left constraint spine, a right column for ranked comparisons, radar or score overlays, tables that expose tradeoffs fast, restrained serif headlines, and black-white data clarity instead of a marketing hero.
```
