drawtonomy — 자율주행 시나리오 화이트보드

자율주행 시나리오를 위한 무료 웹 기반 화이트보드입니다. 논문, 슬라이드, 설계 검토용 차선, 교차로, 교통 장면을 스케치하고, OpenSCENARIO 스토리보드를 저작하며, esmini-WASM을 기반으로 모든 .xosc를 동일한 브라우저에서 실행하세요. 설치 불필요. 계정 불필요.

라이브 시나리오 실행 그리기 시작 문서 보기 GitHub

drawtonomy는 무엇인가요?

drawtonomy는 자율주행(AV), 오토노머스 드라이빙(AD), ADAS를 위한 무료 웹 기반 화이트보드입니다.

차선, 교차로, 차량, 보행자, 신호등, 도로 표시를 1급 도형으로 배치합니다. 설치 불필요, 계정 불필요, 업로드도 없습니다.

하지만 그린 장면은 여기서 끝나지 않습니다. 시나리오 모드에서 동일한 캔버스는 OpenSCENARIO 저작 도구가 됩니다. 액터에게 페이즈, 이벤트, 트리거를 설정하고 재생을 누르면 esmini를 WebAssembly로 컴파일한 것이 브라우저에서 실행되며, 마지막에 PASS / FAIL 판정이 나타납니다. OpenSCENARIO 저작과 실행은 그 자체로 핵심이며, 단순한 외부 도구가 아닙니다.

진정한 연결고리는 한 장면을 인접한 도구 체인으로 옆으로 보내는 것입니다. ASAM OpenDRIVE 1.8로 내보내고 Lanelet2 OSM 지도 및 ROS 점유 격자를 가져옵니다(시뮬레이션 및 지도 작성 스택과의 연결 참고).

장면을 그리고, 움직이게 하세요.

장면 그리기 차선, 교차로, 차량, 보행자를 위상 인식 1급 도형으로 표현합니다. 빈 캔버스에서 논문, 슬라이드, 설계 검토용 내보낸 그림까지 5분이면 됩니다.

움직이게 하기 액터에게 페이즈, 이벤트, 트리거를 지정하거나, 기동을 문장으로 설명하고 AI에게 작성을 맡기세요. esmini-WASM에서 브라우저 안에서 실행되며 PASS / FAIL 판정까지 확인합니다. 첫 번째 실행 시나리오까지 5분이면 됩니다.

이 둘은 별개 제품이 아니라 하나의 파이프라인입니다. 장면에서 그린 차선과 액터, 기하 구조가 그대로 시나리오가 실행되는 도로 네트워크와 엔티티가 됩니다. 그 사이에 내보내기 단계도, 별도의 도구도 없습니다.

장면은 운전 어휘를 이미 알고 있는 캔버스입니다. 일반 작도 도구는 차선이 무엇인지 모르기 때문에 조금만 손봐도 도로 기하 구조를 처음부터 다시 만들어야 하지만, drawtonomy는 차선과 교차로를 도형으로 다루므로 반복해서 편집해도 그림이 무너지지 않습니다. 같은 캔버스로 논문에 넣을 그림도, 설계 검토 전 슬라이드도, 통화 중에 그리는 코너 케이스도 모두 소화합니다. 수식이 필요할 땐 Math (LaTeX) 도구로 비용 함수나 제어기 수식을 장면 바로 옆에 놓을 수 있습니다.

시나리오는 그 장면을 움직이는 쪽입니다. 액터에게 페이즈, 이벤트, 트리거를 직접 지정해도 되고, AI 시나리오 생성에 맡겨도 됩니다. 차선 하나를 그리고 차량 두 대를 배치한 뒤 “Vehicle2 cuts in front of Vehicle1.”이라고 입력하면, 스토리보드가 자동으로 작성되어 esmini에서 실행되고, 검증을 통과한 경우에만 적용됩니다. 이후에는 평범한 시나리오이므로 시크·편집·내보내기를 그대로 이어서 할 수 있습니다.

