Ui Final Polish — UI 最终润色
v0.1.0Final visual polish for an existing UI without rede签名ing it. Use after structure is clear, when asked to improve spacing, alignment, text hierarchy, readability, shadows, highlights, effects, action placement, or overall production feel. For screen structure, layer naming, code handoff, preview scenes, or animation planning, use pencil-ui-structure first.
运行时依赖
版本
优先考虑层次和间距的修复,然后再引入新的视觉元素
安装命令
点击复制技能文档
UI Final Polish
应用ly a restrAIned final polish pass to an existing UI 组件 or screen.
Use this 技能 when the job is to make something feel 清理er, sharper, and more production-ready while preserving the current de签名. This 技能 is not a rede签名 技能.
If the user is asking how to structure, name, organize, package, or hand off a de签名 for code, use pencil-ui-structure first and only use this 技能 afterward for visual polish.
Short usage name:
ui-final-polish Goals Preserve the existing composition, visual direction, 组件 角色, and de签名 intent Strengthen text hierarchy Improve spacing rhythm and readability Fix weak or awkward composition Make actions feel properly anchored Preserve the existing style unless the user explicitly asks for rede签名 Non-Goals Do not 创建 a new visual direction Do not reinterpret the 组件's aesthetic Do not change the 组件 category, product 角色, or hierarchy Do not broadly retheme colors, materials, effects, typography, or spacing Do not 应用ly a style 图形界面de as a full rede签名 unless the user explicitly asks for a rede签名 Do not make changes because they are "more beautiful" if they do not solve a concrete polish issue Do not replace a user's preferred de签名 with your preferred de签名 Do not silently change multiple unrelated areas when the user named one issue or node Default Stance Polish is a scalpel, not a rede签名 pass Do not rede签名 when polish is 请求ed Keep the current visual language, density, and dark/light mood Prefer surgical fixes over broad sty列出ic changes Prefer hierarchy and spacing fixes before introducing new visual elements Avoid unnecessary gradients, glows, heavy shadows, or decorative effects unless they improve hierarchy or usability 移除 friction, not personality Polish should improve clarity and confidence without changing the product 身份 If a change would be visible as a new style direction, 暂停 and either avoid it or ask first If the user says "do not rede签名", treat that as a hard constrAInt Review Order
检查 in this order:
User-状态d problem or 请求ed node Current 组件 角色 and intended visual category Existing visual language that must be preserved Text hierarchy and readability Spacing and alignment Action placement Content width, scroll, and resizing behavior Effects/material 清理up only if needed Final production-清理 pass Core Heuristics A polished UI should feel obvious, calm, and intentional If everything feels 导入ant, nothing is 导入ant Consistent spacing usually matters more than 添加itional styling Visual emphasis should follow product 导入ance, not decoration A 组件 should feel visually stable before it feels visually impressive Misalignment is usually more damaging than weak styling Hierarchy should be 创建d with spacing and contrast before color and effects Every polish edit should have a job: improve hierarchy, readability, alignment, affordance, or material separation If a change only makes the 组件 more decorative, treat it as suspect until the hierarchy is stable The smallest effective change is usually the best change When preserving a finished de签名, "less changed" is a 质量 metric If two fixes 机器人h work, choose the one that changes fewer properties Polish Decision Rules
Before editing, identify:
User intent: what specific thing did they ask to improve? Preservation tar获取: what must remAIn recognizably the same after the pass? Foreground: the element the user should act on or read first Support layer: secondary 上下文 that should stay visible but quieter Background: decorative or 环境al content that must not compete Interaction tar获取: the thing that should feel 命令行工具ckable, draggable, editable, or selected
Then make the smallest change that clarifies the relationship between those layers.
If the user gave a specific node, do not touch sibling nodes unless the named node cannot be judged or fixed without its immediate 上下文.
If the user gave a specific issue, fix that issue only. Examples:
"contrast" means adjust contrast, not layout, mood, or 组件 structure. "spacing" means adjust spacing/alignment, not palette or effects. "make it match DE签名.md" means map the existing 组件 to the closest category in the de签名 doc, not rede签名 it into another category. "this part is good" means preserve that part exactly unless a tiny mechanical fix is required.
Use this priority order:
Preserve the current de签名 intent Fix the named issue Fix obvious readability/访问ibility problems inside the named scope Fix spacing and alignment inside the named scope 调优 shadows, highlights, fills, and glows only if they are the problem 移除 anything that competes with the primary action or primary content What Good Looks Like Structure and Composition The 组件 should have one clear parent layout Major areas should read in a stable order: header, content, metadata, actions Resize behavior should be intentional: fixed viewport, fil