skills.rest
koolamusic
koolamusicCOMMUNITY
Explore all skills by this author →
𝕏@letandrewcookGitHub

ux

Create distinctive frontend interfaces with typography, color, and responsive design.

9|Updated Feb 14, 2026
Search Tags:#accessibility#frontend#responsive design#visual design#design systems#ux design#web interfaces
One-click install
npx skills add https://github.com/koolamusic/claudefiles --skill ux-koolamusic
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ux
Source: https://github.com/koolamusic/claudefiles/tree/main/plugins/ux/skills/ux
Command: npx skills add https://github.com/koolamusic/claudefiles --skill ux-koolamusic

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps developers and designers avoid generic frontend interfaces by providing a structured approach for creating distinctive, polished, and user-focused digital experiences.

Core Features & Use Cases

  • Distinctive Interface Design: Guides the creation of production-grade web components, pages, applications, and visual artifacts with a strong aesthetic direction.
  • UX Quality Principles: Applies guidance for typography, color systems, responsive layouts, motion, accessibility, interaction patterns, and UX writing.
  • Use Case: Build a SaaS dashboard, marketing page, or interactive web application that feels intentionally designed rather than like a generic AI-generated interface.

Quick Start

Use the ux skill to design and implement a distinctive landing page for my application with a refined visual style and accessible responsive components.

Frequently Asked Questions about ux

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

FAQPage Schema
How do I create frontend interfaces that avoid generic design patterns?▼

Distinctive frontend interfaces require structured UX decisions across typography, color systems, responsive layouts, and motion to deliver production-ready web components with strong aesthetic direction.

What's the best way to design a SaaS dashboard that doesn't look AI-generated?▼

Designing a SaaS dashboard that avoids generic aesthetics requires applying intentional UX writing, interaction patterns, and visual quality principles to achieve a polished, production-grade user experience.

Can I use this approach to build accessible and responsive web applications?▼

Yes, building accessible and responsive web applications is supported through UX quality principles that address interaction design, motion, and responsive behavior for production-ready digital artifacts.

Does this UX design approach work for both web pages and digital posters?▼

Yes, this UX design approach applies to web components, pages, applications, posters, and digital artifacts, providing strong aesthetic direction and user experience decisions across various visual formats.

What do I need to know before implementing production-ready design systems?▼

Implementing production-ready design systems requires knowledge of typography, color systems, responsive layouts, accessibility standards, interaction design, motion, and UX writing to ensure polished frontend interfaces.

Related Skills

Explore More Design & Creative Skills→
truchottruchot
2

direction-artistique

Define visual identity, brand language, and governance for projects.

Community
Advanced
h4vzzh4vzz
33

Frontend Design

Generate accessible React, Vue, Svelte, or HTML components with design tokens.

Community
Advanced
tianguzhetianguzhe
1

frontend-design

Generate production-grade frontend interfaces with HTML, CSS, and React components.

Community
Advanced
alpoxdevalpoxdev
3

global-uiux-design

Orchestrate global UI/UX design tasks with WCAG 2.2 AA accessibility.

Community
Advanced