skills.rest
InNoobWeTrust
InNoobWeTrustCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux

Guide UI/UX design for accessible web and mobile interfaces with WCAG AA contrast.

4|Updated Mar 16, 2018
Search Tags:#typography#design#ui#accessibility#ux#design-system
One-click install
npx skills add https://github.com/InNoobWeTrust/dotfiles --skill ui-ux-innoobwetrust
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux
Source: https://github.com/InNoobWeTrust/dotfiles/tree/main/.agents/skills/ui-ux
Command: npx skills add https://github.com/InNoobWeTrust/dotfiles --skill ui-ux-innoobwetrust

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

UI/UX teams often struggle to maintain high-quality, accessible interfaces that align with taste-driven, High-Agency design principles.

Core Features & Use Cases

  • Visual hierarchy and typography guidance to craft polished, accessible interfaces.
  • Spacing, layout, and grid guidance aligned to a 4px scale for consistent design systems.
  • Reference patterns for motion, color, and accessibility, plus data augmentation with design data.

Quick Start

Describe and generate a production-ready UI concept that follows High-Agency principles for a polished interface.

Frequently Asked Questions about ui-ux

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

FAQPage Schema
How do I design a UI that meets WCAG AA accessibility and visual hierarchy standards?▼

To design a UI meeting WCAG AA accessibility and visual hierarchy standards, apply High-Agency principles to structure typography, color contrast, and scalable design-system patterns for polished interfaces.

What is the best way to scale typography and spacing for a component library?▼

The best way to scale typography and spacing for a component library is applying a 4px-based spacing grid, ensuring consistent layout alignment and scalable design-system patterns across web and mobile interfaces.

Can I use this UI design guidance for both web dashboards and mobile interfaces?▼

Yes, you can apply this UI design guidance to both web dashboards and mobile interfaces. It directs typography, motion, and color across forms, marketing pages, and component libraries.

How do I generate a production-ready UI concept that follows High-Agency design principles?▼

To generate a production-ready UI concept following High-Agency design principles, describe your interface requirements to receive tailored guidance on typography, motion, color, and accessibility.

Why does my design system lack consistent visual polish across different components?▼

Your design system lacks consistent visual polish if it does not enforce a 4px-based spacing scale and standardized typography guidance. Applying High-Agency principles resolves this by enforcing strict layout and hierarchy rules.

Related Skills

Explore More Design & Creative Skills→
qazuorqazuor

frontend-design

Guide UI teams through pre-coding design foundations for typography, color, and layout.

Community
Basic
anukkrit149anukkrit149

frontend-design

Generate production-grade React/HTML/CSS frontend interfaces with cohesive typography, color, and motion.

Community
Advanced
marpmemarpme
1

i-extract

Identify and extract reusable UI components and design tokens from codebases.

Community
Advanced
superpollo02superpollo02

shadcn

Generate shadcn/ui-inspired component guidance with token-first rules and WCAG 2.2 AA constraints.

Community
Intermediate