Skip to content

Minimal QASM-based circuit composer #286

@ryanhill1

Description

@ryanhill1

Task: Build a Minimal QASM-Based Quantum Circuit Composer (Visual ↔ Code)

We are looking for a lightweight, web-based quantum circuit composer that allows users to construct and edit a quantum circuit through a visual UI, while keeping an OpenQASM string as the underlying source of truth.

Think of this as a minimal version of tools like:

…but without simulation or probability calculations. The focus is purely on:

  • circuit construction
  • visualization
  • import/export of OpenQASM

This tool should make OpenQASM feel approachable, editable, and intuitive, even for users without a quantum background.


Core Requirements

The composer should support:

1. Visual circuit construction

  • A simple grid or lane-based UI
  • Ability to add and remove gates via clicks or menus
  • A small, minimal gate set is sufficient (e.g. H, X, CX, Measure)

2. Two-way synchronization

  • Visual edits update the OpenQASM string
  • Editing the OpenQASM string updates the visual circuit
  • OpenQASM is the canonical representation

3. Import / Export

  • Paste or load an OpenQASM string to visualize a circuit
  • Copy or download the generated OpenQASM string

4. No simulation required

  • No need to compute amplitudes or measurement probabilities
  • No physics or math background required

Implementation Notes

  • The frontend should be built using React (preferred), vanilla JavaScript, or another JS framework of your choice.
  • Contributors are welcome to optionally:
    • run a local FastAPI or other backend service
    • parse QASM into a frontend-friendly format
    • experiment with tools like pyqasm.unroll or ideas inspired by pyqasm.draw
  • Any backend choice is optional and up to the contributor.

Deliverables

  • A working web-based composer (local development setup is fine)
  • Clear instructions for running the project
  • PR description explaining:
    • supported gates
    • how the visual editor maps to QASM
    • known limitations

Screenshots or short screen recordings are highly encouraged.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions