An interactive AWS architecture diagram builder — drag, drop, connect, and get AI-powered architecture reviews right in the browser.
Design AWS architectures visually without any cloud account needed. Drag services onto a canvas, connect them, then ask Claude AI to review your design for best practices, security gaps, and cost considerations.
| Feature | Description |
|---|---|
| Drag & drop canvas | Add EC2, S3, Lambda, RDS, and 15+ AWS services |
| Visual connections | Click to draw arrows between services |
| AI architecture review | Claude AI reviews your design for best practices |
| Save & load | Diagrams persist in browser LocalStorage |
| Export as PNG | Download your architecture as an image |
| Service search | Find AWS services quickly from the sidebar |
| Mini-map | Overview panel for large diagrams |
| Undo support | Ctrl+Z for mistake recovery |
→ cloud-architect-deploy.vercel.app
No installation needed — runs entirely in the browser.
- Design your architecture on the canvas
- Enter your Anthropic API key (
sk-ant-...) in the input field - Click ✨ AI Review — Claude analyses your diagram and returns feedback
Get a free API key at console.anthropic.com
# Clone the repo
git clone https://github.com/Shreyaaaaaak/cloud_architect.git
cd cloud_architect
# Open directly in browser — no server or install needed
open cloud_architect.htmlBrowser
│
├── HTML5 Canvas API ← renders the diagram
├── Vanilla JS ← drag-and-drop, connection logic
├── LocalStorage ← save/load diagrams
├── Canvas → PNG export ← screenshot utility
└── Anthropic Claude API ← AI review (client-side fetch)
No backend. No build step. Everything runs in a single HTML file.
- Frontend: HTML5, CSS3, Vanilla JavaScript
- Rendering: HTML5 Canvas API
- AI: Claude API (Anthropic) — client-side
- Storage: Browser LocalStorage
- Deployment: Vercel
cloud_architect/
├── cloud_architect.html # Entire app — canvas, logic, and styles
└── README.md
- Designing multi-tier AWS architectures (VPC, ALB, EC2, RDS)
- Studying for AWS certifications — visualise service relationships
- Creating architecture diagrams for project presentations
- Getting instant AI feedback on architecture decisions
- Diagrams stored in browser only (no account/cloud sync)
- Requires your own Anthropic API key for AI review
- Single-page app — no collaboration features yet
- Multi-cloud support (Azure, GCP icons)
- Shareable diagram links
- Pre-built architecture templates (3-tier web app, serverless, etc.)
- Backend storage with user accounts
- Export to AWS CloudFormation / Terraform
Shreya Kaushik — ECE @ KIIT University (2027)
GitHub · LinkedIn
MIT — open to fork and build on.