Planify

Planify turns your software idea into a complete project plan — tech stack, task breakdown, and all — just by talking through it with AI.

Comment

Inspiration

Planning a software project is overwhelming — choosing the right tech stack, breaking ideas into actionable tasks, organizing sprints, and creating architecture docs. Most teams jump into coding without a plan, leading to scope creep and misalignment. We wanted to build a tool that bridges the gap between a raw idea and a structured project plan, powered by AI.

What it does

Planify is an AI-powered project planning assistant. You describe your software idea in natural language, and Planify generates a complete project plan — tech stack recommendations, epics, tasks with story points, custom Kanban columns, sprint schedules, and architectural artifacts (Markdown docs, Mermaid/PlantUML diagrams, Recharts charts, HTML mockups). It features a drag-and-drop Kanban board, threaded comments on issues, role-based collaboration (owner/editor/viewer), invite links, and an Architect Mode that guides you step-by-step through planning with AI-driven suggestions and user approval at each stage.

How we built it

  • Frontend: Next.js 16 (App Router, React 19, TypeScript, React Server Components), Tailwind CSS v4, shadcn/ui, lucide-react icons
  • Backend: Next.js API routes with server actions, PostgreSQL via Docker (port 5433), Prisma 7 ORM
  • Auth: JWT (jose) with HTTP-only cookies, bcryptjs for password hashing
  • AI Integration: OpenAI-compatible API through a backend proxy (configurable base URL, model, and API key) — 30+ AI tools for creating/updating issues, sprints, labels, status types, and artifacts
  • Drag & Drop: @dnd-kit/core for Kanban board
  • Diagrams: Mermaid (server-side validation via jsdom) and PlantUML (cloud validation)
  • Charts: Recharts for data visualizations
  • Deployment: Docker Compose for local PostgreSQL, ready for production deployment

Challenges we ran into

  • Building a robust tool-calling loop where the AI can create, update, and manage project entities in real-time while streaming responses via SSE
  • Implementing drag-and-drop Kanban with custom status columns that users can freely name and configure
  • Validating Mermaid and PlantUML diagram syntax server-side before storing artifacts
  • Architect Mode — designing a guided workflow where the AI suggests next steps and waits for user approval before proceeding
  • Role-based access control across all AI tools, ensuring viewers can only read and comment while editors and owners have full write access

Accomplishments that we're proud of

  • A fully functional AI agent with 30+ tools that can build out an entire project plan from a single sentence
  • Multi-artifact support (Markdown, Mermaid, PlantUML, Recharts, HTML mockups) with inline editing
  • Custom status column configuration with drag-and-drop Kanban
  • Secure collaboration model with invite links and role-based permissions (owner/editor/viewer)
  • Architect Mode that makes project planning feel like a guided conversation rather than a blank form
  • Clean, modern UI with dark/light theme support

What we learned

  • How to build SSE streaming endpoints for real-time AI responses with tool-call orchestration
  • Deep Prisma 7 patterns with PostgreSQL adapter for complex relational queries
  • Server-side diagram rendering and validation with Mermaid and PlantUML
  • Drag-and-drop state management with @dnd-kit across multiple droppable columns
  • Next.js 16 App Router patterns including parallel data fetching and server actions
  • JWT-based auth with HTTP-only cookies for secure session management

What's next for Planify

  • Real-time collaboration — live board updates when teammates move issues
  • Issue dependencies — blocked_by / blocks relationships with visual indicators
  • Burndown charts — auto-generated per sprint using Recharts
  • GitHub integration — webhook sync between issues and repos
  • Sprint velocity tracking — historical velocity metrics per sprint
  • Artifact version history — rollback support for all artifact types
  • Notification system — in-app alerts for assignments, comments, and sprint changes
  • Project templates — one-click starters for Web App, Mobile App, API Backend

Built With

Share this project:

Updates