Croprix品牌手册v1.1.0

第 11 章 · Chapter 11

治理Governance

版本、改动流程、外发打包与目录结构。改动先改 decisions.md,再改 tokens,下游自动更新。

11.1版本Versioning

当前

1.1.0 · 2026-09-22

记录在哪

brand/CHANGELOG.md(语义化版本)与 tokens/tokens.json$extensions.cx.version。手册封面与页眉显示同一版本号。

语义化

语义化版本 major.minor.patch;手册、tokens、assets 三者版本号始终一致。

11.2改动流程Change process

上游是 decisions.md,任何子目录与它冲突时以它为准。顺序不可颠倒:

  1. brand/decisions.md
  2. brand/tokens/tokens.json
  3. node brand/tokens/build.mjs → 生成 dist/(含对比度报告,不达标即报错)。
  4. brand/assets/build.sh → 重新导出 PNG/ICO 与模板预览。
  5. 手册引用 dist/tokens.cssassets/,自动更新;只有规则文字变化时才手改手册页面。
  6. 更新 CHANGELOG.md 与版本号。
node brand/tokens/build.mjs
bash brand/assets/build.sh

11.3外发打包Distribution

外发包(唯一口径,依据 decisions §9)

  • assets/(含字体 TTF 供设计师安装;排除 logo/croprix-logo-misuse-*
  • manual/(本手册)
  • press/(媒体包)
  • tokens/dist/(手册与 localisation/ 引用 tokens.css,缺失则样式退化)
  • localisation/
  • 只需要一页时给 Quick reference

不外发

  • decisions.md(内部决策记录)。
  • tokens/tokens.json 与全部构建脚本(build.mjsbuild.sh)。
  • 禁用示例 croprix-logo-misuse-*.svg 不作为资产分发。
cd brand && zip -r ../croprix-brand-kit-1.1.0.zip assets manual press tokens/dist localisation -x "assets/logo/croprix-logo-misuse-*"

11.4目录结构Directory contract

brand/
  decisions.md            上游决策(本手册的全部内容来源)
  README.md               入口:怎么用、怎么改、版本
  CHANGELOG.md
  tokens/
    tokens.json           W3C DTCG 格式的 token 源(唯一事实来源)
    build.mjs             Node 24,零依赖;从 tokens.json 生成 dist/
    dist/tokens.css       :root 变量(亮色)+ [data-theme="dark"] / prefers-color-scheme 暗色
    dist/tokens.scss      $cx-* 变量与 map
    dist/tailwind.css     Tailwind v4 @theme 块
    dist/tokens.figma.json Tokens Studio 可导入格式
    dist/Tokens.swift     iOS
    dist/tokens.xml       Android colors/dimens
    dist/contrast-report.md  WCAG 对比度自动核验结果
  assets/
    manifest.json         每个文件:路径、格式、尺寸、用途、许可
    logo/                 标志变体(见 02)
    icons/                24px 网格 SVG + sprite.svg
    patterns/             辅助图形
    fonts/                Montserrat(OFL)+ 各文字系统字体获取说明
    social/               头像、封面、OG 图
    templates/            名片、信纸、邮件签名、社媒版式、幻灯片母版
    build.sh              用 rsvg-convert 重新导出全部 PNG/ICO
    imagery/              影像规范、调色预设与脚本、示范图、拍摄清单
    office/               PPTX / DOCX 模板与样式表
    product/              CMF 规范、机身标识、铭牌与标签、包装、工装、车辆、展位、门头
    ui/                   UI 组件 CSS 与预览
    dataviz/              数据可视化规范、色板、示例
    motion/               标志动效:动画 SVG、MP4、透明 WebM、GIF、Lottie
  press/                  媒体包:标志下载、公司简介、合作伙伴标志使用条款
  manual/                 本手册,直接打开 index.html
  localisation/           多语言/多地区规则、字体栈、locale 登记表、示例

11.5与官网 tokens 的对应Website token mapping

官网 src/styles/tokens.css 现有变量(--paper--ink--leaf--navy 等)与本系统 --cx-* 的对应关系列在 tokens/README.md。后续迁移由官网侧完成,本版本不改官网。

命名契约示例
CSS 变量--cx-<组>-<名>[-<阶>]
色阶--cx-color-navy-900 · --cx-color-leaf-600 · --cx-color-sand-50
语义色--cx-color-bg · --cx-color-fg · --cx-color-brand · --cx-color-accent · --cx-color-border
字体--cx-font-family-sans · --cx-font-size-md · --cx-font-weight-semibold · --cx-line-height-md
版式--cx-space-4 · --cx-radius-md · --cx-shadow-md · --cx-container-lg · --cx-z-modal
动效--cx-motion-duration-base · --cx-motion-ease-standard