极简视觉风格

本词条尚无可操作示例；插画为编辑示意。应用到产品时仍须在真实页面上验证：被删减的元素是否真的不支持任务，主要操作与导航是否仍能被用户一眼发现。

{
  "tokens": {
    "surface": "#f6f1e6",
    "ink": "#3a4747",
    "accent": "#c9713d",
    "radiusPx": 2,
    "shadow": "none"
  },
  "tokenScope": "本样例配方：双色为主、仅一处强调色；实际产品可保留极浅阴影，但需验证可交互元素的可发现性。"
}

{
  "id": "minimalism",
  "type": "visual",
  "name": {
    "zh": "极简视觉风格",
    "en": "Visual Minimalism"
  },
  "aliases": [
    "Minimalism",
    "极简主义",
    "Minimalist Design"
  ],
  "granularity": "experience",
  "intents": [
    "express-brand",
    "reduce-complexity"
  ],
  "tags": [
    "留白",
    "少色",
    "克制排版",
    "去元素",
    "可发现性"
  ],
  "definition": "以“把界面削减到必要元素”为特征的视觉风格：通过去除不支持用户任务的元素或内容，用受限的色彩、最大化的留白、克制而有表现力的排版来组织界面。",
  "boundary": "极简视觉风格描述的是“减少元素数量”这一取向，不限定于瑞士国际主义——后者是以网格与排版为核心的具体传统，极简可以借用它，也可以不借用。它与扁平化设计常同时出现但关注点不同：扁平化去掉的是模拟三维的线索（阴影、渐变、光泽），极简去掉的是元素本身；一个页面可以扁平而不极简，也可以极简而保留细微阴影。它也不等于 Nielsen 第 8 条启发式“美学与极简设计”——该启发式关心的是信息是否与任务相关，而不是视觉外观；视觉极简不自动满足它，满足它的界面也不必看起来极简。当极简走向隐藏导航或去掉必要的可点击提示时，它就从风格问题变成了可用性问题。",
  "signature": [
    "受限的、常为单色或双色的调色板，只有极少量强调色",
    "大面积留白，元素之间距离远，每屏内容极少",
    "少量但醒目的排版承担层级表达，装饰性图形与功能入口被压缩到最低"
  ],
  "when": [
    "内容本身是主角（作品集、长文、单一产品页），需要把注意力集中在少数信息上",
    "品牌希望表达克制、高端或平静的气质，并愿意为此牺牲一屏内的信息密度",
    "已经明确了内容优先级，知道哪些元素可以删去而不损害任务完成"
  ],
  "when_not": [
    "用户任务依赖丰富的功能入口或对比信息（后台、数据密集型工具、电商列表）",
    "为了“看起来干净”把导航、筛选或主要操作藏进折叠菜单，用户需要额外一步才能找到",
    "内容优先级尚未确定，减少元素只是审美选择而非基于任务的取舍"
  ],
  "tradeoff": "视觉更专注、品牌感更强、页面更易适配，但每屏承载的信息变少，用户可能需要更多滚动或点击；被删掉的元素若恰好是任务所需，可用性会直接受损。",
  "comparison": {
    "focus": "把界面削减到必要元素的视觉取向",
    "mechanism": "受限色彩、最大化留白、克制排版、删减功能入口与装饰",
    "cost": "信息密度下降，且可能误删必要的提示与入口"
  },
  "sources": [
    {
      "id": "minimalism-nng-characteristics",
      "title": "Nielsen Norman Group · The Characteristics of Minimalism in Web Design",
      "url": "https://www.nngroup.com/articles/characteristics-minimalism/",
      "claim": "该文（Kate Moran，2015-07-12）把极简定义为“通过去除不支持用户任务的多余元素或内容来简化界面”，并基于 112 个极简网站样本归纳出定义性特征：扁平图案与纹理（96%）、受限或单色调色板（95%）、受限的功能与图形元素（87%）、最大化留白（84%）、戏剧性排版（75%）；文章同时警告不要为了留白而隐藏用户任务所需的内容或导航；本词条的定义、特征与“不适用”条件据此转述。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://www.nngroup.com/articles/characteristics-minimalism/",
        "status": "available",
        "checkedAt": "2026-09-15T18:39:41.717Z",
        "jobId": "spn2-eaf288b009dda65f86cf27df6cea79b0ac18a1c4",
        "url": "https://web.archive.org/web/20260915184105/https://www.nngroup.com/articles/characteristics-minimalism/",
        "timestamp": "20260915184105"
      }
    },
    {
      "id": "minimalism-nng-roots",
      "title": "Nielsen Norman Group · The Roots of Minimalism in Web Design",
      "url": "https://www.nngroup.com/articles/roots-minimalism-web-design/",
      "claim": "该文（Kate Moran，2015-06-28）把网页极简追溯到 20 世纪 60 年代的极简艺术、包豪斯与 Müller-Brockmann、Rams、Mies van der Rohe 等人的实践，以及 Tufte 的数据墨水比与 Carroll 的技术传播极简主义，指出网页极简与扁平化等趋势相互重叠但并不相同，并警告过分坚持极简会导致“浪费性的低信息密度”；本词条关于“不限定瑞士传统”“与扁平化重叠而不同”的边界据此提出。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://www.nngroup.com/articles/roots-minimalism-web-design/",
        "status": "available",
        "checkedAt": "2026-09-15T18:39:41.719Z",
        "jobId": "spn2-5dc96a8c557716c6077a4f4b6db269dad83d0d90",
        "url": "https://web.archive.org/web/20260915184117/https://www.nngroup.com/articles/roots-minimalism-web-design/",
        "timestamp": "20260915184117"
      }
    },
    {
      "id": "minimalism-nng-heuristic-8",
      "title": "Nielsen Norman Group · Aesthetic and Minimalist Design (Usability Heuristic #8)",
      "url": "https://www.nngroup.com/articles/aesthetic-minimalist-design/",
      "claim": "该文（Therese Fessenden，2021-01-24）解释第 8 条启发式“界面不应包含无关或很少需要的信息”，并明确指出极简视觉设计（有时被称作扁平设计）并不默认满足这条启发式，常常反而去掉了必要元素；满足该启发式的界面也不必是极简风格；本词条把“视觉极简”与“内容相关性启发式”区分开来的边界据此提出。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://www.nngroup.com/articles/aesthetic-minimalist-design/",
        "status": "pending",
        "checkedAt": "2026-09-15T18:45:01.171Z",
        "error": "status-request-failed",
        "jobId": "spn2-49f0bf1e2d09b265a5e8d894b52ad77a20fd0c14"
      }
    }
  ],
  "relations": [
    {
      "target": "flat-design",
      "kind": "related",
      "condition": "同一界面既减少元素数量又去除阴影、渐变等立体线索",
      "reason": "两者常被混称，但扁平化关心是否保留三维线索，极简关心元素是否必要；可以只取其一。",
      "basis": "editorial"
    },
    {
      "target": "swiss",
      "kind": "informs",
      "condition": "极简页面采用网格与无衬线排版来组织稀少的元素",
      "reason": "瑞士国际主义是极简常借用的一种排版传统，但极简并不限定于它。",
      "basis": "editorial"
    },
    {
      "target": "recognition",
      "kind": "conflicts_when",
      "condition": "为了减少元素而隐藏导航或去掉可点击提示，用户需要回忆入口在哪里",
      "reason": "用户依赖可见的提示辨认可操作对象；极简不应以牺牲可发现性为代价。",
      "basis": "editorial"
    }
  ],
  "rules": [
    {
      "when": "删去某个元素、描边或阴影以简化页面",
      "instruction": "不得因此去掉用户完成主要任务所需的提示或入口；被删减的元素必须是不支持任务的，而不是只为了视觉干净。",
      "strength": "must",
      "basis": "editorial"
    },
    {
      "when": "决定页面保留哪些元素",
      "instruction": "先确定内容与任务优先级，再按优先级削减；在优先级不明时不要先做视觉减法。",
      "strength": "recommend",
      "basis": "editorial"
    },
    {
      "when": "极简页面的信息密度明显低于用户任务所需",
      "instruction": "恢复必要的结构与入口，或改用渐进披露而不是完全隐藏。",
      "strength": "recommend",
      "basis": "editorial"
    }
  ],
  "visual": {
    "tokens": {
      "surface": "#f6f1e6",
      "ink": "#3a4747",
      "accent": "#c9713d",
      "radiusPx": 2,
      "shadow": "none"
    },
    "tokenScope": "本样例配方：双色为主、仅一处强调色；实际产品可保留极浅阴影，但需验证可交互元素的可发现性。"
  },
  "demo": null,
  "version": "0.1.0",
  "editorialStatus": "drafted",
  "requirements": [],
  "demoCapabilities": [],
  "implementationNote": "本词条尚无可操作示例；插画为编辑示意。应用到产品时仍须在真实页面上验证：被删减的元素是否真的不支持任务，主要操作与导航是否仍能被用户一眼发现。",
  "image": {
    "src": "/images/minimalism.webp",
    "alt": "一个名为 FIELDNOTES 的虚构页面，大面积米白留白中只有一个小标题、一行文字条和一个细描边按钮，仅用两种颜色，示意极简视觉风格。"
  },
  "searchTerms": [
    "whitespace",
    "few colors",
    "restrained typography",
    "element reduction",
    "discoverability"
  ]
}