Design Vocabulary设计词汇 · 样本集 01

VOCABULARY / 词条

蒸汽朋克

Steampunk

加入比较 +

把十九世纪蒸汽机械的形态搬进当代画面的复古未来视觉语言:外露的齿轮、铆钉与压力表,黄铜、紫铜与皮革的材质,以及维多利亚时代的花体展示字与铜版画式细线插图。

示意图 · 编辑插画,尚无可操作示例
一张名为 FIELDNOTES 的虚构深棕色封面:外露的黄铜齿轮、铆钉与压力表环绕中央的维多利亚花体标题,四周是铜版画风格的细线装饰,下方排着暖白色占位文本条。
一张名为 FIELDNOTES 的虚构深棕色封面:外露的黄铜齿轮、铆钉与压力表环绕中央的维多利亚花体标题,四周是铜版画风格的细线装饰,下方排着暖白色占位文本条。

识别特征

  • 外露的齿轮、铆钉、管路与压力表作为装饰构件
  • 黄铜、紫铜与皮革的材质暗示,常带磨损高光
  • 维多利亚式花体展示字与铜版画风格的细线插图

概念边界

本词条只讨论它作为图形语言的一面,不概括蒸汽朋克作为科幻子类型的叙事传统、文学谱系或服饰亚文化。它的关键是"用十九世纪的人所能想象的方式表现技术"这一错位——齿轮与仪表被当作可见的解释性装置;仅仅用棕色调或复古照片不构成本风格。它与赛博朋克方向相反:赛博朋克以霓虹、暗面与数字失真想象近未来,蒸汽朋克以黄铜、机械与雕版想象另一条过去的技术路线。它也不等于"仿古":仿古复制旧物,蒸汽朋克刻意制造历史上并不存在的机器。

什么时候考虑它

  • 产品叙事本身涉及机械、工艺或"另一种技术史"的想象
  • 需要把抽象的系统运作具象为可见的机械隐喻
  • 画幅足够大,细线雕版与齿轮细节能够呈现

什么时候慎用

  • 界面需要中性、可长期演进的视觉骨架
  • 齿轮被当作纯装饰贴在与机械无关的功能旁,反而误导用途
  • 深棕与黄铜的低对比组合被直接用于正文

取舍

机械隐喻能让复杂系统显得可理解、可把玩,代价是这套材质与细线细节在小尺寸与深色低对比场景中迅速失效,而且它对内容题材的要求很高。

条件规则 · 编辑建议

当齿轮、仪表一类机械元素出现在功能旁边必须只在它们确实对应某种状态或操作时使用;纯装饰的机械件不要放在按钮或输入框附近,以免被当作可操作部件。
当雕版细线插图需要缩小到图标或列表尺寸建议准备加粗线宽、删减细节的简化版本,并在实际最小尺寸上检查是否仍能辨认。

相关词条

拟物化设计 ↗相关但不同 · 界面借用实物形态来解释功能

拟物化借用用户真实见过的物件说明用途,蒸汽朋克借用的是历史上并不存在的机器,因此解释力来自隐喻而非经验。

复古计算机风格 ↗条件替代 · 需要一种怀旧的技术视觉语言

复古计算怀念真实存在过的早期计算机界面,蒸汽朋克想象一条从未发生的机械技术路线,怀旧对象不同。

对比与可读性 ↗条件冲突 · 黄铜色文字压在深棕或皮革质感底上

金属色在屏幕上渲染为中间调,叠加纹理后正文对比度常常不足。

来源与支持范围

Wikipedia · Steampunk ↗

该条目把蒸汽朋克定义为科幻子类型,其复古未来的技术与美学主要取自十九世纪工业蒸汽机械与设计,常设定在蒸汽动力仍为主流的维多利亚时代或美国边疆的另一种历史中,并以"十九世纪的人所能设想的技术"这一错位区别于新维多利亚主义;本词条的视觉描述据此转述,界面用法属编辑判断。

检索日期:2026-09-16 · 快照待确认

定义参考以上来源;数字界面示例、选择建议、条件关系及配方由本样例编辑,尚未经用户研究验证。

类型扩展与实现说明

本词条尚无可操作示例;插画为编辑示意,展示这套材质与机械母题的组合,不代表已验证的实现。应用到产品前仍须确认机械元素不会被误认为可操作控件,并实测黄铜色元素的对比度。

