System design is one of the most challenging skills to master for software engineers. While drawing diagrams helps, understanding the trade-offs, bottlenecks, and fault-tolerance of a design requires real feedback. That's why I built **ArchLens**—a drag-and-drop system design tool with an AI evaluation engine that scores architectures on scalability.
The Architecture of ArchLens
ArchLens is built on top of a highly responsive frontend and a robust backend evaluating infrastructure components.
- **Frontend**: Next.js and React Flow for the drag-and-drop canvas interface.
- **AI Evaluation**: Integrating Google Gemini models to parse the generated nodes and connections, evaluating network topology, single points of failure (SPOFs), and caching layers.
- **Database**: PostgreSQL storing saved designs and user feedback.
Key Challenges
- **Real-Time Graph State**: Syncing the React Flow graph state with the AI evaluation pipeline without lagging.
- **Topological Analysis**: Writing algorithms to represent network diagrams in a format that LLMs can accurately evaluate.
By using structured schemas and prompts, I achieved reliable architecture audits that help developers improve their designs instantly. Check it out at [archlens.ajinkyadhotre.com](https://archlens.ajinkyadhotre.com)!