A modular collection of 35 targeted UX/UI prompts designed to eliminate AI-generated sloppiness, enforce design system consistency, and elevate web applications to production-grade craftsmanship.
Each prompt is stored in its own standalone markdown file under this directory, ready to be used individually or combined for specific design, refactoring, and code review purposes.
Targeted prompts to eliminate common AI design tropes (excessive containers, decorative gradients, random badges) and restore visual discipline.
01-base-production-polish.md— Base production polish for hierarchy, spacing, alignment, and responsiveness.02-reduce-ai-sloppy-ui.md— Audit and remove cards-inside-cards, excessive pills, badges, and decorative noise.03-icon-discipline.md— Retain functional navigation/action icons while purging decorative clutter.04-visual-hierarchy-audit.md— Establish clear primary vs secondary visual emphasis and contrast.05-information-density-optimization.md— Maximize information value while lowering visual noise.30-ai-slop-detection-pass.md— Dedicated sweep for sparkle icons, decorative gradients, floating cards, etc.31-reduce-ui-noise.md— Reduce overall visual noise by 20–30% without removing features.32-improve-scanability.md— Structure layouts for quick visual scanning within seconds.
Prompts focused on structural rhythm, container hygiene, and typographic hierarchy.
06-card-reduction.md— Flatten unnecessary card wrappers into clean rows, lists, or whitespace.07-typography-refinement.md— Establish clear typographic hierarchy and normalize sizing/weights.08-spacing-audit.md— Harmonize margins, paddings, and gaps using design system spacing scales.28-content-first-interface.md— Elevate content readability over decorative application chrome.
Prompts for refining specific UI components, data presentations, and navigational bars.
09-button-hierarchy.md— Establish distinct visual weights for primary, secondary, and tertiary actions.10-form-ux.md— Field ordering, accessible labels, validation, and actionable error states.11-table-data-grid-ux.md— Column prioritization, row density, sorting, pagination, and scanning ease.12-dashboard-cleanup.md— Strip decorative metrics and focus on actionable operational data.13-sidebar-navigation.md— Clean grouping, subtle active states, indentation, and hierarchy.14-header-toolbar-cleanup.md— Simplify top bars and prioritize high-frequency contextual actions.15-search-ux.md— Discoverable search, keyboard shortcuts, input sizing, and result presentation.16-filter-ux.md— Intuitive filter controls, active state visibility, and easy reset flows.27-interaction-polish.md— Purposeful micro-interactions, subtle hover/focus states, and meaningful transitions.
Prompts ensuring edge cases and asynchronous lifecycle states feel solid and calm.
17-empty-state.md— Helpful, concise empty states with clear calls-to-action.18-loading-state.md— Layout-stable skeletons and proportional loading indicators.19-error-state.md— Actionable error messages, severity scaling, and clear recovery paths.20-status-design.md— Restrained, consistent status indicators without sensory overload.
Prompts for multi-device support, inclusive standards, and design system governance.
21-responsive-design-audit.md— Fluid layout reorganization across desktop, tablet, and mobile.22-mobile-ux.md— Thumb ergonomics, touch target sizing, and vertical flow.23-accessibility-audit.md— Semantic HTML, keyboard navigation, focus rings, and contrast compliance.24-dark-mode-audit.md— Surface contrast, dark mode depth, avoiding pure black/neon glows.25-design-system-consistency.md— Align component styles and tokens with the established system.26-component-simplification.md— Eliminate wrapper bloat, duplicate styling, and over-engineering.
Targeted passes for developer products, professional SaaS aesthetics, and pre-shipping sanity checks.
29-professional-saas-audit.md— Cultivate a restrained, trustworthy, mature SaaS interface.33-professional-developer-tool-ux.md— Optimize for engineer workflows, high information value, and speed.34-final-simplification-pass.md— Pre-ship cleanup pass to strip non-essential visual elements.35-final-product-quality-pass.md— Comprehensive pre-production checklist for consistency and edge states.
| # | Prompt File | Title | Purpose |
|---|---|---|---|
| 01 | 01-base-production-polish.md |
Base Production Polish | Baseline production-quality hierarchy, spacing, and responsiveness |
| 02 | 02-reduce-ai-sloppy-ui.md |
Reduce AI-Sloppy UI | Eliminate AI card-in-card tropes, excessive pills, badges, and noise |
| 03 | 03-icon-discipline.md |
Icon Discipline | Keep functional action/nav icons and remove decorative clutter |
| 04 | 04-visual-hierarchy-audit.md |
Visual Hierarchy Audit | Clarify visual importance between primary content and metadata |
| 05 | 05-information-density-optimization.md |
Information Density Optimization | Increase information density without cluttering the screen |
| 06 | 06-card-reduction.md |
Card Reduction | Flatten card containers into rows, lists, and clean whitespace |
| 07 | 07-typography-refinement.md |
Typography Refinement | Establish typographic scale, line heights, and weights |
| 08 | 08-spacing-audit.md |
Spacing Audit | Enforce consistent spacing scale and visual rhythm |
| 09 | 09-button-hierarchy.md |
Button Hierarchy | Differentiate primary, secondary, tertiary, and destructive buttons |
| 10 | 10-form-ux.md |
Form UX | Form field grouping, labels, validation, and actionable error messages |
| 11 | 11-table-data-grid-ux.md |
Table / Data Grid UX | Data density, column prioritization, row scanning, sorting, pagination |
| 12 | 12-dashboard-cleanup.md |
Dashboard Cleanup | Reduce decorative dashboard cards/charts, focus on decision metrics |
| 13 | 13-sidebar-navigation.md |
Sidebar Navigation | Predictable navigation hierarchy, active states, and indentation |
| 14 | 14-header-toolbar-cleanup.md |
Header / Toolbar Cleanup | Streamline top toolbars and prioritize frequent actions |
| 15 | 15-search-ux.md |
Search UX | Ergonomic search bar, keyboard shortcuts, filters, and results |
| 16 | 16-filter-ux.md |
Filter UX | Clear filter controls, active filter state, and easy reset flows |
| 17 | 17-empty-state.md |
Empty State | Concise empty states with actionable next steps |
| 18 | 18-loading-state.md |
Loading State | Predictable, calm skeleton loaders and layout stability |
| 19 | 19-error-state.md |
Error State | Actionable error messages, severity scaling, and clear recovery actions |
| 20 | 20-status-design.md |
Status Design | Restrained status badges/indicators avoiding sensory overload |
| 21 | 21-responsive-design-audit.md |
Responsive Design Audit | Multi-device layout reorganization and overflow prevention |
| 22 | 22-mobile-ux.md |
Mobile UX | Mobile-specific thumb zones, touch targets, and vertical flow |
| 23 | 23-accessibility-audit.md |
Accessibility Audit | Semantic HTML, keyboard navigation, focus rings, and contrast |
| 24 | 24-dark-mode-audit.md |
Dark Mode Audit | Dark mode surface depth, contrast, and calm tones |
| 25 | 25-design-system-consistency.md |
Design System Consistency | Token and component reuse matching the existing design system |
| 26 | 26-component-simplification.md |
Component Simplification | Flatten component nesting, eliminate redundant CSS and abstractions |
| 27 | 27-interaction-polish.md |
Interaction Polish | Subtle micro-interactions, hover/focus feedback, and smooth state transitions |
| 28 | 28-content-first-interface.md |
Content-First Interface | Emphasize readable content over decorative UI wrappers |
| 29 | 29-professional-saas-audit.md |
Professional SaaS Audit | Restrained, trustworthy, and predictable SaaS UI identity |
| 30 | 30-ai-slop-detection-pass.md |
AI-Slop Detection Pass | Dedicated sweep against sparkle icons, gradients, and floating cards |
| 31 | 31-reduce-ui-noise.md |
Reduce UI Noise | 20–30% noise reduction pass while retaining all functional utility |
| 32 | 32-improve-scanability.md |
Improve Scanability | Optimize visual grouping and typography for rapid scanning |
| 33 | 33-professional-developer-tool-ux.md |
Professional Developer Tool UX | High information value, structured density, and efficiency for engineers |
| 34 | 34-final-simplification-pass.md |
Final Simplification Pass | Pre-ship review to eliminate non-essential elements before merge |
| 35 | 35-final-product-quality-pass.md |
Final Product Quality Pass | Complete production readiness checklist across all edge cases |
Combine these prompts for common lifecycle workflows:
- Run
02-reduce-ai-sloppy-ui.md - Run
06-card-reduction.md - Run
03-icon-discipline.md - Run
31-reduce-ui-noise.md
- Run
11-table-data-grid-ux.mdor12-dashboard-cleanup.md - Run
05-information-density-optimization.md - Run
32-improve-scanability.md - Run
16-filter-ux.md