跳转到使用指南
Critique Composition作者 owl-listener

Critique Composition Skill.

解释实际渲染的布局为何显得失衡或缺乏关联。

  • 构图
  • 层级
源文件解读 · critique-compositionSKILL.md
任务 解释实际渲染的布局为何显得失衡或缺乏关联。 产出 按四个明确维度组织的构图检查报告。 开始前的准备 该 skill 点评实际渲染的构图,不会仅凭需求说明编造发现。
编辑摘要 · 源文件核查于 2026-11-02 · 非生成示例

01 功能说明

解释实际渲染的布局为何显得失衡或缺乏关联

检查实际渲染画面的平衡、留白、节奏和感知分组,用具体观察说明问题,并提出可执行的布局修正。

基于来源的工作流并非执行基准测试

工作方法

Critique Composition 检查实际渲染画面的空间特征,通过视觉重量、留白、重复间隔和感知分组,解释布局为何不稳定或缺乏关联。当基本层级已经清楚,但整体排列仍显得别扭时,这份源文件尤其有用。

报告按平衡、留白、节奏和格式塔四个维度分别列出观察、问题与修正。这样就能把“页面感觉不对”转化为具体讨论:某个区块过于拥挤、某个控件孤立,或重复模式的间距无缘无故发生变化。

预期交付物

  • 按四个明确维度组织的构图检查报告。
  • 与具体空间问题对应的中立观察。
  • 每个维度的可执行修正建议和严重程度评级。
查看示例简报

从简报到审查

  1. 01
    观察整体构图

    查看实际渲染画面,识别视觉重量的分布。考虑对称或不对称是否出于有意设计,以及构图的视觉重心在哪里。

  2. 02
    检查间距与节奏

    比较区块之间的大间隔和组内的小间隔。寻找不一致的内边距、逐渐偏移的重复排列,以及密集区域和空白区域之间的突兀转换。

  3. 03
    检查感知分组

    检查邻近、相似、图形与背景的分离、连续性和闭合。找出看似脱离相关内容,或与无关控件错误成组的元素。

  4. 04
    写出有针对性的修正

    针对平衡、留白、节奏和格式塔,分别提供观察、问题和具体修正。为各维度评级,不把聚焦的点评变成缺乏解释的全面重设计。

02 适用场景

适合什么场景

该 skill 点评实际渲染的构图,不会仅凭需求说明编造发现。

适合的场景

  • 布局显得不稳定内容已经齐全,但视觉重量、间隔或分组使构图难以阅读。
  • 聚焦的优化轮次团队希望修正空间关系,同时保留已认可的设计方向。

需要检查的限制

  • 需要实际画面该 skill 点评实际渲染的构图,不会仅凭需求说明编造发现。
  • 关注范围明确源文件将重点突出和视线流动分析交给独立的视觉层级点评。
  • 建议仍需验证实施间距修正后,仍需检查实际效果。

请提供这些输入

  • 渲染后的视图提供画面,以及相关视口或内容状态。
  • 设计背景说明预期的平衡、分组和既定视觉方向。
  • 间距系统如果修正应遵循已有规范,提供已知的网格和间距值。

03 关键决策

影响结果的关键选择

  1. 具体的空间表述

    反馈明确指出哪种元素关系让布局显得不对。

  2. 分开评估各个维度

    留白和节奏可以独立于视觉重量进行评估。

  3. 可执行的点评

    每个问题都对应一项建议修改。

04 示例任务

从一份具体的需求开始

以下示例任务说明尚未经过测试。使用前请检查该技能的设置。

查看源文件和环境要求

提供画面,以及相关视口或内容状态。

上游源文件
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/visual-critique/skills/critique-composition/SKILL.md

下方链接会打开上游使用说明。使用前请查看仓库的环境配置要求;这不是安装命令。

先完成一项明确的交付物

运行该技能之前,请根据需要调整此需求中的范围、来源材料和约束。

示例简报
使用 critique-composition 检查实际渲染的项目总览。保留当前内容和视觉方向,聚焦平衡、留白、节奏和感知分组。指出哪些具体区域过于拥挤、缺乏关联,或视觉重量超出预期。将重复卡片和区块的间距与我们现有的间距尺度比较。对每个维度给出中立观察,说明影响,并提出具体调整。评级为通过、轻微问题或严重问题。检查期间不要重设计页面,并标明哪些判断依赖尚未看到的视口。

检查结果

根据以下可观察标准检查实际输出。

  • 观察描述具体且可见的空间关系。
  • 修正建议针对已识别的维度,而非无关样式。
  • 未查看的视口和尚未实施的建议都有明确标识。

OpenDesign 为编码智能体提供本地设计工作区。此条目并不表示该技能已内置,也不表示其中包含其外部工具、凭据和软件依赖项。

05 来源与许可证

来源与许可证

本页面描述的是下方链接所指向的固定来源修订版本。上游行为和要求可能会发生变化。

来源所有者
owl-listener
技能文件
SKILL.md
许可证
MIT
已审查的快照
2026-11-02 · 9a6930cf84a8
编辑来源摘要
解释实际渲染的布局为何显得失衡或缺乏关联。

由 OpenDesign 根据所链接来源撰写的原创摘要。仓库星标数只是带有时间属性的受欢迎程度指标,并不代表技能使用量或质量评分。

06 开始前的问题

开始前可能想问

它能替代层级检查吗?

它聚焦构图。源文件将重点突出和视线流动视为独立的点评方向。

什么属于视觉节奏?

检查会关注重复的间距、尺寸、行、卡片和区块分隔,看它们能否形成连贯的视觉节奏。

报告应采用什么格式?

四个维度分别包含观察、问题、修正,以及通过/轻微问题/严重问题评级。

OpenDesign

让需求和设计工作保存在一起。

将简报、来源材料和设计工作集中保存在本地工作区中。将该技能添加到工作流程前,请检查其自身的设置说明。

上游源文件
https://github.com/owl-listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/visual-critique/skills/critique-composition/SKILL.md