Skip to content

shiwenwen666-code/visual-dictionary

Repository files navigation

Visual Dictionary · 视觉辞典

A production-grade visual content design system for deconstructing films, photographers, and artists — from concept to publish-ready frames.

一套面向「电影 / 摄影师 / 艺术家」视觉解构的内容设计系统 —— 从选题到可发布成品的全流程方法论。

Episodes Modes Templates Format License


What is this · 这是什么

视觉辞典是「审美情报局」内容频道沉淀的一套可复用视觉设计系统。它把"用设计师视角拆解一部电影 / 一位摄影师"这件事,标准化成了:一套设计规范 + 一套金句方法论 + 7 套 HTML 模板 + 2 个自动化脚本

每一期内容(封面 + 导读卡 + N 张内页 + 多平台文案)都由这套系统驱动产出 —— 像素级一致、风格可控、可批量生产。

This repository is the distilled design system behind Aesthetic Intel — covering layout specs, a color & typography system, a "tagline" copywriting methodology, reusable HTML→PNG templates, and palette-extraction tooling. 13 episodes shipped, reverse-engineered into a repeatable pipeline.

Slogan: 用设计的眼睛,看懂世界的美 · See the beauty of the world, through the eyes of design.


Design Modes · 六大制作模式

Mode 模式 描述 代表
A 单导演专题 N 部代表作 · 每部一个标志色 / 视觉关键词 侯麦 · 光的四季
B 单片拆解 一部电影 · N 个视觉密码 给阿嬷的情书
C 合集推荐 N 部电影 + 评分角标 + 统一色系 家与故乡 · 6 部慢电影
D 三色竖条封面 3 色 / 3 人 / 3 章节 · 黑白肖像 + 单色滤镜 蓝白红三部曲
E 海报美学解构 双联结构(海报页 + 解析页)· 4-pin 标注系统 戛纳 2026 海报
B-line 摄影师 / 艺术家专题 单摄影师 N 张代表作 · 极简摄影集风格 肖全「我们这一代」

Design System · 设计系统

画板        1200 × 1600 (3:4 竖版)
渲染        Chromium headless @2x device-scale → PIL LANCZOS 降采样 → 1200×1600
字体        Noto Sans SC / Noto Serif SC · Inter · Playfair Display · Bodoni Moda
色彩        品牌红 #C43820 · 品牌金 #D4A050 · 墨黑 #1A1410
            + 8 套场景化底色谱(暖米黄宣纸 / 黑底金 / 浅冷灰 / 江南水墨 …)
布局        flex column 三段式(top-bar / middle / brand-row)· 禁用 absolute 贴底
调色盘      PIL.quantize(k-means + median-cut)从剧照真实提取,5-6 色 + hex

详见 references/design-system.md · references/b-line-design-spec.md


Repository Structure · 仓库结构

visual-dictionary/
├── SKILL.md                      # 主入口 · 8 步制作流程 · 19 条强约束
├── references/
│   ├── workflow.md               # 详细制作流程
│   ├── design-system.md          # 设计规范(尺寸/字体/字号/布局/底色/模式 D·E)
│   ├── content-style.md          # 文案方法论(金句结构/英文再创作/多平台文案)
│   ├── ep-history.md             # 13 期实战速查 + 教训沉淀
│   └── b-line-design-spec.md     # B 线摄影师专题专属规范
├── templates/
│   ├── frame.html / cover.html / intro.html      # C 线模板
│   └── b-line/                                    # B 线模板
│       ├── cover.html / intro.html
│       ├── frame_vertical.html / frame_horizontal.html
│       └── README.md
└── scripts/
    ├── extract_palette.py        # 从剧照提取 5-6 色调色盘
    └── render_frame.py           # Chromium 渲染 HTML → PNG

Methodology Highlights · 方法论亮点

这套系统真正值钱的部分,是 13 期踩坑沉淀的强约束,例如:

  • 金句方法论 — 切入"视觉密码"而非剧情;意象词替代描述词("amber light"替代"warm light");拒绝空泛抒情。
  • 调色盘不凑数 — 每个色块必须能在剧照里找到对应,色相 + 明度要有跨度,避免"看起来都是棕色"。
  • 多模态读图 — 做海报解构前必须真正"看"海报内容,不能只靠色板猜构图。
  • 像素级对齐 — 用 calc() 让标注锚点永远贴合主图边缘;字体加载等待 ≥ 20s 杜绝豆腐方块字。
  • 底色不接缝background-color 兜底必须等于渐变最外色,否则边角露色带。

A design system is only as good as its constraints. See SKILL.md for the full ruleset.


Episodes Shipped · 实战索引

EP 主题 模式
01–03 张艺谋《英雄》· 韦斯·安德森 · 王家卫 A / B
04–06 侯麦 · 岩井俊二 · LaLaLand A / B
07 给阿嬷的情书 · 视觉密码 B
08 家与故乡 · 6 部慢电影 C
09 被嫌弃的松子的一生 · 7 个色场 B
10 蓝白红三部曲 · 3 种法国灵魂 A + D
11 中国学派 · 5 工艺 · 5 部老动画 C
12 戛纳 2026 · 6 张主竞赛海报视觉密码 E
B-01 肖全「我们这一代」· 12 位 90 年代文化人 B-line

完整记录见 references/ep-history.md


About · 关于

审美情报局 · Aesthetic Intel — 以设计师视角解构电影、摄影师、艺术家。 全平台同名:B 站 · 公众号 · 小红书 · 视频号 · 抖音 · YouTube · TikTok。

License

设计方法论与模板,供学习与复用参考。 Design system & templates shared for learning and reuse.

About

A production-grade visual content design system for deconstructing films, photographers and artists. 视觉辞典 · 审美情报局.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors