smithery/yuniorglez

ui-ux-pro

Senior UI/UX Architect & Design Systems Specialist. Expert in Anti-AI Slop aesthetics, Bold Minimalism, and Production-Grade Interfaces.

Installation

$ npx skills add smithery/yuniorglez --skill ui-ux-pro

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

Also in this package

Other skills from smithery/yuniorglez · top by installs.

npx skills add smithery/yuniorglez

Browse all from smithery/yuniorglez

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Skill metadata

Parsed from SKILL.md frontmatter.

Version1.1.0

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 4,139 B
  • docs SUMMARY.md 158 B

History

  1. First recorded snapshot · 0 installs

SKILL.md

🎨 Skill: UI/UX Pro (v1.2.0)

Executive Summary

The ui-ux-pro is the visionary architect of the user experience. In 2026, design is no longer just about aesthetics; it is about Impeccable Craftsmanship, Intentionality, and Human-Grade Production. This skill focuses on building high-end interfaces that eradicate "AI Slop" by choosing bold, distinctive directions and executing them with technical precision (OKLCH, Container Queries, Fluid Motion).


📋 Table of Contents

  1. [Core Design Philosophies](#core-design-philosophies)
  2. [The "Do Not" List (Anti-Patterns)](#the-do-not-list-anti-patterns)
  3. [Anti-AI Slop Protocol](#anti-ai-slop-protocol)
  4. [Modern Layout Patterns](#modern-layout-patterns)
  5. [Tactile Visual Styles (Optional)](#tactile-visual-styles-optional)
  6. [Design-to-Code Protocol](#design-to-code-protocol)
  7. [Reference Library](#reference-library)

🏛️ Core Design Philosophies

  1. Impeccable DNA: Adhere to the standards in IMPECCABLE_DNA.md. Prioritize uniqueness over templates.
  2. Intentional Tonality: Choose a bold extreme (e.g., Brutally Minimal, Editorial, Industrial) and stay consistent.
  3. AX-First Architecture: Ensure the UI is navigable by both humans and AI agents.
  4. Fluid Precision: Use clamp() for spacing/type and natural easing for motion.
  5. Resilient Craft: Design for the "Unideal" (long text, slow networks, RTL).

🚫 The "Do Not" List (Anti-Patterns)

Anti-Pattern Why it fails in 2026 Modern Alternative
AI Slop Aesthetics Generic purple gradients, glassmorphism-by-default. Distinctive Brand Direction.
Inter/Roboto Default Looks like a generic template/AI output. High-Character Typography.
Identical Card Grids Lazy layout shorthand; visually monotonous. Asymmetric/Varied Spacing.
Emoji-Only UI Lacks professional depth and scalability. SVG Systems / Custom Icons.
Fixed Constraints Breaks on non-standard viewports. Container Queries & Flex.

💎 Anti-AI Slop Protocol

Before shipping any UI, perform the Quality Audit:

  • Typography: Is this font overused (Inter/Roboto)? If so, replace with a distinctive pairing.
  • Color: Are we using the "AI Purple/Cyan" palette? If so, shift to a purposeful oklch() palette.
  • Layout: Does it look like a generic dashboard? If so, introduce asymmetry or "Bolder" contrast.
  • The Test: Would a human believe an AI made this immediately? If yes, REWORK.

💧 Tactile Visual Styles (Use Sparingly)

Styles like Glassmorphism and Neumorphism should be used only when they serve a clear Functional Purpose (e.g., depth in complex layering), never as decorative filler.

Glassmorphism v3

  • Backdrop Blur: Use backdrop-blur-xl for depth, not just "vibes".
  • Edge Light: 1px semi-transparent borders to define structure.

Neumorphism v2

  • Muted Tactility: Subtle, low-contrast "pressed" effects.
  • Hybrid Style: Combining glass and neumorphism for maximum depth.

🤖 AI-Adaptive Interfaces

  • Dynamic Themes: Adapting color and tone based on session sentiment.
  • Component Swapping: Replacing UI elements based on user struggle signals.

📖 Reference Library

Detailed deep-dives into UI/UX Excellence:

  • [Impeccable DNA](../expert-instruction/references/IMPECCABLE_DNA.md): High-fidelity design standards.
  • [Bento Grid Architecture](./references/bento-grid-architecture.md): Modular layout design.
  • [Neumorphism v2](./references/neumorphism-v2-clean.md): Modern tactile aesthetics.
  • [Glassmorphism v3](./references/glassmorphism-v3-functional.md): Smart functional depth.
  • [AI-Adaptive Layouts](./references/ai-adaptive-layouts.md): The future of personalized UI.

Updated: January 22, 2026 - 20:00