skills.rest
Dyrean
DyreanCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Audit UI code against Web Interface Guidelines for accessibility and UX gaps.

Updated Jun 22, 2024
Search Tags:#ui#accessibility#audit#ux#design-review#web-guidelines
One-click install
npx skills add https://github.com/Dyrean/dotfiles --skill web-design-guidelines-dyrean
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Dyrean/dotfiles/tree/main/opencode/.config/opencode/skills/web-design-guidelines
Command: npx skills add https://github.com/Dyrean/dotfiles --skill web-design-guidelines-dyrean

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps ensure UI code adheres to Web Interface Guidelines by automatically fetching the latest rules and performing an audit across the provided files or patterns.

Core Features & Use Cases

  • Fetch latest guidelines from the source URL to ensure up-to-date checks.
  • Automatically audit UI files for accessibility, contrast, and UX best practices, reporting any deviations.
  • Use Case: When reviewing a live site or design assets, run the audit to surface violations and recommended fixes.

Quick Start

Provide the UI files or patterns you want reviewed and I will fetch the latest guidelines and audit them.

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 accessibility and UX gaps?▼

Auditing UI code for accessibility and UX gaps requires providing your codebase or design assets via file patterns or explicit paths. The tool fetches the latest Web Interface Guidelines and reports deviations in a terse file:line format.

What is a UI accessibility audit against web guidelines?▼

A UI accessibility audit against web guidelines is an automated review that fetches the latest rules from a source URL and inspects your UI files for contrast, accessibility, and UX best practice deviations.

Can I scope a design review to specific UI files and patterns?▼

Yes, you can scope a design review to specific UI files and patterns by providing explicit file paths or glob patterns. The audit processes only those specified assets against the fetched web guidelines.

Does the accessibility audit fetch the latest web guidelines automatically?▼

Yes, the accessibility audit fetches the latest web guidelines automatically from the source URL, ensuring your UI code is always checked against the most current accessibility and UX rules.

How are accessibility violations reported in a UX design review?▼

Accessibility violations in a UX design review are reported in a terse file:line format, succinctly identifying exactly where in your UI code or design assets the web guidelines are violated.

Related Skills

Explore More Design & Creative Skills→
sao-codingsao-coding

web-design-guidelines

Fetch current Web Interface Guidelines and evaluate UI code compliance.

Community
Intermediate
MattRibMattRib

web-design-guidelines

Identify UI code violating Web Interface Guidelines and report file:line findings.

Community
Basic
ev3rlitev3rlit

web-design-guidelines

Audit UI code against fetched Web Interface Guidelines and output file:line findings.

Community
Intermediate
aberrantCodeaberrantCode
1

web-design-guidelines

Audit UI code against Vercel's Web Interface Guidelines with file:line findings.

Community
Intermediate