skills.rest
SunS1eep1ng
SunS1eep1ngCOMMUNITY
Explore all skills by this author →
GitHub

design-taste-frontend

Create premium UI/UX interfaces with strict design engineering rules.

Updated Jun 30, 2026
Search Tags:#UI/UX design#micro-interactions#design engineering#premium interface#AI-driven design#SaaS dashboard
One-click install
npx skills add https://github.com/SunS1eep1ng/codex-dotfiles --skill design-taste-frontend-suns1eep1ng
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-taste-frontend
Source: https://github.com/SunS1eep1ng/codex-dotfiles/tree/main/skills/design-taste-frontend
Command: npx skills add https://github.com/SunS1eep1ng/codex-dotfiles --skill design-taste-frontend-suns1eep1ng

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill addresses the challenge of creating non-generic, high-quality UI/UX interfaces by enforcing strict design engineering rules and avoiding AI-driven clichés.

Core Features & Use Cases

  • High-Agent Frontend Configuration: Defines baseline design parameters like variance, motion, and visual density.
  • Default Architecture & Conventions: Ensures consistency in framework, interactivity, state management, and styling.
  • Design Engineering Directives: Proactively corrects LLM biases in typography, color, layout, and interaction states.
  • Creative Proactivity: Implements advanced UI elements and interactions like Liquid Glass, Micro-physics, and Micro-Interactions.
  • Performance Guardrails: Ensures optimal performance through DOM cost, hardware acceleration, and z-index management.
  • Technical Reference: Provides detailed guidelines for design variance, motion intensity, and visual density levels.
  • AI TELLS: Outlines forbidden patterns and high-end inspiration for a unique, professional aesthetic.
  • Motion-Engine Bento Paradigm: Offers a modern, minimalistic SaaS dashboard design philosophy with perpetual motion.
  • Final Pre-Flight Check: Ensures all design and code elements adhere to best practices before output.

Quick Start

Generate a high-end UI/UX design with the design-taste-frontend skill, specifying your design variance, motion intensity, and visual density parameters.

Frequently Asked Questions about design-taste-frontend

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

FAQPage Schema
How do I create a premium SaaS dashboard without AI-driven design clichés?▼

You create a premium SaaS dashboard by enforcing strict design engineering rules that proactively correct LLM biases in typography, color, and layout, avoiding generic AI-driven clichés through advanced UI principles and technical guardrails.

What are micro-interactions and how do they improve UI/UX design?▼

Micro-interactions are advanced UI elements and animations like Liquid Glass and Micro-physics that enhance UI/UX design by adding creative proactivity and dynamic feedback to digital interfaces through perpetual motion.

Does this approach support high-agent frontend configuration for visual density and motion?▼

Yes, high-agent frontend configuration defines baseline design parameters including variance, motion intensity, and visual density levels, ensuring optimal performance through DOM cost management, hardware acceleration, and z-index control.

How do I ensure my UI/UX development avoids forbidden patterns and maintains a professional aesthetic?▼

Ensure professional aesthetics in UI/UX development by following AI TELLS guidelines that outline forbidden patterns and provide high-end inspiration, with a final pre-flight check verifying all design and code elements adhere to best practices before output.

What is the Motion-Engine Bento Paradigm for modern SaaS dashboard design?▼

The Motion-Engine Bento Paradigm is a modern, minimalistic SaaS dashboard design philosophy that utilizes perpetual motion and advanced micro-interactions to create a unique, professional aesthetic while maintaining strict technical performance guardrails.

Can I use design engineering directives to manage technical guardrails in frontend development?▼

Yes, design engineering directives proactively correct LLM biases in typography, color, layout, and interaction states while maintaining technical performance guardrails for DOM cost, hardware acceleration, and z-index management in frontend development.

Related Skills

Explore More Design & Creative Skills→
zakad00e2zakad00e2

design-taste-quiet-luxury

Design quiet luxury user interfaces with tailored baseline configurations for aesthetics and interaction.

Community
Advanced
IldeeyIldeey

design-taste-frontend

Provides AI-driven frontend development guidelines for high-end UI/UX and performance optimization.

Community
Advanced
lagarcesslagarcess
1

design-taste-frontend

Enforce React and Next.js design conventions with Tailwind and motion isolation.

Community
Advanced
rod97-1rod97-1
1

minimalist-ui

Generate ultra-minimalist editorial web interfaces with warm monochrome palettes and bento-grid layouts.

Community
Advanced