Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/bitjaru/styleseed --skill ss-audit- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads ss-audit automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
Before this workflow, follow the once-per-session update preflight.
UX Audit
Registry-first artifact boundary
When .styleseed/project.json and .styleseed/artifacts/index.json exist, resolve the requested artifact ID first, then read only .styleseed/bundles/<artifact-id>.md and .styleseed/manifests/<artifact-id>.json. Never fall back to the global legacy bundle for a registry project. Legacy projects may use .styleseed/effective-rules.md only when no registry exists.
When NOT to use
- For accessibility-only issues → use
/ss-a11y - For design system token/golden-rule compliance → use
/ss-review - For copy/microcopy quality → use
/ss-copy - For brand new screens that don't exist yet — design first with
/ss-pageor/ss-flow
Target: $ARGUMENTS
Audit Framework
Nielsen's 10 Usability Heuristics
1. Visibility of System Status
- Loading states present (skeleton screens, not spinners)
- Success/error feedback after actions (toast notifications)
- Progress indicators for multi-step flows
- Active state clearly shown on navigation items
- Real-time data has timestamp showing freshness
2. Match Between System and Real World
- Labels use user's language, not technical jargon
- Icons are universally recognizable (Lucide standard set)
- Number formats match user expectations (comma separators, currency symbols)
- Date formats are locale-appropriate
3. User Control and Freedom
- Back navigation available on all non-root screens
- Destructive actions have confirmation dialogs
- Undo available for reversible actions (toast with undo)
- Bottom sheet/modal can be dismissed (backdrop tap, swipe down, X button)
- No dark patterns (no forced actions, always a way to dismiss)
4. Consistency and Standards
- Same action = same appearance everywhere
- Color meanings are consistent (green=success, red=error, brand=active)
- Text hierarchy follows the 5-level grayscale system
- Surface treatment follows the resolved grammar and brand recipe
- Spacing follows the resolved token scale and adapter constraints
5. Error Prevention
- Destructive buttons are visually distinct (destructive variant)
- Form validation happens on blur (not while typing)
- Dangerous actions require explicit confirmation
- Input constraints are visible before errors occur (character limits, format hints)
6. Recognition Rather Than Recall
- Icon controls have accessible labels; navigation labels follow the selected adapter
- Current state visible without memorization (active tab highlighted)
- Recent/frequent items shown for quick access
- Placeholder text shows expected format
7. Flexibility and Efficiency
- Key actions are reachable through an appropriate product-specific path
- Refresh behavior follows the platform adapter and the product's data semantics
- Touch hit areas >= 44x44px; pointer-first controls follow the resolved contract (approved 36–40px controls are not touch failures)
- Frequently used actions are placed according to the resolved navigation adapter
8. Aesthetic and Minimalist Design
- Each screen focuses on ONE primary task
- No decorative elements that don't serve a purpose
- Information pyramid respected (most important = biggest)
- Card and collection density follows the resolved grammar and task complexity
- No competing visual elements (one hero metric per page)
9. Help Users Recover from Errors
- Error messages explain what went wrong in plain language
- Error messages suggest how to fix the problem
- Partial failures don't break the whole page (one card fails, others load)
- Network errors show retry button
- Form errors highlight the specific field
10. Help and Documentation
- Empty states guide users to take action
- Onboarding for first-time features (if applicable)
- Tooltips for complex metrics (if applicable)
Mobile-Specific UX Checks
Touch & Gesture
- On touch surfaces, hit areas minimum 44x44px; preserve applicable accessibility floors for every input mode
- Minimum 8px between adjacent touch targets
- No hover-dependent interactions (mobile has no hover)
- Swipe gestures have visible affordances (carousel indicators)
Performance Perception
- Skeleton screens appear within 300ms
- Optimistic updates for user actions
- Above-the-fold content loads first
- No layout shift after content loads
Safe Areas
- Content not hidden behind notch/Dynamic Island
- Bottom content not behind home indicator
- Navigation surfaces respect the platform safe-area contract when one applies
Dark Pattern Prevention
- No forced bottom sheets on entry
- No exit-prevention dialogs
- Every screen has a way to go back/dismiss
- CTA labels clearly describe the action
- No manipulative graphics (begging, urgency)
Output Format
- Score: A+ to F rating with breakdown
- Critical Issues: Must fix (blocks usability)
- Major Issues: Should fix (degrades experience)
- Minor Issues: Nice to fix (polish)
- Recommendations: Specific code changes for each issue
FAQ
What does the ss-audit skill do?
Audit screens for UX issues using Nielsen's heuristics and modern mobile UX best practices
How do I install ss-audit?
Run npx skills add https://github.com/bitjaru/styleseed --skill ss-audit in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/ss-audit/ (personal) or .claude/skills/ss-audit/ (project).
Which AI agents can use ss-audit?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is ss-audit safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains ss-audit?
It is published by bitjaru in bitjaru/styleseed. It has 864 recorded installs.
More from bitjaru/styleseed
ss-review
bitjaru/styleseed
Review UI code for design system compliance, accessibility, and best practices
ss-setup
bitjaru/styleseed
Configure StyleSeed by selecting the output grammar, domain, page type, brand recipe, semantic palette recipe, optional aesthetic profile, and bounded brand tokens before scaffolding a first screen.
ss-a11y
bitjaru/styleseed
Audit a component or page for accessibility issues and fix them
ss-lint
bitjaru/styleseed
Quick automated lint — detects common design system violations in seconds
ss-feedback
bitjaru/styleseed
Add appropriate user feedback states (loading, success, error, empty) to a component or page
ss-update
bitjaru/styleseed
Check and update an existing StyleSeed installation by exact rule/skill revision, preserve project-owned design decisions, then recompile and verify the effective bundle.
Popular security skills
azure-compliance
microsoft/azure-skills
Run Azure compliance and security audits with azqr plus Key Vault expiration checks. Covers best-practice assessment, resource review, policy/compliance validation, and security posture checks. WHEN: compliance scan, security audit, BEFORE running azqr (compliance cli tool), Azure best practices, Key Vault expiration check, expired certificates, expiring secrets, orphaned resources, compliance assessment.
minimal-run-and-audit
lllllllama/rigorpilot-skills
Rigor Run skill for README-first deep learning repo reproduction. Use when the task is specifically to capture or normalize evidence from the selected smoke test or documented inference or evaluation command and write standardized reprooutputs/ files, including patch notes when repository files changed. Do not use for training execution, initial repo intake, generic environment setup, paper lookup, target selection, hidden scientific-meaning changes, or end-to-end orchestration by itself.
seo-audit
coreyhaines31/marketingskills
When the user wants to audit, review, or diagnose SEO issues on their site. Also use when the user mentions "SEO audit," "technical SEO," "why am I not ranking," "SEO issues," "on-page SEO," "meta tags review," "SEO health check," "my traffic dropped," "lost rankings," "not showing up in Google," "site isn't ranking," "Google update hit me," "page speed," "core web vitals," "crawl errors," "indexing issues," "stuck on page 2," "striking distance keywords," "title tag rewrite," "low CTR," "local SEO," "Google Business Profile," or "map pack." Use this even if the user just says something vague like "my SEO is bad" or "help with SEO" — start with an audit. For building pages at scale to target keywords, see programmatic-seo. For adding structured data, see schema. For AI search optimization, see ai-seo.
firebase-security-rules-auditor
firebase/agent-skills
Audits Firebase (Firestore, Cloud Storage) security rules for vulnerabilities, privilege escalation, role bypasses, create vs update inconsistencies, resource exhaustion, type safety, size limits, and hasOnly ownership checks. Use when auditing/reviewing rules, running red-team rule assessments, or scoring against auditor checklists. Don't use for Firebase CLI (login, deploy), Auth, Crashlytics, Remote Config, or database queries.
audit
pbakaus/impeccable
Run technical quality checks across accessibility, performance, theming, responsive design, and anti-patterns. Generates a scored report with P0-P3 severity ratings and actionable plan. Use when the user wants an accessibility check, performance audit, or technical quality review.
competitors
coreyhaines31/marketingskills
When the user wants to create competitor comparison or alternative pages for SEO and buyer-facing use. Also use when the user mentions 'alternative page,' 'vs page,' 'competitor comparison,' 'comparison page,' '[Product] vs [Product],' '[Product] alternative,' 'competitive landing pages,' 'how do we compare to X,' 'competitor teardown,' 'audit our competitor pages,' 'are our comparison pages out of date,' or 'competitive asset audit.' Use this for any content that positions your product against competitors. Covers four formats: singular alternative, plural alternatives, you vs competitor, and competitor vs competitor. For auditing existing claims (not researching competitors from scratch, which is competitor-profiling; not technical SEO on these pages, which is seo-audit), use the asset audit here. For internal battle cards and sales-specific competitor docs, see sales-enablement.
