Inspiration

The journey into quantum computing often begins with a steep, intimidating cliff face of complex mathematics and abstract physics. We were inspired by the desire to flatten this curve. We asked ourselves: "How can we make the fascinating world of quantum mechanics, with its concepts of superposition (∣ψ⟩=α∣0⟩+β∣1⟩) and entanglement, as intuitive and accessible as building with LEGOs?" We envisioned a tool that would empower students, developers, and researchers to experiment with quantum circuits without getting bogged down by boilerplate code, turning the abstract into something tangible and interactive. QClassiQ was born from this vision to democratize access to the quantum future.

What it does

QClassiQ is an interactive, web-based platform that makes quantum computing accessible to everyone. It replaces complex command-line tools and boilerplate code with a beautiful, intuitive graphical interface. Users can visually build quantum circuits by selecting qubits, layers, and gates from simple menus.

With a single click, the application sends the circuit design to a powerful Flask and Qiskit backend, which runs a real-time quantum simulation. The results, including a high-quality circuit diagram and a probability distribution chart of the quantum states, are instantly displayed back to the user. This provides immediate, visual feedback, turning abstract quantum concepts into tangible, interactive experiments.

How we built it

QClassiQ is built on a modern, robust technology stack designed for performance and user experience.

The Frontend: We chose React and Vite to create a fast, responsive, and visually appealing user interface. The interactive circuit builder allows users to dynamically select gates, and we used the Recharts library to instantly visualize the probabilistic outcomes of the quantum simulations. The entire UI is styled with custom CSS, featuring a sleek, dark theme with animated elements to create an engaging experience.

The Backend: At the core of our application is a powerful Flask API. This backend receives the circuit specifications from the frontend, then leverages the industry-standard Qiskit library to construct and execute the quantum circuits. We used Qiskit's AerSimulator to run high-performance simulations and Matplotlib to generate clear, high-quality diagrams of the circuits, which are then sent back to the user.

Challenges we ran into

Our biggest challenge was the series of Python import and environment errors on the backend. Integrating matplotlib for circuit drawing in a "headless" server environment proved to be particularly tricky, as it's not designed for non-GUI use out of the box. We systematically debugged issues related to module paths, package dependencies (pylatexenc), and matplotlib backends. Overcoming these hurdles taught us invaluable lessons in Python package management and how to configure libraries for server-side execution, making our final solution much more robust.

Accomplishments that we're proud of

We are incredibly proud of building a full-stack application that seamlessly bridges the gap between a complex quantum computing engine and a user-friendly web interface. Our biggest accomplishment is creating the interactive circuit builder and a backend that can dynamically interpret user designs, run genuine quantum simulations, and visualize the results in real-time.

Successfully debugging the various layers of the application—from frontend state management in React to Python environment issues and matplotlib rendering on the server—was a major challenge that we are proud to have overcome. We've created a polished, stable, and powerful educational tool from the ground up.

What we learned

This hackathon was an incredible learning experience. We dove deep into the practicalities of full-stack development, from architecting a RESTful API with Flask to managing state in a complex React application. On the quantum side, we moved beyond theory and learned how to programmatically build, simulate, and interpret the results of quantum circuits using Qiskit. Most importantly, we learned how to bridge the gap between a powerful backend engine and a user-friendly frontend, creating a seamless and intuitive product.

What's next for QClassiQ

The future of QClassiQ is focused on expanding its power and utility for both educational and research purposes. Our roadmap includes:

Expanded Gate Library: Adding a wider variety of quantum gates, including parameterized gates (like Rotation-Y) and multi-qubit gates, to allow for more complex algorithm design.

Circuit Saving & Sharing: Implementing user accounts and a database to allow users to save their circuits, share them with a unique link, and build a community library of quantum algorithms.

Integration with Real Quantum Hardware: Providing an option to send circuits to be run on actual quantum computers through cloud services like IBM Quantum Experience.

Educational Resources: Integrating tutorials, challenges, and detailed explanations for each quantum gate to guide new users on their learning journey.

Built With

Share this project:

Updates