万能青年旅店视觉设计技能 (Omnipotent Youth Society Design Skill)
这是用于构建与转译万能青年旅店视觉设计语言的跨媒介通用设计技能。系统美学深度依托乐队第二张录音室专辑《冀西南林路行》(Inside the Cable Temple)的实体装帧美学(阮千瑞设计),提炼金石拓片负像律、经折装时空律、矿物纸浆色谱与严苛档案排印规制,为数字交互界面、平面海报、实物周边、出版装帧与空间展陈提供生产级设计决策指南与交付规范。
技能指令正文
当用户需要设计、生成或转译万能青年旅店风格视觉(美学偏向于《冀西南林路行》的石刻拓片、经折长卷与工业冷峻档案感,涵盖 Web 界面、平面海报、实物周边与出版物装帧)时,按以下步骤执行:
- 媒介识别与开幅定界:
- 确定交付载体(数字界面 / 平面海报 / 实物周边 / 出版装帧)。
- 确立纯二维哑光物理基础,严格禁用现代纯黑/纯白(
#000000/#FFFFFF)、高光渐变与伪 3D 浮雕投影(Bevel & Emboss)。
- 版式原型选型:
- 根据信息形态与交互形式,从四大通用构图原型中选择对应框架:
- 单画幅/封面/Hero 区域 -> 符号页原型 (The Monolith)
- 多章节/长卷/吸附分幕 -> 经折卷原型 (The Fold Sequence)
- 排期/信息表格/致谢 -> 金石拓原型 (The Stele Matrix)
- 图录/网格陈列/藏品说明 -> 档案志原型 (The Archival Index)
- 根据信息形态与交互形式,从四大通用构图原型中选择对应框架:
- 注入材料常数与排印语法:
- 强制调用
@references/DESIGN.md获取完整的矿物纸浆色谱与材料力学参数。 - 大字选用开源书法体(如
Ma Shan Zheng)并施加行气微落差(Cadence Shift)(偶数字符微下沉,破除机械字库对齐感)。 - 正文强制使用思源宋体保持高阅读可读性,西文字符与技术编码使用衬线体微型大写并大幅拉开字距,制造 8:1 至 14:1 的极致字级尺度反差。
- 强制调用
- 骨架装配与模板复用:
- 数字界面:复用
@templates/web-rubbing-view.html中的纯 CSS 矿物噪点层、拓片视口容器与墨底/纸色双模式。 - 矢量海报:复用
@templates/poster-template.svg中的 1px 金石槽格、出血与折标规范。 - 流水线自检:执行
@templates/workflow.sh执行合规筛查与构建。
- 数字界面:复用
- 信源核对与证据分层:
- 涉及古代兽形出处、历史实物装帧细节、巡演第一方海报凭据时,强制核查
@references/SOURCES.md。严格恪守证据分层,未确定出处的一律标为“古代兽形/图像”,严禁杜撰文物定论。
- 涉及古代兽形出处、历史实物装帧细节、巡演第一方海报凭据时,强制核查
- 十项铁律严格自检:
- 在产物输出前,逐一核对本文第 5 节的 10 项通用反模式检查单(无朱红印章、无黑金流光、无 Bevel 刻槽、无长文草书等)。
1. 核心审美灵魂与心智模型
万青的视觉灵魂绝不是通俗的“国潮古风”,不是喧闹的“黑金摇滚”,更不是仙侠玄幻。它的精神内核是: 太行山脉的地质崩解、工业重器的剧烈开凿、与汉魏六朝石刻在现代废墟中的沉郁共鸣。
作为设计 Agent,在构思任何载体的视觉产物前,必须在心智中确立以下三条媒介无关的物理定律(详见 @references/DESIGN.md):
- 拓片负像律(Negative Rubbing Mechanics):
- 黑色不是背景,而是被松烟墨渗透的厚重石板原体;浅色线条不是“绘制的线条”,而是石面被刀斧凿出的凹陷、未着墨处的岩石露白。
- 拓片是从石碑揭下的平整宣纸,字迹与图腾纯平。无论在屏幕上还是印刷品上,绝不使用发光或假 3D 浮雕凹凸阴影(text-shadow 荧光、刻槽下陷阴影、Bevel & Emboss)。所有质感必须呈现为吸光、干涩、沉稳的纯二维矿物哑光(2D Mineral Matte)。
- 经折装时空律(Accordion Register):
- 构图应摒弃无限平铺的卡片瀑布流,转为如风琴折页(Sutra Binding)般的“定帧感”与“行旅步进节奏”。
- 极繁与极简的剧烈振荡:繁密风化的微观图腾,必须被广阔沉默的留白(留白率不低于 50%)包裹。信息密度在 0% 与 90% 之间剧烈震荡,严禁均质化填满。
- 冷峻档案感(Archival Severance):
- 远古兽形残片必须与严苛的现代出版信息(两位数编号、地理坐标、微型衬线英文、精确出处参数)毫无过渡地并置在同一视界面中。字迹古拙,排版秩序必须近乎考古档案。
2. 生产级材料与色彩常数 (Material & Color Tokens)
本系统的色彩建立在物理材料(松烟墨、棉纸、矿粉、氧化铁)的基础上。在数字与实体介质中映射如下(详见 @references/DESIGN.md):
css:root { /* 基础墨石层 (Basalt & Ink) */ --ink-void: #0e100c; /* 极深墨核:拓片裁切区、深度雕刻背景 */ --ink-primary: #171913; /* 矿物深墨:默认墨底,带极微弱太行山冷杉暗绿 */ --ink-subtle: #24261e; /* 浅印墨:深色底的微层级分块 */ /* 纤维纸料层 (Pulp & Mineral) */ --paper-base: #d3cbb4; /* 楮皮生纸:默认纸色、墨底主要文字色 */ --paper-bright: #e4ddcb; /* 矿物白垩:高对比主文字、强视觉焦点 */ --paper-section: #dfd8c4; /* 裱纸中层:纸色模式/浅色承载面板底色 */ /* 风化与刻痕 (Weathering & Incision) */ --dust-stone: #a8a18b; /* 石尘灰:次级说明文字、微型档案参数 */ --earth-slate: #847b62; /* 山脊泥土:图注与边缘蚀刻感 */ --line-carve: #4c4c3e; /* 刀凿暗线:深色模式分栏线(石刻阴线) */ --line-paper: #a49e8a; /* 折页阴影:浅色模式分栏线(纸张折痕) */ /* 伴生印记层 (极度克制,全屏/全幅占比严格 < 2%) */ --iron-rust: #9c5847; /* 氧化铁赭石:用于关键状态标记与物理装订线,非鲜艳朱印 */ }
实体印刷与物理工艺对照:
- 矿物深墨 (
--ink-primary/--ink-void):特种炭黑加微量草绿调墨 / Pantone Black 7C / 哑光无光油墨 / 重磅水洗炭黑棉布。 - 楮皮生纸 (
--paper-base):未漂白特种宣纸、粗砺手工棉纸原色 / Pantone 7527C / 织物米灰浆料拔印。 - 矿物白垩 (
--paper-bright):矿物粉垩白,严禁荧光增白纯白(#FFFFFF)。 - 伴生印记 (
--iron-rust):氧化铁红 Pantone 7600C / 暗哑火漆。
3. 跨媒介排印语法与尺度律
| 层级 | 字体族谱 | 典型尺寸模式 | 字距 (Tracking) | 跨媒介排印公理 |
|---|---|---|---|---|
| 展示大字 | 开源 Ma Shan Zheng / 六朝魏碑 / 图像石 | clamp(56px, 13vw, 166px) 或超大字号 | 0.02em ~ 0.05em | 行气微落差(Cadence Shift):偶数字符纵向微下沉(Web 中 translateY(6px),矢量/平面中对应 3%~5% em 错落),打破机械字库对齐,还原摩崖石壁依势书写呼吸;纯二维哑光,严禁假 3D 浮雕或文字刻槽 text-shadow。 |
| 正文长文 | 思源宋体 / "Noto Serif SC", serif | 14px – 16px 或 9 – 10.5pt | 0.04em ~ 0.06em | 行高 1.85 ~ 2.0。绝对禁止全篇书法毛笔化,保持宋体端严工整的现代出版可读性。 |
| 西文题铭 | Georgia / Garamond / Times, serif | clamp(10px, 1.6vw, 20px) 或 7 – 9pt | 0.20em ~ 0.25em | 全大写(UPPERCASE),字号小,字距大幅拉开,传达唱片出版与考古档案冷感。 |
| 技术档案标 | Georgia + 等宽数字 | 10px – 12px 或 6 – 8pt | 0.12em | 两位数前导(如 01 /、02 /),严禁口语化序号。 |
跨媒介尺度律(Scale Juxtaposition): 展示大字与微型档案字之间必须拉大至 8:1 到 14:1 的极致尺度反差(如巨幅标题 vs 微细图注),无论在屏幕视口还是大幅海报上均形成强烈的视觉压迫与精密档案对比。
4. 四大通用构图原型 (Medium-Agnostic Archetypes)
构图逻辑不绑定任何特定软件或代码语言,在不同载体中映射如下:
4.1 符号页原型 (The Monolith)
- 核心法则:单一具有纪念碑感的图腾,居于画幅核心,上下留出不低于自身高度 50%~60% 的纯净空底,四角点缀微细直角定位折标(Corner Marks)。
- 跨载体表现:
- 数字界面:专题首页 Hero、单页封面(参考
@templates/web-rubbing-view.html)。 - 平面海报:A1/A2 展览或巡演主视觉海报的主体画幅(参考
@templates/poster-template.svg)。 - 实物周边:重磅 T 恤胸前/后背的纯二维单色拓片印花、帆布袋正反面。
- 出版装帧:1:1 黑胶外封套、书籍精装封面板。
- 数字界面:专题首页 Hero、单页封面(参考
4.2 经折卷原型 (The Fold Sequence)
- 核心法则:以折页时空律组织多章节叙事,具备风琴折页的定帧展开感与节律步进;信息密度呈现极繁与极简的剧烈振荡。
- 跨载体表现:
- 数字界面:分幕吸附视口、横向经折卷轴视口(辅以折痕刻度或进度提示)。
- 出版装帧:双面风琴折拉页唱片歌词本、长卷画册、多折折页手册(带规范压痕线与折位)。
- 空间展陈:长廊型时间轴展览背板。
4.3 金石拓原型 (The Stele Matrix)
- 核心法则:借鉴巡演海报布局,以细墨线(
1px solid或0.25pt)划定坚固的非对称石刻槽格,槽内信息高密度且极规整,大字纵排与小字横排形成金石构架。 - 跨载体表现:
- 平面海报:巡演城市排期矩阵、学术论坛日程公布表。
- 出版装帧:唱片 Tracklist 封底、书籍版权与出版技术参数页。
- 票务证卡:巡演门票副券、VIP 通行挂牌信息栏。
4.4 档案志原型 (The Archival Index)
- 核心法则:展签式基座(Matting Frame),每件展品或图录嵌于低对比微墨衬底中,边界以微弱细线界定,配套冷静的文献出处、物理尺度与测绘参数。
- 跨载体表现:
- 数字界面:藏品图录陈列网格与配套检视机制。
- 空间展陈:博物馆冷轧钢板/石材展签(Placards)、展柜说明牌。
- 出版物:文物考据图版、独立刊物附录。
5. 铁律:必须坚决杜绝的十项通用反模式
无论设计何种载体,任何以下特征均属于严重审美降级,必须在输出前依据检查单完全清除:
- ❌ 艳俗朱红印章:严禁在角落放置歪斜、圆角、低质的仿古朱红小印章。这属于廉价文创套路,彻底摧毁冷峻沉毅气场。
- ❌ 黑金流光与金属渐变:严禁高光金属黄(#FFD700)、金粉闪烁或彩虹渐变。金是风化矿土。
- ❌ 假 3D 浮雕、楞边高光与悬浮阴影:拓片是平平整整的二维宣纸,字迹与装裱皆为平整墨色。严禁在文字或容器边框上使用阴影模拟立体石雕下陷、刻槽或斜角浮雕(Bevel & Emboss);严禁使用容器边缘白色内高光线(如
inset 0 1px 0);严禁现代 SaaS 风格的大圆角(border-radius > 2px)与弥散悬浮外阴影。 - ❌ 发光与透明度过曝:拓片图像严禁粗暴调高亮度(
brightness(1.8))或直接screen导致黑色背景发灰。墨色必须沉底。 - ❌ 全屏噪点污染:纸质肌理必须微弱细腻(透明度 ≤ 0.045),微弱注入矿物吸光感即可,不得阻碍阅读。
- ❌ 长文毛笔草书:阅读区必须保持宋体,书法只允许出现在极少数大字标题中。
- ❌ 轻浮动效与非真实拟物:界面转场时间控制在 180~300ms,严禁弹性回弹(bounce);非真实音频页面禁止安装假声波或假播放滑块。
- ❌ 具象现代波普与流行拼贴:严禁使用高饱和度波普亮色(如亮黄大色块)、现代工厂工业剪贴、街头涂鸦或流行卡通插画。视觉必须扎根于太行山川的矿物沉郁、地质残损与金石汉魏碑刻。
- ❌ 虚构文物考据:对未确定出处的古代图像,一律标记为“古代兽形/图像”,严禁杜撰朝代(严格参考
@references/SOURCES.md)。 - ❌ 实物低质工艺(针对实体周边与印刷物):
- 服饰周边严禁使用会反光的厚重塑料热转印胶贴,必须使用渗透纤维的水性丝网印花或拔印;
- 纸张周边严禁使用亮面铜版纸或亮金烫印,必须使用无光特种棉纸配合无光盲压凹(Blind Deboss)。
6. 跨媒介自适应工作流与交付规范 (Adaptive Workflow & Deliverables)
当接收到设计任务时,按以下通用步骤推进:
text[任务输入] ──► 1. 媒介识别与开幅定界 ──► 2. 版式原型选型 ──► 3. 材料常数注入 ──► 4. 排印尺度与行气构建 ──► 5. 跨媒介交付物输出 ──► 6. 禁令自检
交付物形态对应标准:
- A. 若为数字界面 (Web UI):
- 输出自包含单文件 HTML/CSS。
- 主容器注入 SVG fractalNoise 矿物吸光噪点层(
opacity: 0.038)。 - 支持墨色默认底与纸色托裱模式切换(纸色模式拓片采用
inset 0 0 35px内嵌托裱,严禁浮空阴影),模板见@templates/web-rubbing-view.html。
- B. 若为平面海报 (Poster):
- 输出高精度、可无限放大的纯矢量 SVG 或排版代码,模板见
@templates/poster-template.svg。 - 严格设立出血线、裁剪规矩线与版心边距,大字标题保持偶字微移,槽格线宽标定为 0.25pt~0.5pt。
- 输出高精度、可无限放大的纯矢量 SVG 或排版代码,模板见
- C. 若为实物周边 (Merchandise / Apparel):
- 输出 1-Bit 纯黑白或双专色分色矢量 SVG(去半透明、去渐变、去羽化)。
- 附带物理生产工艺指导书(如:织物克重、拔印浆料、Pantone 对应色、版面开幅 mm)。
- D. 若为唱片/出版装帧 (Packaging & Editorial):
- 输出展开面矢量图(含压痕折线、切线、书脊安全边距)。
- 标定无光盲压凹(Blind Deboss)与手工纸用料建议。


