frontend-ui-ux

Create interfaces with aesthetic direction and anti-pattern avoidance.

1|Updated May 1, 2026
One-click install
npx skills add https://github.com/anhhung04/oh-my-secagent --skill frontend-ui-ux-anhhung04
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-ui-ux
Source: https://github.com/anhhung04/oh-my-secagent/tree/main/src/features/builtin-skills/frontend-ui-ux
Command: npx skills add https://github.com/anhhung04/oh-my-secagent --skill frontend-ui-ux-anhhung04

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill empowers designers to create stunning UI/UX experiences with precision, even without design mockups, ensuring intuitive interactions and pixel-perfect aesthetics.

Core Features & Use Cases

  • Design without Mockups: Create beautiful, cohesive interfaces with intent.
  • Visual Stunting: Emphasize visually striking and memorable design.
  • Aesthetic Guidelines: Follow guidelines for typography, color, motion, composition, and details.
  • Anti-Patterns Avoidance: Ensure originality and context-specific character in design.
  • Execution Complexity Matching: Match implementation complexity to aesthetic vision (maximalist or minimalist).
  • Use Case: Design an interactive webpage for a financial services platform with a clean, minimalist aesthetic, incorporating subtle micro-interactions.

Quick Start

Run the UI/UX skill with the 'create-ui' command for a new project and specify your aesthetic direction as 'minimalist' or 'maximalist'.

Frequently Asked Questions about frontend-ui-ux

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

FAQPage Schema
How do I design UI interfaces with a specific aesthetic direction without mockups?

To design UI interfaces without mockups, use a structured design process involving aesthetic choice, implementation, and anti-pattern avoidance. This framework ensures intuitive interactions and pixel-perfect aesthetics by emphasizing intentional direction over generic templates.

What is the best way to avoid clichés in interactive design?

The best way to avoid clichés in interactive design is to apply anti-pattern avoidance guidelines. This ensures originality and context-specific character by matching execution complexity to your aesthetic vision, whether maximalist or minimalist, while maintaining usability.

Can I use this framework for both minimalist and maximalist visual design?

Yes, you can use this framework for both minimalist and maximalist visual design. It explicitly matches implementation complexity to your aesthetic vision, providing tailored guidelines for typography, color, motion, and composition to execute either extreme effectively.

How do I start a new product design project using the create-ui process?

To start a new product design project, run the create-ui command and specify your intended aesthetic direction as either minimalist or maximalist. This initiates the structured design process, establishing guidelines for typography, composition, and micro-interactions.

Does this approach ensure brand aesthetic consistency across interface development?

Yes, this approach ensures brand aesthetic consistency across interface development. By providing strict aesthetic guidelines for typography, color, motion, and details, it aligns visual stunting and intentional design choices with your brand's specific character.