Design Principles【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontageTypography and the grid are the only design elements needed. Mathematical relationships create visual harmony. Restraint is the ultimate sophistication. The grid is not a limitation — it is liberation through structure.四句箴言概括风格哲学排印 网格即全部设计元素数学关系创造视觉和谐克制是高级的终极形态网格不是限制而是通过结构获得解放。按照 spec.md 的约定## Design Principles 是可选自由体正文段用于沉淀风格的设计观也是后续自动生成设计简报design brief时的基调来源。 --- ## 八、Connectors四个落地通道的完整翻译方案 文档正文的 ## Connectors 章节给出四条落地通道的速览以下结合 [.agents/skills/visual-style/references/connectors/](https://link.gitcode.com/i/78dab18a55299aefd43345c343428f4f) 下的四个连接器文件逐一展开。 ### 8.1 HeyGen Video AgentAI 视频生成 映射规则源自 [heygen-video-agent.md](https://link.gitcode.com/i/576a50f47c80866baccf5a9c5bd1a251) | visual-style.md 字段 | HeyGen 用法 | |----------------------|-------------| | style_prompt_full | 逐字追加进生成提示词 | | motion.transitions | 场景转场指令 | | motion.animation_style | 动画行为 | | motion.pacing | 节奏引导 | | typography.caption | 字幕样式如开启字幕 | | layout.aspect_ratio | 方向设置16:9 横屏9:16 竖屏 | | mood.avoid | 负向提示 / 排除指令 | | assets.gsep_elements | 叠加资产如支持 | | x_heygen.orientation | 显式方向覆盖 | | x_heygen.video_id | 引用已有 HeyGen 视频 | **完整提示词模板**Create a video about [TOPIC].Script: [USERS SCRIPT]Visual style: [PASTE style_prompt_full HERE]Additional constraints:[ITEMS FROM mood.avoid]Motion:Transitions: [motion.transitions]Pacing: [motion.pacing]Animation: [motion.animation_style]Format: [layout.aspect_ratio OR x_heygen.orientation]**瑞士风格数据片示例**无 Avatar 纯动态图形模式Create a video about our Q4 results.Script: Revenue grew 40% year over year. We shipped 12 new features. Customer satisfaction hit an all-time high of 94%.Visual style: Josef Müller-Brockmann Swiss International Style. Grid-locked layouts with mathematical precision. Black and white base with ONE accent color (electric blue #0066FF). Strong diagonal compositions. Helvetica typography only. Data visualizations are the hero — animated charts, counters, grids. Every frame snaps to a grid. Transitions are horizontal grid wipes. No organic shapes. No gradients. No stock photography. Everything is geometric, systematic, precise.Additional constraints:No avatarNo b-roll footageNo stock photographyPure motion graphics onlyMotion:Transitions: horizontal grid wipes, clean hard cutsPacing: Measured, confident, unhurriedAnimation: Elements snap to grid positions, charts animate systematicallyFormat: landscape (16:9)连接器文档特别提示三条实战技巧对不想要的东西要**显式声明**HeyGen 对负向约束响应良好抽象风格务必加 No avatar. No b-roll. Pure motion graphics.数字密集型内容要主动点出 animated charts, counters, data viz。 ### 8.2 HTML SlidesWeb 演示 映射规则源自 [html-slides.md](https://link.gitcode.com/i/70795836439070e5e54eb5047cc3b989)颜色映射为 --color-bg / --color-text / --color-accent / --color-muted 四个 CSS 变量排印映射为 --font-display / --font-body正文要求单 HTML 文件、零依赖、clamp() 响应式尺寸、每页 height: 100vh; overflow: hidden 不滚动。 **瑞士风格 CSS 变量** css :root { --color-bg: #000000; /* colors.primary[0].hex */ --color-text: #FFFFFF; /* colors.primary[1].hex */ --color-accent: #0066FF; /* colors.accent[0].hex */ --color-muted: #CCCCCC; /* colors.neutral[0].hex */ --font-display: Helvetica Neue, Helvetica, Arial, sans-serif; --font-body: Helvetica Neue, Helvetica, Arial, sans-serif; }12 栏网格叠加层Swiss 风格专属视觉元素.slide::before { content: ; position: absolute; inset: 0; background: repeating-linear-gradient( 90deg, transparent, transparent calc(100% / 12 - 1px), var(--color-muted) calc(100% / 12 - 1px), var(--color-muted) calc(100% / 12) ); opacity: 0.1; pointer-events: none; }标题排版遵循typography.displayHelvetica Bold、大写、tight tracking、text-align: lefth1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(3rem, 8vw, 8rem); text-transform: uppercase; letter-spacing: -0.02em; line-height: 0.9; text-align: left; }8.3 paper.designUI 设计文档映射规则源自 paper-design.md颜色直接落入文档色板背景#000000、文字#FFFFFF、强调#0066FF、网格线#CCCCCC排印加载 Helvetica 三档字重版式按layout.grid建 12 栏网格并开启吸附。使用 AI 布局功能时将style_prompt_full粘贴进提示词并附上mood.avoid作为 Constraints。可直接套用的设计简报模板## Design Brief **Style:** Josef Müller-Brockmann Swiss International Style **Color Palette:** - Pure Black: #000000 — dominant ground, text, structural elements - Pure White: #FFFFFF — background fields, negative space - Electric Blue: #0066FF — the ONE accent, data highlights **Typography:** - Display: Helvetica Bold - Body: Helvetica Regular **Layout:** Strict modular grid — 12 columns, Flush left, grid-snapped **Mood:** precise, systematic, authoritative, geometric **Avoid:** organic shapes, gradients, stock photography, centered text, decorative elements, drop shadows, rounded corners8.4 Figma设计工具样式库映射规则源自 figma.md将颜色生成为分层级的 Color Styles将排印生成为 Text Styles将网格生成为 Layout Grid 预设。颜色样式Folder: brand/ - brand/black → #000000 (Pure Black) - brand/white → #FFFFFF (Pure White) Folder: accent/ - accent/electric-blue → #0066FF (Electric Blue) Folder: neutral/ - neutral/grid-gray → #CCCCCC (Grid Gray) - neutral/dark-gray → #333333 (Dark Gray)文本样式Folder: heading/ - heading/display → Helvetica Bold, 48px Folder: body/ - body/default → Helvetica Regular, 16px Folder: label/ - label/default → Helvetica Light, 12px网格预设12 columns→ Columns: 12、Type: Stretch、Margin: 64px、Gutter: 24pxStrict modular grid→ 行列同时启用。命名时用role字段作为样式描述。连接器文档还提供了VisualStyle/Color/TypographyStyle的 TypeScript 接口定义供需要编写 Figma 插件解析visual-style.md的开发者直接参考。九、扩展字段x_*命名空间与资产占位x_heygen: video_id: orientation: landscape assets: reference_images: [] gsep_elements: [] html_snippets: [] color_palette_image: url: 【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontage创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Design Principles
Design Principles【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontageTypography and the grid are the only design elements needed. Mathematical relationships create visual harmony. Restraint is the ultimate sophistication. The grid is not a limitation — it is liberation through structure.四句箴言概括风格哲学排印 网格即全部设计元素数学关系创造视觉和谐克制是高级的终极形态网格不是限制而是通过结构获得解放。按照 spec.md 的约定## Design Principles 是可选自由体正文段用于沉淀风格的设计观也是后续自动生成设计简报design brief时的基调来源。 --- ## 八、Connectors四个落地通道的完整翻译方案 文档正文的 ## Connectors 章节给出四条落地通道的速览以下结合 [.agents/skills/visual-style/references/connectors/](https://link.gitcode.com/i/78dab18a55299aefd43345c343428f4f) 下的四个连接器文件逐一展开。 ### 8.1 HeyGen Video AgentAI 视频生成 映射规则源自 [heygen-video-agent.md](https://link.gitcode.com/i/576a50f47c80866baccf5a9c5bd1a251) | visual-style.md 字段 | HeyGen 用法 | |----------------------|-------------| | style_prompt_full | 逐字追加进生成提示词 | | motion.transitions | 场景转场指令 | | motion.animation_style | 动画行为 | | motion.pacing | 节奏引导 | | typography.caption | 字幕样式如开启字幕 | | layout.aspect_ratio | 方向设置16:9 横屏9:16 竖屏 | | mood.avoid | 负向提示 / 排除指令 | | assets.gsep_elements | 叠加资产如支持 | | x_heygen.orientation | 显式方向覆盖 | | x_heygen.video_id | 引用已有 HeyGen 视频 | **完整提示词模板**Create a video about [TOPIC].Script: [USERS SCRIPT]Visual style: [PASTE style_prompt_full HERE]Additional constraints:[ITEMS FROM mood.avoid]Motion:Transitions: [motion.transitions]Pacing: [motion.pacing]Animation: [motion.animation_style]Format: [layout.aspect_ratio OR x_heygen.orientation]**瑞士风格数据片示例**无 Avatar 纯动态图形模式Create a video about our Q4 results.Script: Revenue grew 40% year over year. We shipped 12 new features. Customer satisfaction hit an all-time high of 94%.Visual style: Josef Müller-Brockmann Swiss International Style. Grid-locked layouts with mathematical precision. Black and white base with ONE accent color (electric blue #0066FF). Strong diagonal compositions. Helvetica typography only. Data visualizations are the hero — animated charts, counters, grids. Every frame snaps to a grid. Transitions are horizontal grid wipes. No organic shapes. No gradients. No stock photography. Everything is geometric, systematic, precise.Additional constraints:No avatarNo b-roll footageNo stock photographyPure motion graphics onlyMotion:Transitions: horizontal grid wipes, clean hard cutsPacing: Measured, confident, unhurriedAnimation: Elements snap to grid positions, charts animate systematicallyFormat: landscape (16:9)连接器文档特别提示三条实战技巧对不想要的东西要**显式声明**HeyGen 对负向约束响应良好抽象风格务必加 No avatar. No b-roll. Pure motion graphics.数字密集型内容要主动点出 animated charts, counters, data viz。 ### 8.2 HTML SlidesWeb 演示 映射规则源自 [html-slides.md](https://link.gitcode.com/i/70795836439070e5e54eb5047cc3b989)颜色映射为 --color-bg / --color-text / --color-accent / --color-muted 四个 CSS 变量排印映射为 --font-display / --font-body正文要求单 HTML 文件、零依赖、clamp() 响应式尺寸、每页 height: 100vh; overflow: hidden 不滚动。 **瑞士风格 CSS 变量** css :root { --color-bg: #000000; /* colors.primary[0].hex */ --color-text: #FFFFFF; /* colors.primary[1].hex */ --color-accent: #0066FF; /* colors.accent[0].hex */ --color-muted: #CCCCCC; /* colors.neutral[0].hex */ --font-display: Helvetica Neue, Helvetica, Arial, sans-serif; --font-body: Helvetica Neue, Helvetica, Arial, sans-serif; }12 栏网格叠加层Swiss 风格专属视觉元素.slide::before { content: ; position: absolute; inset: 0; background: repeating-linear-gradient( 90deg, transparent, transparent calc(100% / 12 - 1px), var(--color-muted) calc(100% / 12 - 1px), var(--color-muted) calc(100% / 12) ); opacity: 0.1; pointer-events: none; }标题排版遵循typography.displayHelvetica Bold、大写、tight tracking、text-align: lefth1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(3rem, 8vw, 8rem); text-transform: uppercase; letter-spacing: -0.02em; line-height: 0.9; text-align: left; }8.3 paper.designUI 设计文档映射规则源自 paper-design.md颜色直接落入文档色板背景#000000、文字#FFFFFF、强调#0066FF、网格线#CCCCCC排印加载 Helvetica 三档字重版式按layout.grid建 12 栏网格并开启吸附。使用 AI 布局功能时将style_prompt_full粘贴进提示词并附上mood.avoid作为 Constraints。可直接套用的设计简报模板## Design Brief **Style:** Josef Müller-Brockmann Swiss International Style **Color Palette:** - Pure Black: #000000 — dominant ground, text, structural elements - Pure White: #FFFFFF — background fields, negative space - Electric Blue: #0066FF — the ONE accent, data highlights **Typography:** - Display: Helvetica Bold - Body: Helvetica Regular **Layout:** Strict modular grid — 12 columns, Flush left, grid-snapped **Mood:** precise, systematic, authoritative, geometric **Avoid:** organic shapes, gradients, stock photography, centered text, decorative elements, drop shadows, rounded corners8.4 Figma设计工具样式库映射规则源自 figma.md将颜色生成为分层级的 Color Styles将排印生成为 Text Styles将网格生成为 Layout Grid 预设。颜色样式Folder: brand/ - brand/black → #000000 (Pure Black) - brand/white → #FFFFFF (Pure White) Folder: accent/ - accent/electric-blue → #0066FF (Electric Blue) Folder: neutral/ - neutral/grid-gray → #CCCCCC (Grid Gray) - neutral/dark-gray → #333333 (Dark Gray)文本样式Folder: heading/ - heading/display → Helvetica Bold, 48px Folder: body/ - body/default → Helvetica Regular, 16px Folder: label/ - label/default → Helvetica Light, 12px网格预设12 columns→ Columns: 12、Type: Stretch、Margin: 64px、Gutter: 24pxStrict modular grid→ 行列同时启用。命名时用role字段作为样式描述。连接器文档还提供了VisualStyle/Color/TypographyStyle的 TypeScript 接口定义供需要编写 Figma 插件解析visual-style.md的开发者直接参考。九、扩展字段x_*命名空间与资产占位x_heygen: video_id: orientation: landscape assets: reference_images: [] gsep_elements: [] html_snippets: [] color_palette_image: url: 【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontage创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考