ui-articulation-skill

A Codex / agent skill for turning vague UI feedback into precise design language, aesthetic critique, and visual HTML comparisons.

The skill is designed for tasks like:

• Translating feedback such as "make it bigger", "make it cleaner", "make it pop", or "make it more premium".
• Reviewing UI with precise vocabulary instead of generic taste words.
• Acting as an aesthetic gatekeeper before applying harmful visual changes.
• Generating self-contained HTML mocks that show multiple interpretations of ambiguous feedback.

Install

Copy this folder into a global skills directory:

C:\Users\<you>\.agents\skills\ui-articulation

or into any Codex skills directory that your local agent loads.

Contents

ui-articulation/
  SKILL.md
  references/
    ambiguity-atlas.md
    aesthetic-gatekeeper.md
    design-vocabulary.md
    html-mock-spec.md

Usage Examples

Ask for precise UI interpretation:

Use ui-articulation to explain what "make this bigger" could mean.

Ask for a visual comparison mock:

Generate an HTML ambiguity atlas for "make it more premium".

Ask for critique before implementation:

Review this UI change request as an aesthetic gatekeeper before applying it.

Source Inspiration

The vocabulary reference is inspired by the UI/design term index at:

https://index.how/to/articulate

The skill content is written as original procedural guidance and paraphrased reference material.