Can it help with mobile-first development?

Yes, it utilizes fluid layouts, relative units, and content-based media queries to ensure interfaces are optimized for both touch and desktop users.

Which tech stack does this design skill work best with?

It is optimized for modern web development using Tailwind CSS, shadcn/ui components, Phosphor icons, and Framer Motion.

Does it follow web accessibility standards?

Yes, it prioritizes WCAG 2.1 AA compliance, focusing on color contrast, keyboard navigability, and semantic HTML.

Does this skill automatically change my code's styling?

No. The UX Designer skill follows a strict 'Always Ask' protocol, requiring explicit user approval before making any design decisions or style changes.

How does it help avoid generic 'AI-looking' designs?

It explicitly avoids default training data patterns like excessive Bauhaus or Apple-clone styles, instead suggesting unique color pairs, patterns, and historical design inspirations.

UX Designer

Name: UX Designer
Author: Cornjebus

byCornjebus

デザインツール

Guides the creation of unique, accessible, and user-centered interfaces with a focus on non-generic design patterns.

概要

The UX Designer skill transforms Claude into a specialized design consultant capable of crafting distinctive and functional user interfaces. It emphasizes breaking away from generic, AI-generated aesthetics by focusing on material honesty, purposeful typography, and sophisticated color palettes. Built with a strict 'ask-first' protocol for design decisions, it provides deep expertise in responsive layouts, interaction physics, and accessibility standards while leveraging modern tools like shadcn/ui and Tailwind CSS to ensure production-grade implementation.

主な機能

Strict design decision protocol that prioritizes user collaboration and approval before implementation.
Optimized implementation patterns for shadcn/ui components, Tailwind CSS, and Phosphor icons.
Subtle motion design principles using Framer Motion and CSS for purposeful user feedback.
0 GitHub stars
Comprehensive typography and color systems based on mathematical ratios and WCAG accessibility standards.
Anti-generic aesthetic guidance to create distinctive interfaces that stand out from standard SaaS patterns.

ユースケース

Designing a unique brand identity and component library for a new web application.
Establishing a coherent design language including typography, color palettes, and spatial grids.
Refactoring generic UI components into high-quality, accessible, and mobile-responsive interfaces.

概要

主な機能

Strict design decision protocol that prioritizes user collaboration and approval before implementation.
Optimized implementation patterns for shadcn/ui components, Tailwind CSS, and Phosphor icons.
Subtle motion design principles using Framer Motion and CSS for purposeful user feedback.
0 GitHub stars
Comprehensive typography and color systems based on mathematical ratios and WCAG accessibility standards.
Anti-generic aesthetic guidance to create distinctive interfaces that stand out from standard SaaS patterns.

ユースケース

Designing a unique brand identity and component library for a new web application.
Establishing a coherent design language including typography, color palettes, and spatial grids.
Refactoring generic UI components into high-quality, accessible, and mobile-responsive interfaces.