skills.rest
hueyexe
hueyexeCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-visual-composition

Critique UI composition and deliver prioritized recommendations for hierarchy, accessibility, and polish.

3|1|Updated Apr 30, 2026
Search Tags:#typography#accessibility#analyze#visual-design#design-systems#color-palette#ui-critique
One-click install
npx skills add https://github.com/hueyexe/frontend-agent-skills --skill ui-visual-composition
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-visual-composition
Source: https://github.com/hueyexe/frontend-agent-skills/tree/main/ui-visual-composition
Command: npx skills add https://github.com/hueyexe/frontend-agent-skills --skill ui-visual-composition

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Polished visual UI requires consistent hierarchy, spacing, typography, color, depth, imagery, and finishing details to communicate meaning clearly and build trust.

Core Features & Use Cases

  • Guides visual design quality, layout composition, tokens, and frontend implementation choices that affect visual quality.
  • Applies to UI critique, redesign, product-page polish, style guidance, and visual QA for generated interfaces.
  • Provides a reusable framework built on core principles to evaluate hierarchy, grouping, color systems, accessibility, and resilience.

Quick Start

Describe a UI task you want improved and provide any constraints or a rough sketch so I can generate a prioritized visual-design plan.

Frequently Asked Questions about ui-visual-composition

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I critique UI visual hierarchy and improve frontend composition?▼

You can improve visual hierarchy by applying a reusable framework to evaluate layout composition, spacing, typography, and color systems. This approach delivers structured critique and actionable recommendations to polish frontend visual composition across responsive web contexts.

What is the best way to polish UI visuals and ensure accessibility in a design system?▼

The best way to polish UI visuals is to apply design-system thinking and tokenization to evaluate hierarchy, grouping, and color palettes. This ensures accessibility resilience and provides structured guidance for production-grade frontend implementation decisions.

Does this UI critique approach work with existing design tokens and frontend constraints?▼

Yes, this UI critique approach works directly with existing design tokens and frontend implementation constraints. It evaluates visual design quality and tokenization while providing actionable recommendations tailored to responsive web contexts and production limitations.

How do I evaluate edge-state resilience for production-grade UI?▼

You evaluate edge-state resilience by assessing visual composition against core principles like hierarchy, grouping, and accessibility. This identifies vulnerabilities in design systems and delivers actionable recommendations to ensure robust frontend visual polish under production constraints.

Can I use this for visual QA on generated product pages?▼

Yes, you can use this framework for visual QA on generated product pages. It evaluates visual design quality, layout composition, and frontend implementation choices to deliver a prioritized visual-design plan for product-page polish and style guidance.

Related Skills

Explore More Design & Creative Skills→
Dragoon0xDragoon0x
4

plan-design

Generate structured design plans aligned with existing codebase design constraints.

Community
Intermediate
nattergabrielnattergabriel
2

critique

Assess frontend interfaces against design principles and identify anti-patterns.

Community
Advanced
Euraika-LabsEuraika-Labs
14

team-ui

Orchestrate multi-role UI workflows for game projects from specification to polish.

Official
Advanced
Shaarav4795Shaarav4795

refactoring-ui

Audit web UI design against grayscale-first, constraint-based design principles.

Community
Advanced