Introduction — whiteboard for driving scenarios

drawtonomy is a whiteboard for driving scenarios — self-driving (AV), autonomous driving (AD), and ADAS alike. It runs on one pipeline: draw the scene, then make it move. You sketch the road and the actors on an infinite canvas, and the very same scene becomes a runnable OpenSCENARIO storyboard — phases, events, and triggers that play in the browser on esmini compiled to WebAssembly, with a PASS / FAIL verdict at the end. What you draw is what runs; there is no export step or second tool in between.

Lanes, intersections, vehicles, pedestrians, traffic lights, road markings, and crosswalks are built-in shapes. Lanes are topology-aware — they carry Next / Previous / Left / Right connections — so the diagram is a network you can edit, not a picture you redraw whenever the road geometry changes.

The app is at drawtonomy.com. The SDK, extensions, and source for this docs site are on GitHub.

What do you want to do?

Pick the entry point that matches what you came here for.

• I want a diagram — a figure for a paper or slide, a sketch for a design review, an ADAS test-scenario diagram. Start with the Quickstart, then the tutorials, and browse the use cases to see if yours is one of them.
• I want a scenario that runs — build a storyboard, set PASS / FAIL conditions, and play it in the browser. Go to Build your first scenario, then the full scenario editor section.
• I already have a .xosc — open it, inspect the logic, and play it (or share it by GitHub link). See Open and play an existing .xosc.
• My scenarios live on GitHub — install the drawtonomy for GitHub Chrome extension and .xosc files play in place on github.com, so a scenario can be reviewed without cloning the repository or installing a simulator.
• I need to move data in or out — export ASAM OpenDRIVE, or import a Lanelet2 OSM map or a ROS occupancy grid. See Bridges to your simulation and mapping stack.

What people use it for

• Figures for papers, theses, and technical reports. Vector output (drawtonomy.svg, PDF, EPS) that embeds cleanly in LaTeX, Markdown, and slide decks.
• Slides and presentations. Diagrams of lane-change manoeuvres, intersections, occlusion cases, and other driving scenarios — drawn in seconds rather than minutes per shape.
• Design and algorithm discussions. A shared sketch surface for talking through driving behaviour, edge cases, and safety arguments with teammates.
• Scenario authoring and playback. Build an OpenSCENARIO storyboard — phases, events, actions, triggers — run it in the browser on esmini-WASM, and read the PASS / FAIL verdict. Or import an existing .xosc, edit it visually, and replay it.
• Map and ROS annotation. Trace lanes over a satellite background, edit Lanelet2 OSM maps, or annotate a ROS occupancy grid with paths and obstacles.

Who this is for

• Autonomous-driving (AD) and ADAS engineers drawing diagrams for internal docs, design reviews, and incident write-ups.
• Self-driving / AV researchers and students producing figures for papers, theses, and conference talks — including driverless vehicle behaviour studies and AV safety analyses.
• Scenario authors working with simulators like esmini, CARLA, or in-house tools.
• HD-map and Lanelet2 users sketching changes against an existing road network.
• ROS and robotics teams drawing on top of occupancy grids built with nav2, Cartographer, or Gmapping.
• Driving instructors and educators producing diagrams for teaching material.
• Tool builders extending the editor with new exporters, importers, or AI-assisted features through the extension SDK.

How this documentation is organised

The site follows the Diátaxis split. Pick the section that matches what you’re doing.

Section	When to read it
Scene editor tutorials	You are new and want to learn drawing by doing.
Scene editor how-to guides	You know what to accomplish on the canvas and need the steps.
Scenario editor	You are authoring or running OpenSCENARIO — its tutorial, references, and playback docs live together there.
Reference	You need to look up an exact fact — a shortcut, a format, an API.
Explanation	You want to understand why drawtonomy works the way it does.
Extending drawtonomy	You are building on top of drawtonomy.

If you don’t know where to start, both five-minute paths live in the Quickstart: draw your first scene, or build and run your first scenario.