--- id: sm-critique name: "critique" url: https://skills.yangsir.net/skill/sm-critique author: pbakaus domain: product tags: ["product-review", "design-critique", "user-feedback", "usability-testing", "product-strategy"] install_count: 83000 rating: 4.70 (1744 reviews) github: https://github.com/pbakaus/impeccable --- # critique > 一种设计语言，旨在提升AI工具在产品设计中的批判性分析能力，帮助用户优化设计决策和流程。 **Stats**: 83,000 installs · 4.7/5 (1744 reviews) ## Before / After 对比 ### 产品设计智能评审与优化 ## Readme # critique ## MANDATORY PREPARATION Use the frontend-design skill — it contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding — if no design context exists yet, you MUST run teach-impeccable first. Additionally gather: what the interface is trying to accomplish. Conduct a holistic design critique, evaluating whether the interface actually works—not just technically, but as a designed experience. Think like a design director giving feedback. ## Design Critique Evaluate the interface across these dimensions: ### 1. AI Slop Detection (CRITICAL) **This is the most important check.** Does this look like every other AI-generated interface from 2024-2025? Review the design against ALL the **DON'T** guidelines in the frontend-design skill—they are the fingerprints of AI-generated work. Check for the AI color palette, gradient text, dark mode with glowing accents, glassmorphism, hero metric layouts, identical card grids, generic fonts, and all other tells. **The test**: If you showed this to someone and said "AI made this," would they believe you immediately? If yes, that's the problem. ### 2. Visual Hierarchy - Does the eye flow to the most important element first? - Is there a clear primary action? Can you spot it in 2 seconds? - Do size, color, and position communicate importance correctly? - Is there visual competition between elements that should have different weights? ### 3. Information Architecture - Is the structure intuitive? Would a new user understand the organization? - Is related content grouped logically? - Are there too many choices at once? (cognitive overload) - Is the navigation clear and predictable? ### 4. Emotional Resonance - What emotion does this interface evoke? Is that intentional? - Does it match the brand personality? - Does it feel trustworthy, approachable, premium, playful—whatever it should feel? - Would the target user feel "this is for me"? ### 5. Discoverability & Affordance - Are interactive elements obviously interactive? - Would a user know what to do without instructions? - Are hover/focus states providing useful feedback? - Are there hidden features that should be more visible? ### 6. Composition & Balance - Does the layout feel balanced or uncomfortably weighted? - Is whitespace used intentionally or just leftover? - Is there visual rhythm in spacing and repetition? - Does asymmetry feel designed or accidental? ### 7. Typography as Communication - Does the type hierarchy clearly signal what to read first, second, third? - Is body text comfortable to read? (line length, spacing, size) - Do font choices reinforce the brand/tone? - Is there enough contrast between heading levels? ### 8. Color with Purpose - Is color used to communicate, not just decorate? - Does the palette feel cohesive? - Are accent colors drawing attention to the right things? - Does it work for colorblind users? (not just technically—does meaning still come through?) ### 9. States & Edge Cases - Empty states: Do they guide users toward action, or just say "nothing here"? - Loading states: Do they reduce perceived wait time? - Error states: Are they helpful and non-blaming? - Success states: Do they confirm and guide next steps? ### 10. Microcopy & Voice - Is the writing clear and concise? - Does it sound like a human (the right human for this brand)? - Are labels and buttons unambiguous? - Does error copy help users fix the problem? ## Generate Critique Report Structure your feedback as a design director would: ### Anti-Patterns Verdict **Start here.** Pass/fail: Does this look AI-generated? List specific tells from the skill's Anti-Patterns section. Be brutally honest. ### Overall Impression A brief gut reaction—what works, what doesn't, and the single biggest opportunity. ### What's Working Highlight 2-3 things done well. Be specific about why they work. ### Priority Issues The 3-5 most impactful design problems, ordered by importance: For each issue: - **What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) - **Command**: Which command to use (prefer: /animate, /quieter, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive — or other installed skills you're sure exist) ### Minor Observations Quick notes on smaller issues worth addressing. ### Questions to Consider Provocative questions that might unlock better solutions: - "What if the primary action were more prominent?" - "Does this need to feel this complex?" - "What would a confident version of this look like?" **Remember**: - Be direct—vague feedback wastes everyone's time - Be specific—"the submit button" not "some elements" - Say what's wrong AND why it matters to users - Give concrete suggestions, not just "consider exploring..." - Prioritize ruthlessly—if everything is important, nothing is - Don't soften criticism—developers need honest feedback to ship great design Weekly Installs18.0KRepository[pbakaus/impeccable](https://github.com/pbakaus/impeccable)GitHub Stars10.2KFirst Seen14 days agoSecurity Audits[Gen Agent Trust HubPass](/pbakaus/impeccable/critique/security/agent-trust-hub)[SocketWarn](/pbakaus/impeccable/critique/security/socket)[SnykPass](/pbakaus/impeccable/critique/security/snyk)Installed oncodex17.7Kopencode17.6Kgithub-copilot17.6Kgemini-cli17.6Kcursor17.6Kamp17.6K --- *Source: https://skills.yangsir.net/skill/sm-critique* *Markdown mirror: https://skills.yangsir.net/api/skill/sm-critique/markdown*