// Project figures — minimalist SVGs that hint at architecture/idea. // All consume `currentColor` so they pick up theme tokens. const Frame = ({ children, label, viewBox = "0 0 400 220" }) => ( {label && ( {label} )} {children} ); // QUBOTS — composition: problem ⨉ optimizer → result, with shareable artifacts const QubotsFigure = () => ( {/* Problem node */} PROBLEM VRPTW {/* Optimizer node */} OPTIMIZER QAOA · GA · Tabu {/* arrows to runtime */} {/* runtime */} RUNTIME .optimize() {/* result */} RESULT obj ↓ {/* shared registry header */} REGISTRY · github / pypi {/* artifact pills */} {[ { x: 10, t: "auto-problem" }, { x: 100, t: "auto-optimizer" }, { x: 195, t: "benchmark" }, { x: 270, t: "pipeline" }, ].map((p,i)=>( {p.t} ))} ); // AUTORESEARCH — minimization run: discarded vs kept vs running best const AutoresearchFigure = () => { const W = 320, H = 138, X0 = 50, Y0 = 38; const N = 130; // deterministic pseudo-random const rand = (s) => { let x = Math.sin(s * 9301 + 49297) * 233280; return x - Math.floor(x); }; // generate experiments: most are noisy, some are kept improvements // score range: ~1.7 down to ~0.13 (lower is better) const points = []; let best = 1.7; const keptIdx = new Set([0, 1, 3, 5, 7, 10, 13, 15, 17, 19, 22, 28, 33, 41, 49, 88]); for (let i = 0; i < N; i++) { let score; if (keptIdx.has(i)) { // monotone decreasing kept improvements const decay = Math.exp(-i / 12); score = 0.13 + (1.6 * decay) + (rand(i) - 0.5) * 0.04; best = Math.min(best, score); } else { // discarded: scattered above the running best, mostly higher const floor = Math.max(best, 0.18); score = floor + rand(i + 100) * (1.0 - i/N * 0.6) + 0.05; if (score > 1.65) score = 1.65 - rand(i+200) * 0.3; } points.push({ i, score, kept: keptIdx.has(i), best }); } // axes const yMin = 0, yMax = 1.8; const xMax = N; const sx = (i) => X0 + (i / xMax) * W; const sy = (s) => Y0 + H - ((s - yMin) / (yMax - yMin)) * H; // running best step path let bestSoFar = 1.8; const stepPts = []; for (let i = 0; i < N; i++) { if (points[i].kept && points[i].score < bestSoFar) { stepPts.push([i, bestSoFar]); // horizontal segment to here stepPts.push([i, points[i].score]); // drop down bestSoFar = points[i].score; } } stepPts.push([N - 1, bestSoFar]); const stepD = stepPts.map((p, idx) => `${idx===0?"M":"L"} ${sx(p[0])} ${sy(p[1])}`).join(" "); // y ticks const yTicks = [0.2, 0.4, 0.6, 0.8, 1.0, 1.2, 1.4, 1.6]; const xTicks = [0, 20, 40, 60, 80, 100, 120]; return ( {/* gridlines */} {yTicks.map((t, i) => ( ))} {xTicks.map((t, i) => ( ))} {/* axes */} {/* y tick labels */} {yTicks.map((t, i) => ( {t.toFixed(1)} ))} {/* x tick labels */} {xTicks.map((t, i) => ( {t} ))} {/* axis labels */} Score (lower is better) Experiment # {/* discarded points */} {points.filter(p => !p.kept).map((p, i) => ( ))} {/* running best step line */} {/* kept points (on top) */} {points.filter(p => p.kept).map((p, i) => ( ))} {/* legend */} Discarded Kept Running best ); }; // RASTION — services / hub architecture const RastionFigure = () => ( {/* clients top */} {["Web UI","Qubots SDK","AI agent"].map((t,i)=>( {t} ))} {/* arrows down */} {[0,1,2].map(i=>( ))} {/* api gateway */} REST · MCP gateway {/* services row */} {[ { t: "registry", a: "components" }, { t: "orchestrator", a: "runs" }, { t: "store", a: "results" }, ].map((s,i)=>( {s.t} {s.a} ))} {/* db */} postgres ); // OPTIMIZATION-AGENTS — agent loop const OptAgentsFigure = () => ( {/* center: LLM */} PLANNER LLM {/* nodes around */} {[ { x: 30, y: 50, t: "1 · perceive", s: "instance read" }, { x: 290, y: 50, t: "2 · choose", s: "select solver" }, { x: 290, y: 150, t: "3 · execute", s: "solver.run()" }, { x: 30, y: 150, t: "4 · reflect", s: "score & adapt" }, ].map((n,i)=>( {n.t} {n.s} ))} {/* loop arrows */} ); // OR-MCP — protocol bridge const OrMcpFigure = () => ( {/* AI assistant left */} AI ASSISTANT Claude · GPT natural language {/* MCP gateway center */} MCP SERVER or-mcp tool router {/* OR tools right */} {["solve_tsp","route_vrp","schedule","assign","pack"].map((t,i)=>( {t} () ))} {/* arrows */} ); const ProjectFigure = ({ id }) => { if (id === "qubots") return ; if (id === "autoresearch") return ; if (id === "rastion") return ; if (id === "opt-agents") return ; if (id === "or-mcp") return ; return null; }; // ── PUBLICATION FIGURES ──────────────────────────────────────────────── // VRPTW · qubit-efficient encoding (2024 publication) const VrptwQubitFigure = () => { const D = { x: 95, y: 110 }; const routes = [ { c: "#5b9bf2", nodes: [{x: 65, y: 50, l: "10"}, {x: 90, y: 38, l: "11"}, {x: 120, y: 55, l: "9"}] }, { c: "#48b46b", nodes: [{x: 38, y: 92, l: "2"}, {x: 50, y: 130, l: "4"}, {x: 30, y: 152, l: "3"}] }, { c: "#f29044", nodes: [{x: 122, y: 100, l: "5"}, {x: 138, y: 80, l: "6"}, {x: 152, y: 65, l: "7"}, {x: 138, y: 48, l: "8"}] }, { c: "#e8c84d", nodes: [{x: 65, y: 156, l: "14"}, {x: 95, y: 168, l: "12"}, {x: 130, y: 148, l: "13"}] }, ]; const rows = [ { txt: "{D,10,11,9,D}", c: "#5b9bf2", n: 1, x: "x₀" }, { txt: "{D,2,4,3,D}", c: "#48b46b", n: 2, x: "x₁" }, { txt: "{D,6,5,7,8,D}", c: "#f29044", n: 3, x: "x₂" }, { txt: "{D,14,12,13,D}", c: "#e8c84d", n: 4, x: "x₃" }, ]; return ( {routes.map((r, i) => { const pts = [D, ...r.nodes, D]; const d = pts.map((p, j) => `${j === 0 ? "M" : "L"} ${p.x} ${p.y}`).join(" "); return ; })} {routes.map((r, i) => r.nodes.map((n, k) => ( {n.l} )))} Depot ROUTES → BINARY VARS {rows.map((r, i) => ( {r.txt} Route {r.n} {r.x} ))} Optimal: x = [1,1,1,1]ᵀ x_i ∈ {`{0,1}`} · n qubits = log₂(N)+1 ); }; // MSc thesis · QUBO + minimal encoding + RL enhancement (2023) const MscThesisFigure = () => ( {/* QUBO matrix */} {Array.from({length: 5}).map((_, r) => Array.from({length: 6}).map((_, c) => ( )) )} QUBO matrix {/* minimal encoding */} MINIMAL ENCODING {["x₀|00⟩", "x₁|01⟩", "x₂|10⟩", "x₃|11⟩"].map((t, i) => ( {t} ))} 3 qubits · n_c = 4 {/* QPU circuit */} CPU / QPU {[0, 1, 2, 3].map(r => ( ))} {[10, 24, 38, 52].map((x, i) => ( ))} θ → C_me(θ) {/* ADAM */} ADAM min C_me(θ) {/* updating feedback arrow */} {/* RL bottom row header */} GPU-ENHANCED RL SEARCH {/* Exploration */} EXPLORATION {[0.40, 0.72, 0.50, 0.92, 0.32, 0.62].map((h, i) => ( ))} softmax(R) → sample {/* Exploitation */} EXPLOITATION {[0.55, 0.46, 0.86, 0.40, 0.65, 0.52].map((h, i) => ( ))} argmax UCB {/* Reward / leaderboard */} REWARD · LEADERBOARD 99th pct cost C ↓ over time ); // Diploma thesis · QAOA / Gibbs objective convergence (2021) const DiplomaThesisFigure = () => { const X0 = 56, Y0 = 38, W = 290, H = 132; const xMax = 7, yMax = 2.7; const sx = (p) => X0 + ((p - 1) / (xMax - 1)) * W; const sy = (v) => Y0 + H - (v / yMax) * H; const curves = [ { eta: "η=500", c: "#3a3a3a", pts: [2.55, 1.10, 0.66, 0.36, 0.20, 0.10, 0.05] }, { eta: "η=250", c: "#d4b73a", pts: [2.50, 1.08, 0.60, 0.34, 0.19, 0.09, 0.045] }, { eta: "η=100", c: "#9e4ec9", pts: [2.50, 1.06, 0.58, 0.34, 0.19, 0.09, 0.04] }, { eta: "η=50", c: "#22cdd1", pts: [2.50, 1.06, 0.58, 0.34, 0.19, 0.09, 0.04] }, { eta: "η=1", c: "#3fb364", pts: [2.50, 1.04, 0.58, 0.32, 0.18, 0.08, 0.03] }, { eta: "η=0.1", c: "#e64545", pts: [1.95, 0.90, 0.50, 0.30, 0.16, 0.08, 0.03] }, { eta: "η=0.01", c: "#3da6ff", pts: [0.42, 0.18, 0.13, 0.10, 0.07, 0.04, 0.02] }, ]; return ( {/* gridlines */} {[0, 0.5, 1.0, 1.5, 2.0, 2.5].map((t, i) => ( ))} {[1,2,3,4,5,6,7].map((t, i) => ( ))} {/* axes */} {/* y ticks */} {[0, 0.5, 1.0, 1.5, 2.0, 2.5].map((t, i) => ( {t.toFixed(1)} ))} {[1,2,3,4,5,6,7].map((t, i) => ( {t} ))} {/* axis labels */} Gibbs objective f(η) QAOA depth p {/* curves */} {curves.map((c, ci) => { const d = c.pts.map((v, i) => `${i === 0 ? "M" : "L"} ${sx(i+1)} ${sy(v)}`).join(" "); return ( {c.pts.map((v, i) => ( ))} ); })} {/* legend */} {curves.map((c, i) => ( {c.eta} ))} ); }; const PublicationFigure = ({ id }) => { if (id === "vrptw-pub-2024") return ; if (id === "msc-thesis-2023") return ; if (id === "diploma-thesis-2021") return ; return null; }; window.ProjectFigure = ProjectFigure; window.PublicationFigure = PublicationFigure;