ngautopilot-frontend

Plugin ngautopilot-frontend from marketplace ngautopilot in janpereira-dev/ngAutoPilot. Commands read from the repo's manifest — 10 days ago.

Skills (24)

• Inclusive UI Foundations

  Build and review accessible frontend flows with semantic structure, keyboard operation, readable error feedback, and resilient content.

• Responsive Layout and Motion

  Design resilient CSS layouts with content-first sizing, progressive enhancement, readable reflow, and reduced-motion support.

• Accessibility Interaction Gate

  Block release when semantics, keyboard, focus, contrast, target size, announcements, zoom, motion, or error recovery fail.

• Anti Generic AI Design Gate

  Detect trend-stacked and brandless interfaces, then require product-specific visual reasoning before design approval.

• Color Contrast and Semantic Tokens

  Build meaningful color roles and validate contrast, state distinction, focus visibility, and non-color cues.

• Component API and Composition

  Design reusable component contracts with semantic typed APIs, slots, defaults, events, extension points, and controlled complexity.

• Component State Completeness

  Define visual, behavioral, content, accessibility, and responsive contracts for every meaningful component state.

• Frontend Design Quality Orchestrator

  Route broad frontend design work through product, visual, usability, accessibility, responsive, state, and release gates.

• Design Quality Release Gate

  Score product intent, visual identity, usability, components, accessibility, responsiveness, states, motion, and validation with blocker overrides.

• Design System Governance

  Evolve reusable UI foundations through explicit tokens, component contracts, accessibility states, and evidence-based adoption decisions.

• Design Token System

  Define semantic, scalable design tokens and component token boundaries instead of hardcoded visual values.

• Disclosure and Accordion with Native Details

  Build disclosure and accordion patterns with details and summary first, progressive enhancement, and explicit accessibility fallbacks.

• Microcopy and Feedback System States

  Define clear labels, validation, loading feedback, empty states, errors, confirmations, and recovery actions for product interfaces.

• Motion Choreography and Progressive Enhancement

  Use CSS-first motion for causality and feedback with reduced-motion support, bounded timing, browser fallbacks, and stable end states.

• Native First Interaction Components

  Choose native HTML semantics before custom widgets and define safe escalation to verified accessibility primitives.

• Product Design Intake

  Establish user task, content, constraints, brand direction, risk, and measurable outcomes before frontend design work.

• Product UI Discovery

  Translate a frontend request into a focused user outcome, task flow, content hierarchy, edge states, and measurable acceptance criteria.

• Responsive Layout and Content Density

  Design layout behavior around content, task priority, container size, zoom, and input modality rather than fixed screenshots.

• Storybook and Visual Regression Gate

  Define story coverage, deterministic fixtures, screenshot baselines, interaction states, and approval rules for component changes.

• Task Flow Usability Review

  Review user flows for clarity, decision cost, error prevention, recovery, feedback, consistency, and completion confidence.

• Typography and Information Hierarchy

  Use semantic content order, typography, spacing, and grouping to make task priority and information relationships clear.

• Visual Direction and Art Direction

  Define coherent visual rules for interface typography, imagery, shape, density, contrast, and motion from product intent.

• Web Performance Evidence

  Improve frontend loading and interaction performance through measured user-path evidence, resource prioritization, rendering analysis, and explicit budgets.

• Frontend Experience Validation

  Gather evidence for critical frontend journeys across behavior, accessibility, visual regressions, network resilience, and performance without requiring a fixed test tool.

Similar plugins