ux-reviewer

name

ux-reviewer

description

Evaluate website usability and user experience — catch navigation problems, confusing layouts, and design issues that make sites harder to use. Trigger on "hard to navigate", "confusing layout", "UX review", "user experience", "usability", "make it easier to use", "navigation issues", "users can't find", "improve the flow", "design review", "mobile experience", "is my site easy to use", "information architecture".

UX Reviewer for VibeCoding-a-Website

Overview

Your site might be technically flawless, load lightning-fast, and have zero broken links — but if visitors can't figure out how to use it, none of that matters. This skill bridges the gap between "the site works" and "the site works well for humans."

The UX reviewer catches the problems that only humans notice: confusing navigation, overwhelming layouts, hidden contact forms, buttons that don't look clickable, and information buried three levels deep. We'll evaluate your site through the eyes of real visitors and give you actionable insights to make it more intuitive and pleasant to use.

---

Nielsen's 10 Usability Heuristics (Adapted for Your Site)

1. Visibility of System Status

Does your site tell visitors what's happening?

• Loading states for forms, searches, or content fetches
• Clear feedback when forms are submitted
• Active navigation highlighted (current page obvious)
• Success/error messages are visible and helpful
• Page transitions feel responsive

2. Match Between System and Real World

Does your site speak the visitor's language?

• Menu labels match what people actually search for
• Jargon explained or avoided entirely
• Icons are intuitive (magnifying glass = search, hamburger = menu)
• Error messages use plain English, not technical jargon
• Calls-to-action use visitor-focused language ("Get My Free Guide" not "Submit Form")

3. User Control and Freedom

Can visitors easily get out of trouble?

• Back button works as expected
• Clear "escape routes" (home button, logo link)
• No dead-end pages
• Undo available where possible (search history, form drafts)
• No forced registrations before exploring

4. Consistency and Standards

Do design patterns feel familiar?

• Buttons look like buttons (not text links masquerading as buttons)
• Links are consistently styled and colored
• Navigation placement consistent across all pages
• Form fields look like form fields
• Icon meanings match web conventions

5. Error Prevention

Are you stopping problems before they happen?

• Form validation happens before submission (not after)
• Required fields marked clearly
• Correct input formats suggested (placeholder text)
• Confirmation dialogs for irreversible actions
• Smart defaults (pre-selected sensible options)

6. Recognition Over Recall

Are options visible or hidden in memory?

• Menu items always visible or one click away
• Clear category labels instead of generic "More"
• Visible breadcrumbs show visitor location
• Search suggestions as you type
• No hidden features requiring visitors to remember commands

7. Flexibility and Efficiency

Can both novices and power-users succeed?

• Keyboard shortcuts for common actions (search, skip to content)
• Skip navigation link on every page
• Multiple paths to reach the same content
• Quick filters instead of endless scrolling
• Bookmarkable URLs for important pages

8. Aesthetic and Minimalist Design

Is your site clean or cluttered?

• Each element has a purpose (no decorative noise)
• Whitespace used generously (not cramped)
• Signal-to-noise ratio high (important stuff prominent)
• No auto-playing videos, animations that distract
• Color palette purposeful, not overwhelming

9. Help Users Recognize and Recover from Errors

When things go wrong, is recovery easy?

• 404 pages suggest related pages
• Form errors highlight specific fields
• Error messages suggest solutions ("Email format: [e-mail]")
• Friendly, conversational error tone (not robotic)
• Search function available on error pages

10. Help and Documentation

Is help accessible when needed?

• FAQ section answers common questions
• Tooltips for complex fields
• Help text near confusing features (not buried in docs)
• Contact form or chat accessible from every page
• Documentation scannable (short paragraphs, lists, headings)

---

Navigation Audit Checklist

• Every page reachable in 3 clicks or fewer from homepage
• Main navigation consistent across all pages
• Mobile menu easy to open, close, and navigate
• Breadcrumbs present on multi-level pages
• Current page clearly highlighted in navigation
• Logo/home link on every page
• Navigation items grouped logically (not random order)
• Dropdown menus only used when truly necessary
• Footer navigation includes sitemap or key links
• Search function (if present) discoverable and works well

---

Visual Hierarchy Review

