web-design-guidelines

Compare UI files against Web Interface Guidelines to report compliance violations.

127|21|Updated Nov 5, 2018
One-click install
npx skills add https://github.com/rayriffy/rayriffy-h --skill web-design-guidelines-rayriffy
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/rayriffy/rayriffy-h/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/rayriffy/rayriffy-h --skill web-design-guidelines-rayriffy

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code for Web Interface Guidelines compliance and accessibility concerns.

Core Features & Use Cases

  • Checks UI code against Web Interface Guidelines.
  • Flags accessibility and UX issues and suggests improvements.
  • Use case: When you want to ensure a new UI component aligns with guidelines before launch.

Quick Start

Provide the UI files or patterns you want reviewed, and I will compare them against the latest Web Interface Guidelines to report violations and suggest fixes.

Frequently Asked Questions about web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit my UI code for web interface guidelines compliance?

Web interface guidelines compliance checks identify accessibility and UX gaps by comparing project UI files against the latest Web Interface Guidelines. This rule-based evaluation sources guidelines automatically and outputs structured findings for design review tasks and site audits.

What is the best way to check web interface accessibility before launch?

The best way to check web interface accessibility before launch is to run an automated rule-based evaluation on your UI files. This process flags accessibility issues, evaluates guideline sourcing, and suggests structural fixes to ensure components align with required standards.

How do I review UI components for accessibility and UX issues?

To review UI components for accessibility and UX issues, submit your UI patterns for automated evaluation. The system applies web interface guidelines to detect compliance gaps, flags specific accessibility concerns, and suggests improvements to align the interface before launch.

Can I use this to audit existing site interfaces or only new components?

You can use this to audit existing site interfaces and new components alike. The rule-based evaluation applies web interface guidelines across any provided UI files or patterns, satisfying design review tasks, accessibility checks, and site audits regardless of project stage.

Do I need to provide specific UI file formats for a design review?

You need to provide your UI files or patterns directly for a design review. The system evaluates these inputs against web interface guidelines to identify compliance gaps and output structured findings, without requiring additional dependencies or specific component frameworks.

What limitations exist when evaluating web interface compliance automatically?

Limitations of automated web interface compliance evaluation include its reliance on rule-based checks against the latest guidelines. It identifies structural and accessibility violations in provided UI files but may not catch subjective UX design flaws outside of established guideline parameters.