UI Design Critique Assistant
Paste the following prompt into your AI chat to install this skill:
Please follow https://skillhub.cn/install/skillhub.md to install @user_eb189599/ui-design-critique.
About this skill
Problem: UI review often stays subjective
When engineers, PMs, or junior designers need to judge whether a UI screen works, feedback often sounds like “it feels cluttered,” “the hierarchy is weak,” or “the colors look off.” Those comments are hard to trace to a specific design decision and even harder to turn into concrete edits.
How it works: four critique dimensions
The skill turns a UI review into a structured pass:
- Visual hierarchy: check first-view focus, primary/secondary information, and whether size, color, and spacing create a clear path.
- Information architecture: judge whether grouping, navigation, and density match the user’s mental model.
- Cognitive load: identify overloaded screens, long action paths, and unnecessary decision points.
- Emotional resonance: assess whether the visual tone fits the product and whether feedback feels timely.
The input can be a design screenshot or a written solution description. The output provides scores and concrete improvement suggestions, which fits early-stage concept review, cross-role feedback, and design walk-throughs.
Boundaries: it is not usability testing or brand-system audit
This skill is closer to design critique and solution review. It does not replace real user testing, accessibility checks, frontend implementation review, or a full design-system audit. If the input is text-only, conclusions depend more on context; if the goal is pixel-level fidelity or motion evaluation, more assets are needed.
Use Cases
- Check first-view focus and hierarchy before page review.
- Judge whether new home navigation fits the user mental model.
- Find overload and long paths in checkout page review.
- Score a first draft across four dimensions and suggest edits.
Best For
- Frontend engineers who need structured feedback on page screenshots
- PMs who must judge navigation before a homepage redesign
- Junior visual designers who want actionable critique language
- Interaction designers who need to align design conclusions across roles
Related Skills
Excalidraw Wrap is an Excalidraw-focused wrapper, with tags for TypeScript, GitHub, and automation.
Calibrate vague brand inputs, expose contradictions, distill a brand core and positioning boundaries, then stress-test the result into an executable brand skeleton.
Generate localized Chinese brand names, naming directions, slogans, and risk checklists with reusable templates and trademark search reminders.
A beginner-friendly photo analysis tool that infers shooting parameters from visual features and suggests post-processing, optimization, and learning keywords.