• Eye naturally flows to important content (F-pattern or Z-pattern)
• Primary call-to-action prominent and above the fold
• Sufficient contrast between sections (visual separation)
• H1, H2, H3 headings create clear hierarchy
• Heading sizes make sense (not decorative)
• Whitespace creates visual breathing room
• Important information not buried in walls of text
• Color used purposefully (not just for decoration)
• Images support content, not replace it
• Paragraph lengths scannable (not dense blocks)

---

Mobile UX Specific Checks

• Touch targets at least 44×44 pixels (thumbs can hit easily)
• Key actions in thumb zone (center/bottom of screen)
• No hover-dependent interactions (mobile has no hover)
• Scroll depth appropriate for mobile attention span
• Forms optimized for mobile input (correct keyboard types: email, phone, number)
• Images scale responsively (no horizontal scrolling)
• Text readable at mobile size (minimum 16px body text)
• Tap-to-call, tap-to-email working correctly
• No horizontal text scroll or zoom required
• Mobile menu opens smoothly without layout shift

---

Content Readability Standards

• Line length 45–75 characters (optimal reading width)
• Body text at least 16px font size
• Line spacing generous (1.5–1.75 for web)
• Paragraphs short (3–5 sentences, break up long content)
• Subheadings every 200–300 words
• Contrast ratio meets WCAG AA standard (4.5:1 minimum)
• Font family readable (sans-serif usually best for web)
• No justified text (ragged right is easier to scan)
• List formatting used to break up information
• Emphasis (bold, italics) used sparingly and purposefully

---

User Journey Analysis

For each major page type, ask:

Homepage: What should first-time visitors understand about this site?

• Is the value proposition clear in 5 seconds?
• Is the primary CTA obvious?
• Are there intuitive entry points to key sections?

About/Services: Why should visitors trust and choose this?

• Does it answer "Who are you?" and "Why you?"
• Are team members or credentials visible?
• Is a call-to-action present?

Contact Page: Can someone reach out easily?

• Contact form simple and unintimidating?
• Multiple contact options (phone, email, form)?
• Expected response time stated?
• Is the form above the fold?

Blog/Resources: Can visitors find what they need?

• Search function working well?
• Categories and tags helping discovery?
• Related posts suggested at bottom?
• Enough content to justify the section?

---

UX Scorecard Template

Score each category 0–100:

Category	Score	Notes
Navigation & Structure	—	Can users find things easily?
Visual Hierarchy	—	Is important content prominent?
Mobile Experience	—	Does it work on phones?
Readability	—	Is text easy to read?
Forms & Interaction	—	Are CTAs clear and clickable?
Loading & Performance Feel	—	Does it feel responsive?
Error Handling	—	Are problems communicated well?
Content Quality	—	Is information useful and complete?
Brand & Design Consistency	—	Does everything feel cohesive?
Accessibility & Inclusivity	—	Is it usable by everyone?
OVERALL UX SCORE	—	Average of above

Interpretation:

• 80–100: Excellent — visitors will feel impressed and guided
• 60–79: Good — mostly intuitive with some opportunities
• 40–59: Fair — several friction points worth fixing
• Below 40: Needs redesign — visitors likely frustrated

---

Common UX Anti-Patterns to Flag

🚩 Walls of Text — Long paragraphs without breaks, headings, or lists
🚩 Mystery Meat Navigation — Icons with no labels; visitors unsure what to click
🚩 Inconsistent Button Styles — Some look clickable, some don't; no clear standard
🚩 Auto-Playing Media — Videos or music starting without permission (annoying, poor accessibility)
🚩 Popup Overload — Newsletter signup, discount offer, survey all competing for attention
🚩 Infinite Scroll Without Purpose — No logical stopping point, can't reach footer
🚩 Hidden Contact Info — Phone number or email buried in "Contact" page or footer only
🚩 Hover-Dependent Content — Desktop interactions breaking on mobile
🚩 No Mobile Menu — Desktop nav becomes unclickable on phones
🚩 Slow First Impression — Page takes 3+ seconds to feel interactive
🚩 Orphaned Pages — Content pages with no navigation path, dead links
🚩 "Click Here" Links — Generic anchor text that doesn't describe destination

---

Next Steps

1. Identify your top 3 friction points — where do visitors struggle most?
2. Prioritize high-impact fixes — navigation and mobile UX first
3. Test with real users — watch someone use your site for 5 minutes
4. Iterate small — change one thing, measure impact, repeat
5. Keep score over time — track your UX improvements quarter-over-quarter

Remember: UX isn't about perfection. It's about removing obstacles between visitors and what they want.

---

Last updated: 2026-04-03