design-prd

# Generate PRD Skill Create detailed, actionable Product Requirements Documents through structured conversation, informed by codebase analysis and competitive research. --- ## Step 0: Auto-Detect Project Context Before writing any PRD, understand the project from its source code. ### 0a. Detect Tech Stack Read `package.json` (or equivalent) to extract: - **Framework**: Next.js, Remix, SvelteKit, Nuxt, Django, Rails, etc. - **UI library**: React, Vue, Svelte, Angular - **Database**: Supabase, Prisma, Drizzle, raw SQL - **Auth**: Supabase Auth, NextAuth, Clerk, Auth0 - **State management**: TanStack Query, Zustand, Redux, Pinia - **CSS**: Tailwind, CSS Modules, Styled Components ### 0b. Discover Existing Features ``` Glob: **/app/**/page.tsx → Next.js routes (features) Glob: **/features/*/ → Feature directories Glob: **/src/routes/**/*.tsx → Route-based features Grep: pattern "export default" glob "**/page.tsx" output_mode "files_with_matches" ``` Read feature READMEs if they exist: ``` Glob: **/*README*.md → Feature docs Glob: **/docs/*.md → Documentation ``` ### 0c. Discover Data Model ``` Glob: **/supabase/migrations/*.sql → SQL migrations Glob: **/prisma/schema.prisma → Prisma schema Glob: **/drizzle/schema.ts → Drizzle schema Glob: **/types/*.ts → TypeScript type definitions ``` ### 0d. Check for Existing PRDs ``` Glob: **/tasks/prd-*.md → Existing PRDs Glob: **/docs/prd-*.md → Existing PRDs (alt location) Glob: **/specs/*.md → Spec documents ``` ### 0e. Rec...