A free, browser-based whiteboard for driving scenarios. Sketch lanes, intersections, and traffic scenes for papers, slides, design reviews, and scenario authoring — and play any .xosc you have in the same browser, built on esmini-WASM. No install. No account.
drawtonomy is a free, browser-based whiteboard for driving
scenarios — self-driving (AV), autonomous driving (AD), and ADAS
alike.
Place lanes, intersections, vehicles, pedestrians, traffic lights,
and road markings as first-class shapes. No install, no account,
nothing uploaded. When you need it, the same scene also exports to
ASAM OpenDRIVE 1.8, OpenSCENARIO 1.3, and esmini-ready zip bundles,
and imports Lanelet2 OSM maps and ROS occupancy grids — but those
are bridges out, not the main event (see
Bridges to your simulation and mapping stack below).
Use it for the figures you put in a paper, the slide you sketch
before a design review, the diagram you draw on a call when you’re
trying to explain a corner case to the rest of the team, or the
scene you sketch out before writing the OpenSCENARIO file. The
same canvas works for self-driving (AV) research figures,
autonomous-driving (AD) design reviews, and ADAS test-scenario
sketches — cut-in, lane change, unprotected left, roundabout
entry, pedestrian crossing, lead-vehicle braking, and other
common scenarios are all routine sketches here.
The lane / vehicle / intersection vocabulary is general enough that
the same canvas also works for driving-school lesson plans, road
safety education materials, traffic-engineering concept figures, and
quick personal sketches of road scenes — see use cases
for the full list.
The canvas also ships a Math (LaTeX) tool
that renders equations with KaTeX, so you can drop a typeset cost
function or controller equation next to the scenario it describes.
It works just as well as a standalone, free, browser-based
LaTeX equation editor for paper figures, slide decks, Notion,
or blog posts — see equations in research paper figures
and equations in slides and blog posts.
The reason it exists: generic drawing tools and slide decks don’t
know what a lane is, so the road geometry has to be rebuilt every
time something moves. drawtonomy treats lanes, intersections, and
the rest of the driving-scenario vocabulary as built-in shapes,
so the figure stays correct as you iterate.
The whiteboard is the main thing, but the same canvas also doubles as
a lightweight, browser-based front-end for these adjacent jobs:
OpenDRIVE editorOpen a .xodr, edit lanes and junctions visually, export ASAM OpenDRIVE 1.8.
OpenSCENARIO editorSketch the scene, export an ASAM OpenSCENARIO 1.3 esmini-ready zip.
OpenSCENARIO simulatorDrop in a .xosc + .xodr and the embedded esmini-WASM runs the storyboard right in the browser — seek, Follow Ego, ghost trails, .webm export. Built on esmini.
Lanelet2 editorOpen a .osm map, edit lane geometry visually, round-trip back to Lanelet2 with a sidecar for regulatory elements.
Lane drawing toolLanes, intersections, crosswalks, and traffic markings as first-class shapes with topology-aware connections.
Road network design toolLay out lanes, intersections, roundabouts, and interchanges. Export to OpenDRIVE or Lanelet2.
Pick the entry point that matches what you came here for.
See what people use it forPaper figures, design-review slides, ADAS test sketches, Lanelet2 editing, ROS map annotation, and more. Browse the catalog to see if your use case is one of them.
Compare with other toolsNeutral side-by-side write-ups against RoadRunner, MATLAB Driving Scenario Designer, Truevision Designer, JOSM, Vector Map Builder, slide tools, and online whiteboards.
Read about the formatsWhat OpenSCENARIO, OpenDRIVE, Lanelet2, esmini, Autoware HD maps, ROS occupancy grids, and scenario classification (functional / logical / concrete) actually are, and where drawtonomy fits.
Get buildingFive minutes from blank canvas to exported scene. Then tutorials, how-to guides, reference, and the SDK for extension developers.
Crisp, vector scenario figures for self-driving (AV),
autonomous-driving (AD), and ADAS papers that embed
cleanly in LaTeX, slide decks, and Markdown — exported as
.drawtonomy.svg (drawtonomy’s native, re-editable SVG
format), PDF, or EPS.
Diagrams for design discussion
Sketch a lane-change manoeuvre, an unprotected left, or an
occlusion case in seconds. Share the result and pick up the
discussion in the same canvas tomorrow.
Scenario sketches before authoring
Draw the scene before writing the OpenSCENARIO XML — and
export to .xosc / .xodr when the sketch is ready.
Map and ROS annotation
Trace lanes over a satellite background, edit Lanelet2 OSM
maps, or annotate a ROS occupancy grid with paths and
obstacles.
Lanes, intersections, crosswalks, traffic lights, road
markings, vehicles, and pedestrians come built in. You can
also add your own SVG templates and contribute them by PR.
Topology-aware lanes
Each lane carries Next / Previous / Left / Right
connections. Two lanes that share a boundary share the same
boundary points, so dragging once moves both.
Infinite canvas, satellite backgrounds
An infinite canvas for driving scenarios — pan and zoom
across arbitrarily large layouts. Drop in a satellite or
roadmap background and trace from a real location. Snap
and shared points keep geometry aligned without manual
cleanup.
Free and browser-only
No install, no account, no upload. Reopen a saved
drawtonomy.svg later and the scene comes back exactly as
you left it, connections and overlap relationships
included.
The whiteboard is the main thing; these are how the diagram flows
out to the rest of the workflow.
Re-editable SVG for papers and slides
The .drawtonomy.svg format is a regular SVG that
previews in browsers, GitHub, and slide decks, and
reopens in drawtonomy with every connection intact. The
default to reach for whenever a figure might need editing
later — papers, slides, documentation, blog posts.
Lanelet2 round-trip
Open Lanelet2 OSM maps for editing
and export back to OSM — including Autoware sample maps and
their regulatory elements. Useful for sketching changes
against an existing HD map.
ASAM OpenDRIVE round-trip
Open OpenDRIVE .xodr maps,
edit lanes and connections visually, and export OpenDRIVE
1.8 + OpenSCENARIO 1.3 — together as an
esmini-ready zip. Roads
you don’t touch round-trip verbatim through carry-through.
OpenDRIVE ⇄ Lanelet2 bridge
Both formats land in the same internal lane model, so
drawtonomy works as a browser bridge between OpenDRIVE
and Lanelet2: import
one, edit visually, export the other. Lanes, junctions,
and regulatory elements (signals, signs, right-of-way)
convert in both directions.
Once the evaluation phase is done and you actually want to draw,
the docs are organised around four kinds of need. Pick the one
that matches what you’re trying to do.
TutorialsLearn by doing. Step-by-step lessons from a blank canvas to a finished scene.
How-to guidesGet a specific job done. Recipes for lanes, vehicles, exports, and imports.
ReferenceLook up the facts. Shortcuts, file formats, shape catalog, and SDK APIs.
ExplanationUnderstand the model. Why drawtonomy works the way it does.