Sketch-to-Stack

Sketch-to-Stack is an AI-powered architecture design and analysis platform where users: Visually create system diagrams using drag-and-drop components Connect services to represent real data flow and dependencies Click Analyze to receive: Architecture pattern detection Bottlenecks & single points of failure Security risks Scalability insights Actionable improvement recommendations All powered by Google Gemini AI and delivered in a ChatGPT-style conversational interface.

How we built it We designed a full-stack AI SaaS architecture: Frontend: Next.js, React, Tailwind CSS, React Flow for interactive diagramming Backend: FastAPI with JWT authentication, rate limiting, and monitoring AI Engine: Google Gemini for structured architecture analysis Database: SQLite (development) with PostgreSQL-ready schema Caching & Performance: Redis-ready design and optimized API handling The system converts diagram JSON → AI reasoning → conversational insights.

Challenges we ran into

Migrating from deprecated Gemini SDK to the latest API Handling frontend–backend schema mismatches without crashes Designing AI prompts that return structured, reliable analysis Creating a ChatGPT-like UX instead of raw technical output Managing CORS, environment configs, and real-time debugging during integration

Accomplishments that we're proud of

Built a production-style full-stack AI platform, not just a prototype Achieved real-time architecture intelligence from visual diagrams Delivered a clean conversational AI experience for system design learning Designed the foundation for a deployable SaaS product Solved complex integration issues across AI, backend, and frontend

What we learned

How to integrate LLMs into real engineering workflows, not just chat apps Importance of structured prompts and error-safe APIs Building scalable full-stack architectures with security and monitoring Creating human-friendly AI UX that developers actually enjoy using Debugging real production-style issues across multiple layers

What’s next for Sketch-to-Stack

Multi-turn AI conversations for deeper architecture guidance Export to Terraform, Docker Compose, and Kubernetes YAML Cost estimation and cloud-specific deployment insights Real-time collaboration like Figma for system design Public SaaS launch for students, developers, and tech teams

Built With

• fastapi
• googlegeminiai
• jwtauth
• next.js
• postgresql
• python
• react
• reactflow
• redis
• sqlite
• tailwindcss