Ccdawn visual design
Skill CCDawn/codex-skills/skills/engineering/ccdawn-visual-design
Chinese-first Codex skill pack for intent alignment, dynamic routing, lightweight development, code review, UI design, and AI research workflows.
npx -y skills add CCDawn/codex-skills --skill ccdawn-visual-designAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 4 stars4 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Use when a UI task primarily needs a distinctive but context-appropriate visual direction, brand expression, typography, color system, composition, imagery, iconography, or motion language before implementation; do not use for information architecture, routine product UI, design-system governance, implementation of an accepted direction, or review-only findings.
The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.
SKILL.md
5.1 KB, as published. Nobody here has run it
CCDawn Visual Design
目标
把产品目的、受众和内容转成有辨识度且可实施的视觉语言。主动推断合适方向并给出推荐,不让用户先掌握设计术语;视觉强度服务任务,不以“独特”为理由牺牲可读性、性能或产品效率。
BRT interface
- Context Boundary: 产品/品牌、受众、使用场景、内容与资产、目标 surface、现有视觉基线、技术和无障碍约束。
- Output Contract: 一个推荐视觉方向及其字体、色彩、构图、图像、图标、动效和关键组件表达,必要时附少量有实质差异的备选。
- Allowed Action: 分析现有产品和资产、形成视觉契约、制作必要原型或在授权范围内调整视觉实现;不改变无关信息架构、业务行为或全局设计系统。
- Success Evidence: 视觉决策与用户任务的对应关系、关键 surface 的真实渲染、目标视口和内容压力检查,以及无障碍/性能边界。
- Stop Condition: 品牌资产或产品定位存在高影响冲突、视觉方向会改变核心布局但未对齐、所需素材不可获得,或实施越过授权范围。
- Route Out: 信息架构或交互模型成为主要未知量时转
ccdawn-ui-design;只交付视觉方案或需要独立实施 handoff 时转ccdawn-frontend-engineering;系统 token/主题治理转ccdawn-design-system;现有结果审查转ccdawn-ui-review;验证后的真实残留转ccdawn-development-cleanup;阻塞回ccdawn-brt。
统一调用契约
- 只处理 BRT interface 范围;默认输出一个有依据的推荐方向,而不是风格名称堆砌。低影响细节由 agent 自行决策。
- 用户可见内容默认中文,只说明会改变实现的视觉决策、证据和取舍;代码、命令、路径、错误原文、API/协议、skill 名和枚举保留原样;Route Out 仅以 BRT interface 为准,末行写
下一步建议: <一个具体动作>。
语境判断
- SaaS、CRM、后台、编辑器和运营工具:优先扫描、比较、密度、稳定层级和重复操作效率,辨识度来自精确而非装饰。
- 品牌、产品、作品集、活动和展示页面:品牌或对象必须成为首屏信号,可用图像、字体、构图和节奏建立记忆点。
- 游戏和创意体验:可以更具表现力,但交互反馈、可读性和性能仍是硬边界。
- 已有产品:先读取品牌资产、相邻页面、token 和组件;除非用户明确要求重塑,不引入不兼容的平行视觉语言。
用户只说“更好看、现代一点、有高级感”时,结合产品类型和现有证据直接推荐;只有方向会显著改变布局、素材、品牌感知或成本时才给少量备选。
单 owner 贯穿
用户要求视觉设计并实现时,本 owner 直接落地并完成一次浏览器验收,不再加载 UI Design 或 Frontend Engineering。普通响应式和无障碍约束作为实现边界;只有核心信息架构/交互或跨消费者契约需要重定时才切换 owner。
视觉契约
- 概念:用一句可执行原则说明视觉如何支持产品,而不是只给风格标签。
- 字体:定义 display/body/mono 的角色、层级、字重、行高和长文本行为;字体选择兼顾语言覆盖、加载和许可。
- 色彩:定义背景、surface、文本、边框、accent 和状态语义;保证对比度且不只靠颜色传达状态。
- 构图:根据内容优先级选择网格、密度、留白、对齐和节奏;避免默认 hero、均匀卡片阵列和无内容依据的装饰。
- 图像与图标:优先展示真实产品、对象、地点、人物或状态;图标来自项目已有库,核心图片必须可检查而非纯氛围填充。
- 动效:只设计能解释层级、状态变化、空间关系或品牌时刻的运动;明确 reduced-motion 和低性能降级。
- 细节:圆角、阴影、边框和背景效果形成有限体系;按语境判断,不建立脱离产品的永久禁用清单。
实施与验证
- 读取真实内容和最长/最短样本,先验证层级与构图,再精修装饰。
- 复用项目 token 和组件;新视觉语言跨多个消费者时转
ccdawn-design-system建立系统契约。 - 核心图像缺失且视觉结果依赖它时,使用本轮 Available skills 中的图像能力生成或寻找合适资产,不用临时渐变替代真实主体。
- 可运行时在浏览器检查主要视口、长文本、关键状态、资源加载、console、溢出和动效降级;截图必须能看清实际产品或内容。
- 比较结果是否实现概念原则、支持主任务并保持现有行为;没有运行证据时不声称视觉完成。
正文末行保留:下一步建议: <一个具体动作>。