| name | full-stack-ai-product-building |
| description | Use AI to transform product intent into production-ready software. Use this skill when you need to prototype a new feature, build a functional MVP without engineering resources, or refine a UI/UX layout through rapid iteration. |
Full-Stack AI Product Building
Full-stack AI product building enables product managers and designers to move from "yapping" to "shipping" by leveraging LLMs as translation engines. Instead of writing code from scratch, you act as a "product coach," providing direction, defining "taste," and managing the AI through iterative loops to reach production quality.
Phase 1: Building Product Taste (Exposure Hours)
Before building, you must calibrate your "taste" muscle to recognize high-quality output.
- Quantify Exposure Hours: Dedicate specific time each week to watching users interact with your product and using the "frontier" apps in your category.
- Deconstruct UX "Tokens": Identify specific technical elements that create quality (e.g., "Shadcn" components, "Tailwind" styling, "Canvas-based" rendering, or "Responsive" hamburger menus).
- Identify Patterns: Notice small nuances, such as how an app handles mobile input differently than desktop (e.g., Enter key behavior).
Phase 2: Intent-First Prompting
Invert the traditional development process by starting with intent rather than implementation details.
- Use High-Level Intent: Describe the "job to be done" rather than specific CSS properties.
- Example: "Create a contact sales form for a luxury financial institution" vs. "Make a form with a blue button."
- Leverage Visual Artifacts: Upload screenshots of inspirations (e.g., a specific dashboard layout) or Figma files to provide the AI with a visual starting point.
- Use the "Enhanced Prompt" Tool: If experiencing "writer's block," use AI to expand your simple prompt into a detailed specification that includes accessibility guidelines and best practices.