{
  "tokens": {
    "surface": "#2b2119",
    "ink": "#efe2cd",
    "accent": "#b98b3e",
    "radiusPx": 4,
    "shadow": "0 4px 16px rgba(0, 0, 0, 0.35)"
  },
  "tokenScope": "本样例配方:深棕底面、暖白墨色与黄铜强调色,仅示意这套材质取向的一种取值;实际项目需按品牌语境重新取值,并对黄铜色文字单独验证对比度。"
}
完整 Agent 条目 JSON
{
  "id": "steampunk",
  "type": "visual",
  "name": {
    "zh": "蒸汽朋克",
    "en": "Steampunk"
  },
  "aliases": [
    "Steampunk Aesthetic",
    "蒸汽朋克视觉",
    "维多利亚机械风"
  ],
  "granularity": "experience",
  "intents": [
    "express-brand",
    "organize-content"
  ],
  "tags": [
    "齿轮",
    "黄铜",
    "维多利亚",
    "复古未来",
    "机械"
  ],
  "definition": "把十九世纪蒸汽机械的形态搬进当代画面的复古未来视觉语言:外露的齿轮、铆钉与压力表,黄铜、紫铜与皮革的材质,以及维多利亚时代的花体展示字与铜版画式细线插图。",
  "boundary": "本词条只讨论它作为图形语言的一面,不概括蒸汽朋克作为科幻子类型的叙事传统、文学谱系或服饰亚文化。它的关键是\"用十九世纪的人所能想象的方式表现技术\"这一错位——齿轮与仪表被当作可见的解释性装置;仅仅用棕色调或复古照片不构成本风格。它与赛博朋克方向相反:赛博朋克以霓虹、暗面与数字失真想象近未来,蒸汽朋克以黄铜、机械与雕版想象另一条过去的技术路线。它也不等于\"仿古\":仿古复制旧物,蒸汽朋克刻意制造历史上并不存在的机器。",
  "signature": [
    "外露的齿轮、铆钉、管路与压力表作为装饰构件",
    "黄铜、紫铜与皮革的材质暗示,常带磨损高光",
    "维多利亚式花体展示字与铜版画风格的细线插图"
  ],
  "when": [
    "产品叙事本身涉及机械、工艺或\"另一种技术史\"的想象",
    "需要把抽象的系统运作具象为可见的机械隐喻",
    "画幅足够大,细线雕版与齿轮细节能够呈现"
  ],
  "when_not": [
    "界面需要中性、可长期演进的视觉骨架",
    "齿轮被当作纯装饰贴在与机械无关的功能旁,反而误导用途",
    "深棕与黄铜的低对比组合被直接用于正文"
  ],
  "tradeoff": "机械隐喻能让复杂系统显得可理解、可把玩,代价是这套材质与细线细节在小尺寸与深色低对比场景中迅速失效,而且它对内容题材的要求很高。",
  "comparison": {
    "focus": "用想象中的十九世纪机械解释当代系统",
    "mechanism": "外露齿轮仪表、黄铜皮革材质与雕版细线",
    "cost": "细节在小尺寸失效,且题材适配面窄"
  },
  "sources": [
    {
      "id": "steampunk-wikipedia",
      "title": "Wikipedia · Steampunk",
      "url": "https://en.wikipedia.org/wiki/Steampunk",
      "claim": "该条目把蒸汽朋克定义为科幻子类型,其复古未来的技术与美学主要取自十九世纪工业蒸汽机械与设计,常设定在蒸汽动力仍为主流的维多利亚时代或美国边疆的另一种历史中,并以\"十九世纪的人所能设想的技术\"这一错位区别于新维多利亚主义;本词条的视觉描述据此转述,界面用法属编辑判断。",
      "checkedAt": "2026-09-16",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260916*/https://en.wikipedia.org/wiki/Steampunk",
        "status": "unconfirmed",
        "checkedAt": "2026-09-16T13:05:00.882Z",
        "error": "error:not-found",
        "jobId": "spn2-b5ba057fa57fa31e77b319a0c4dbb3929122cbf1"
      }
    }
  ],
  "relations": [
    {
      "target": "skeuomorphism",
      "kind": "related",
      "condition": "界面借用实物形态来解释功能",
      "reason": "拟物化借用用户真实见过的物件说明用途,蒸汽朋克借用的是历史上并不存在的机器,因此解释力来自隐喻而非经验。",
      "basis": "editorial"
    },
    {
      "target": "retro-computing",
      "kind": "alternative",
      "condition": "需要一种怀旧的技术视觉语言",
      "reason": "复古计算怀念真实存在过的早期计算机界面,蒸汽朋克想象一条从未发生的机械技术路线,怀旧对象不同。",
      "basis": "editorial"
    },
    {
      "target": "contrast-legibility",
      "kind": "conflicts_when",
      "condition": "黄铜色文字压在深棕或皮革质感底上",
      "reason": "金属色在屏幕上渲染为中间调,叠加纹理后正文对比度常常不足。",
      "basis": "editorial"
    }
  ],
  "rules": [
    {
      "when": "齿轮、仪表一类机械元素出现在功能旁边",
      "instruction": "只在它们确实对应某种状态或操作时使用;纯装饰的机械件不要放在按钮或输入框附近,以免被当作可操作部件。",
      "strength": "must",
      "basis": "editorial"
    },
    {
      "when": "雕版细线插图需要缩小到图标或列表尺寸",
      "instruction": "准备加粗线宽、删减细节的简化版本,并在实际最小尺寸上检查是否仍能辨认。",
      "strength": "recommend",
      "basis": "editorial"
    }
  ],
  "visual": {
    "tokens": {
      "surface": "#2b2119",
      "ink": "#efe2cd",
      "accent": "#b98b3e",
      "radiusPx": 4,
      "shadow": "0 4px 16px rgba(0, 0, 0, 0.35)"
    },
    "tokenScope": "本样例配方:深棕底面、暖白墨色与黄铜强调色,仅示意这套材质取向的一种取值;实际项目需按品牌语境重新取值,并对黄铜色文字单独验证对比度。"
  },
  "demo": null,
  "version": "0.1.0",
  "editorialStatus": "drafted",
  "requirements": [],
  "demoCapabilities": [],
  "implementationNote": "本词条尚无可操作示例;插画为编辑示意,展示这套材质与机械母题的组合,不代表已验证的实现。应用到产品前仍须确认机械元素不会被误认为可操作控件,并实测黄铜色元素的对比度。",
  "image": {
    "src": "/images/steampunk.webp",
    "alt": "一张名为 FIELDNOTES 的虚构深棕色封面:外露的黄铜齿轮、铆钉与压力表环绕中央的维多利亚花体标题,四周是铜版画风格的细线装饰,下方排着暖白色占位文本条。"
  },
  "searchTerms": [
    "gears",
    "brass",
    "Victorian",
    "retro-futurism",
    "machinery"
  ]
}