뭔가 작성하기 전에 실제로 동작하는 모습부터 보세요. 지금 바로 esmini 저장소의 실제 시나리오를 재생할 수 있습니다 — 클릭 한 번으로 GitHub에서 .xosc를 가져와 브라우저에서 실행합니다. 자세한 내용은 .xosc 열기 및 실행을 참고하세요.

차선·차량·교차로라는 어휘는 자율주행(AD) 업무를 넘어서도 널리 쓰입니다. 운전면허 교육 자료, 교통 공학 다이어그램 등에도 그대로 적용됩니다. 전체 목록은 사용 사례에서 확인하세요.

또한 이런 용도로도 작동합니다…

화이트보드가 주요 기능이지만, 동일한 캔버스는 이러한 인접 작업을 위한 경량 웹 기반 프론트엔드로도 사용할 수 있습니다.

OpenDRIVE 편집기 .xodr을 열고 차선과 교차로를 시각적으로 편집한 후 ASAM OpenDRIVE 1.8을 내보냅니다.

OpenSCENARIO 편집기 스토리보드(페이즈, 이벤트, 액션, 트리거)를 시각적으로 저작하고, esmini-WASM에서 브라우저에서 실행하며, ASAM OpenSCENARIO 1.2 esmini 준비 완료 zip을 내보냅니다.

OpenSCENARIO 시뮬레이터 .xosc + .xodr을 가져오면 내장된 esmini-WASM이 브라우저에서 스토리보드를 바로 실행합니다 — 시크, Follow Ego, 고스트 궤적, .webm 내보내기. esmini를 기반으로 합니다.

Lanelet2 편집기 .osm 지도를 열고 차선 기하학을 시각적으로 편집한 후 Lanelet2로 round-trip합니다(규제 요소용 사이드카 포함).

차선 그리기 도구 차선, 교차로, 횡단보도, 도로 표시를 위상 인식 연결을 갖춘 1급 도형으로 제공합니다.

도로 네트워크 설계 도구 차선, 교차로, 라운드어바웃, 나들목을 배치합니다. OpenDRIVE 또는 Lanelet2로 내보냅니다.

다음 단계

당신이 여기 온 이유에 맞는 진입점을 선택하세요.

시나리오 저작 및 실행 스토리보드(페이즈, 이벤트, 액션, 트리거)를 구축하고, PASS / FAIL 조건을 설정한 후, 내장된 esmini-WASM 엔진에서 브라우저에서 실행합니다.

사용 사례 보기 논문 그림, 설계 검토 슬라이드, ADAS 테스트 스케치, Lanelet2 편집, ROS 지도 주석 등. 카탈로그를 보고 당신의 사용 사례가 포함되어 있는지 확인하세요.

다른 도구와 비교 RoadRunner, MATLAB Driving Scenario Designer, Truevision Designer, JOSM, Vector Map Builder, 슬라이드 도구, 온라인 화이트보드와의 중립적 나열 작성.

형식에 대해 읽기 OpenSCENARIO, OpenDRIVE, Lanelet2, esmini, Autoware HD 지도, ROS 점유 격자, 시나리오 분류(기능적 / 논리적 / 구체적)가 실제로 무엇인지, 그리고 drawtonomy가 어디에 위치하는지 알아봅니다.

그리기 시작 빈 캔버스에서 내보낸 장면까지 5분. 그 다음 튜토리얼, 방법 가이드, 참고 자료, 확장 개발자를 위한 SDK.

사람들이 이것을 어떻게 사용하는가

논문 및 학위논문용 그림

자율주행(AV), 오토노머스 드라이빙(AD), ADAS 논문을 위한 선명한 벡터 시나리오 그림으로, LaTeX, 슬라이드 덱, Markdown에 깔끔하게 포함됩니다. .drawtonomy.svg(drawtonomy의 기본 재편집 가능 SVG 형식), PDF 또는 EPS로 내보낼 수 있습니다.

설계 논의용 다이어그램

차선 변경 기동, 비보호 좌회전 또는 폐색 케이스를 몇 초 안에 스케치합니다. 결과를 공유하고 내일 동일한 캔버스에서 논의를 계속합니다.

저작 전 시나리오 스케치

OpenSCENARIO XML을 작성하기 전에 장면을 그립니다. 스케치가 준비되면 .xosc / .xodr로 내보냅니다.

