design
Premium UI Design & Implementation
A comprehensive guide to premium UI design and implementation. Part 1 establishes design direction, Part 2 covers craft principles, and Part 3 provides the 9-phase implementation approach.
Part 1: Design Direction (REQUIRED)
Before writing any code, commit to a design direction. Don't default. Think about what this specific product needs to feel like.
Think About Context
- What does this product do? A finance tool needs different energy than a creative tool.
- Who uses it? Power users want density. Occasional users want guidance.
- What's the emotional job? Trust? Efficiency? Delight? Focus?
- What would make this memorable? Every product has a chance to feel distinctive.
SaaS ≠ Marketing. A SaaS product isn't a landing page. Marketing sites sell with visuals and emotion. Product interfaces serve with clarity and function. Resist the urge to make things "pop"—make them work. Glass morphism, gradients, and glow effects are spices, not the meal. The meal is information hierarchy, fast interactions, and clear feedback.
More from mcouthon/agents
makefile
Use when creating Makefiles for process lifecycle management with PID tracking, logging, and status monitoring. Triggers on: 'use makefile mode', 'makefile', 'create makefile', 'process management', 'background jobs', 'start/stop services'. Full access mode - can create/modify Makefiles.
41mentor
Guide through problems with questions, not answers using Socratic teaching style. Use when asked to teach, explain concepts through discovery, help learn, or guide understanding without giving direct solutions. Triggers on: 'use mentor mode', 'teach me', 'help me understand', 'guide me', 'mentor', 'I want to learn', 'explain by asking', 'Socratic', 'don't give me the answer'. Read-only mode - explores and guides but doesn't write code.
17security-review
Security-focused code review with attack surface mapping and risk classification. Use when reviewing PRs for security, auditing code changes, or analyzing potential vulnerabilities. Triggers on: 'security review', 'use security mode', 'audit this', 'check for vulnerabilities', 'is this secure', 'attack surface', 'threat model', 'security check'. Read-only mode - identifies issues but doesn't fix them.
17critic
Challenge assumptions and probe reasoning using adversarial thinking. Use when asked to find weaknesses, challenge a design, identify edge cases, or stress-test an approach. Triggers on: 'use critic mode', 'challenge this', 'find weaknesses', 'what could go wrong', 'critic', 'devil's advocate', 'poke holes', 'stress test', 'what am I missing', '5 whys'. Read-only mode - questions and probes but doesn't provide solutions.
13tech-debt
Use when finding code smells, auditing TODOs, removing dead code, cleaning up unused imports, or assessing code quality. Triggers on: 'use tech-debt mode', 'tech debt', 'code smells', 'clean up', 'remove dead code', 'delete unused', 'simplify'. Full access mode - can modify files and run tests.
13deep-research
Exhaustive investigation with citations and structured findings. Use when thorough coverage is needed, all sources must be cited, or research will inform critical decisions. Triggers on: 'use deep-research mode', 'deep research', 'exhaustive investigation', 'thorough research', 'cite all sources', 'comprehensive analysis', 'leave no stone unturned', 'research everything'. Read-only mode - investigates and documents but doesn't modify code.
13