frontend-design
This skill guides the creation of distinctive, premium, production-grade frontend interfaces that command high monetary value. The goal is to escape the "generic AI slop" aesthetic and deliver interfaces that feel meticulously crafted, impossibly slick, and undeniably expensive.
When invoked, you must act as a Top-Tier Global Design Agency. Do not just "build a component." Architect a visceral user experience.
1. The Monetization Mindset (The "Steve Jobs" Standard)
Before writing a single line of code, commit to a bold aesthetic direction that screams "Premium":
- The $10,000 Feel: Does this interface feel like a cheap template, or does it feel like a bespoke product? Every pixel, shadow, and easing curve must feel intentional and expensive.
- The "Wow" Factor at First Paint: The user must be immediately arrested by the visual hierarchy. What is the defining characteristic? Is it brutalist typography? Glassmorphic depth? Silky smooth staggered entrances?
- Extreme Vibe Commitment: Pick a definitive lane and drive perfectly in it.
- Ultra-Minimal & Refined (Think: Teenage Engineering, Vercel, Linear)
- Maximalist & Cinematic (Think: Apple product pages, WebGL-heavy agency sites)
- Nostalgic / Brutalist (Think: Gumroad, Figma's brand identity)
- Zero "Bootstrap" Energy: Eliminate all traces of generic component library defaults.
2. Execution Directives
A. Typography (The Foundation of High-End UI)
More from panaversity/agentfactory
pptx
Presentation creation, editing, and analysis. When Claude needs to work with presentations (.pptx files) for: (1) Creating new presentations, (2) Modifying or editing content, (3) Working with layouts, (4) Adding comments or speaker notes, or any other presentation tasks
60quiz-generator
Generate 50-question interactive quizzes using the Quiz component with randomized batching. Use when creating end-of-chapter assessments. Displays 15-20 questions per session with immediate feedback. NOT for static markdown quizzes.
58assessment-architect
Generate certification exams for chapters or parts. Extracts concepts first, then generates scenario-based questions. Use "ch X" for chapter, "part X" for part.
53ai-collaborate-teaching
Design co-learning experiences using the Three Roles Framework (AI as Teacher/Student/Co-Worker). Use when teaching AI-driven development workflows, spec-first collaboration, or balancing AI assistance with foundational learning. NOT for curriculum without AI integration.
53content-evaluation-framework
This skill should be used when evaluating the quality of book chapters, lessons, or educational content. It provides a systematic 6-category rubric with weighted scoring (Technical Accuracy 30%, Pedagogical Effectiveness 25%, Writing Quality 20%, Structure & Organization 15%, AI-First Teaching 10%, Constitution Compliance Pass/Fail) and multi-tier assessment (Excellent/Good/Needs Work/Insufficient). Use this during iterative drafting, after content completion, on-demand review requests, or before validation phases.
52chapter-evaluator
Evaluate educational chapters from dual student and teacher perspectives. This skill should be used when analyzing chapter quality, identifying content gaps, or planning chapter improvements. Reads all lessons in a chapter directory and provides structured analysis with ratings, gap identification, and prioritized recommendations.
51