skills.rest
gsd-build
gsd-buildOFFICIAL
Explore all skills by this author →
GitHub

userinterface-wiki

Identify UI/UX best-practice gaps in web components and output file:line findings.

7.8k|770|Updated Mar 11, 2026
Search Tags:#typography#ui#animations#ux#web#design-guidelines#prefetching
One-click install
npx skills add https://github.com/gsd-build/gsd-2 --skill userinterface-wiki
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: userinterface-wiki
Source: https://github.com/gsd-build/gsd-2/tree/main/src/resources/skills/userinterface-wiki
Command: npx skills add https://github.com/gsd-build/gsd-2 --skill userinterface-wiki

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

UI/UX best practices guide that consolidates animation, CSS, audio, typography, UX patterns, prefetching, and icon guidelines to help teams review and implement consistent, accessible interfaces.

Core Features & Use Cases

  • 11 categories spanning animation principles to typography, enabling consistent reviews and implementation checks.
  • Serves as a decision-support guide for design reviews, code reviews, and automated linting of UI components.
  • Useful for accelerating onboarding and ensuring cross-team alignment on interaction and visual design expectations.

Quick Start

Evaluate a web UI component against the wiki guidelines and apply the recommended patterns.

Frequently Asked Questions about userinterface-wiki

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

FAQPage Schema
What UI/UX best practices should I follow when reviewing web interface components?▼

UI/UX best practices for web interfaces span 11 categories, including animation principles, CSS, typography, icons, prefetching, and audio patterns, ensuring consistent and accessible implementation.

How do I check my web typography and animations for accessibility gaps?▼

Evaluate web components against consolidated typography and animation guidelines to identify accessibility and implementation gaps, receiving actionable recommendations with specific file and line findings.

Can I use these design guidelines for automated linting of CSS and UX patterns?▼

Yes, the design guidelines serve as a decision-support reference for automated linting of UI components, evaluating CSS, UX patterns, and interaction expectations during code reviews.

What's the best way to align cross-team interaction and visual design expectations?▼

The best way to align cross-team visual design expectations is to apply a consolidated wiki of UI/UX guidelines, accelerating onboarding and standardizing reviews across all web components.

Does the UI/UX review cover resource prefetching and audio patterns?▼

Yes, the UI/UX review covers resource prefetching and audio patterns as distinct categories, evaluating these web interface behaviors alongside icons and animations to ensure optimal user experience.

Why do my web animation principles need a standardized review process?▼

Web animation principles need a standardized review process to identify UI/UX best-practice gaps, providing actionable guidelines that ensure consistent, accessible interactions across all components.

Related Skills

Explore More Design & Creative Skills→
LordkaitoLordkaito

brainstorming

Transform initial ideas into detailed project designs and specifications.

Community
Intermediate
sulthonuladibsulthonuladib

web-design-guidelines

Identify UI conformance issues against Web Interface Guidelines in HTML/CSS/JS codebases.

Community
Intermediate
cmetechcmetech

userinterface-wiki

Enforce UI/UX best-practice rules across web interfaces for code reviews and linting.

Community
Advanced
LschulzesLschulzes

web-design-guidelines

Evaluate UI code against Web Interface Guidelines to detect deviations.

Community
Intermediate