지도 및 ROS 주석

위성 배경 위에 차선을 추적하고, Lanelet2 OSM 지도를 편집하거나, ROS 점유 격자에 경로와 장애물을 주석합니다.

일반 그리기 도구보다 빠른 이유

자율주행 도메인 도형

차선, 교차로, 횡단보도, 신호등, 도로 표시, 차량, 보행자가 기본 제공됩니다. 자신의 SVG 템플릿을 추가하고 PR로 기여할 수도 있습니다.

위상 인식 차선

각 차선은 Next / Previous / Left / Right 연결을 포함합니다. 경계를 공유하는 두 차선은 동일한 경계점을 공유하므로, 한 번 드래그하면 둘 다 움직입니다.

무한 캔버스, 위성 배경

자율주행 시나리오를 위한 무한 캔버스입니다. 임의로 큰 레이아웃을 가로질러 팬하고 줌합니다. 위성 또는 로드맵 배경을 가져오고 실제 위치에서 추적합니다. 스냅과 공유 포인트는 수동 정리 없이 기하학을 정렬하게 합니다.

무료이고 웹 기반

설치 불필요, 계정 불필요, 업로드 불필요입니다. 나중에 저장된 drawtonomy.svg를 다시 열면 장면이 정확히 남겨진 대로, 연결과 겹침 관계를 포함하여 돌아옵니다.

시뮬레이션 및 지도 작성 스택과의 연결

화이트보드가 주요 기능이고, 이것들이 다이어그램이 나머지 워크플로우로 흘러가는 방식입니다.

논문 및 슬라이드용 재편집 가능 SVG

.drawtonomy.svg 형식은 브라우저, GitHub, 슬라이드 덱에서 미리 볼 수 있는 일반 SVG이면서 동시에 모든 연결이 그대로 유지된 상태로 drawtonomy에서 다시 열 수 있습니다. 나중에 편집이 필요할 수 있는 그림에 항상 선택할 기본값입니다. 논문, 슬라이드, 문서, 블로그 게시물에서 사용합니다.

Lanelet2 round-trip

편집을 위해 Lanelet2 OSM 지도를 열고 OSM으로 다시 내보냅니다. Autoware 샘플 지도와 규제 요소를 포함합니다. 기존 HD 지도에 대한 변경 사항을 스케치하는 데 유용합니다.

ASAM OpenDRIVE round-trip

OpenDRIVE .xodr 지도를 열고, 차선과 연결을 시각적으로 편집한 후, OpenDRIVE 1.8 + OpenSCENARIO 1.2를 esmini 준비 완료 zip으로 함께 내보냅니다. 건드리지 않은 도로는 carry-through를 통해 그대로 round-trip됩니다.

OpenDRIVE ⇄ Lanelet2 연결

두 형식 모두 동일한 내부 차선 모델에 도착하므로, drawtonomy는 OpenDRIVE와 Lanelet2 간의 브라우저 연결로 작동합니다. 한 형식을 가져오고, 시각적으로 편집한 후, 다른 형식으로 내보냅니다. 차선, 교차로, 규제 요소(신호, 표지판, 통행권)는 양쪽 방향으로 변환됩니다.

구축할 준비가 되셨을 때

평가 단계가 끝나고 실제로 그리기를 원할 때, 문서는 네 가지 필요 유형 중심으로 구성되어 있습니다. 당신이 하려는 일과 맞는 것을 선택하세요.

튜토리얼 하면서 배우세요. 빈 캔버스에서 완성된 장면까지의 단계별 수업.

방법 가이드 특정 작업을 완료하세요. 차선, 차량, 내보내기, 가져오기 레시피.

참고 자료 사실을 찾아보세요. 단축키, 파일 형식, 도형 카탈로그, SDK API.

설명 모델을 이해하세요. drawtonomy가 작동하는 방식의 이유.

확장 개발자를 위해

drawtonomy만 사용하는 것이 아니라 그 위에 구축하고 싶다면, drawtonomy 확장을 참고하세요. SDK 소스, 예제, 참고 자료는 이 사이트와 함께 github.com/kosuke55/drawtonomy에 있습니다.