텍스트 창을 벗어난 코딩 에이전트
요즘 코딩 에이전트는 대부분 비슷한 모습이에요. 터미널이나 채팅창에 요청을 입력하면 에이전트가 파일을 읽고 코드를 고치고 결과를 텍스트로 알려주죠. 편하긴 한데, 설계 이야기를 할 때는 좀 답답할 때가 있어요. 실제로 팀에서 아키텍처를 논의할 때는 화이트보드에 박스 그리고 화살표 긋잖아요. 말로 열 줄 설명하는 것보다 그림 하나가 빠를 때가 많거든요.
Drawgent는 바로 이 지점을 파고든 오픈소스 프로젝트예요. 이름 그대로 Draw + Agent, 즉 실시간 Excalidraw 캔버스 위에서 동작하는 코딩 에이전트예요.
Excalidraw가 뭐냐면
Excalidraw는 손으로 그린 듯한 느낌의 다이어그램을 그릴 수 있는 오픈소스 웹 화이트보드예요. 개발자들 사이에서 아키텍처 스케치, 시퀀스 다이어그램, 회의 메모용으로 많이 쓰여요. 중요한 특징은 그림이 JSON 형태의 구조화된 데이터로 저장된다는 점이에요. 사각형, 화살표, 텍스트 같은 요소 하나하나가 좌표와 속성을 가진 객체라서, 사람뿐 아니라 프로그램도 읽고 쓸 수 있어요. AI 에이전트가 붙기 딱 좋은 구조인 거죠.
어떻게 동작하나
Drawgent의 아이디어를 풀어보면 이래요. 사용자와 에이전트가 같은 캔버스를 동시에 보면서 작업해요. 사용자가 박스를 그리고 'API 서버', 'DB', '캐시'라고 적은 다음 화살표로 연결하면, 에이전트는 이 그림을 구조화된 데이터로 읽어서 의도를 파악해요. 반대로 에이전트가 코드베이스를 분석한 결과를 다이어그램으로 캔버스에 그려주기도 하고요.
기존 코딩 에이전트와 비교하면 차이가 확실해요.
- 입력 방식: 텍스트 프롬프트만이 아니라 도형, 연결선, 배치 같은 공간 정보가 입력이 돼요.
- 출력 방식: 코드 diff만이 아니라 시각적 결과물이 함께 나와요. 에이전트가 무엇을 이해했는지 그림으로 확인할 수 있어서, 잘못 이해했으면 바로 박스를 옮기거나 화살표를 지워서 고쳐줄 수 있어요.
- 라이브 협업: 캔버스가 실시간으로 갱신되기 때문에 에이전트가 일하는 과정을 옆에서 지켜보는 느낌이 들어요.
업계 맥락: 에이전트 UI의 다양화
AI 에이전트의 인터페이스는 요즘 빠르게 갈라지고 있어요. Claude Code나 여러 CLI 에이전트는 터미널 중심이고, Cursor 같은 도구는 에디터 중심이에요. 한편 v0나 여러 디자인-투-코드 도구들은 시각적인 결과물에서 출발하죠. Drawgent는 그 사이에서 '설계 단계'를 시각적으로 다루는 틈새를 노린 프로젝트라고 볼 수 있어요.
특히 요즘 에이전트 생태계에서는 MCP(Model Context Protocol)처럼 에이전트가 외부 도구와 데이터를 읽고 쓰는 표준이 자리 잡으면서, '에이전트가 조작할 수 있는 작업 공간'을 무엇으로 삼을지가 중요한 설계 포인트가 됐어요. 코드 파일, 브라우저, 스프레드시트에 이어 이제 화이트보드까지 에이전트의 작업대가 되는 흐름이에요. 다만 아직은 초기 프로젝트라서 대형 코드베이스에서 얼마나 안정적으로 동작하는지, 다이어그램과 실제 코드의 동기화를 어디까지 유지할 수 있는지는 직접 써보면서 확인해 봐야 할 부분이에요.
한국 개발자에게 주는 시사점
실무에서 떠올려볼 수 있는 활용 장면이 꽤 있어요.
첫째, 신규 입사자 온보딩이에요. 처음 보는 레거시 코드베이스를 에이전트가 다이어그램으로 그려주면, 문서가 부족한 팀에서도 전체 구조를 빠르게 파악할 수 있어요.
둘째, 설계 리뷰예요. 기획자나 PM과 함께 캔버스를 보면서 이야기하면 비개발 직군과의 소통 비용이 크게 줄어요. 한국 스타트업처럼 역할 경계가 유연한 조직에서 특히 유용할 수 있어요.
셋째, 직접 만들어 보고 싶은 분들에게는 좋은 학습 레퍼런스예요. 구조화된 캔버스 데이터를 LLM 컨텍스트로 넘기는 방식, 에이전트의 출력을 다시 시각 요소로 바꾸는 방식은 사내 도구나 사이드 프로젝트에 그대로 응용할 수 있는 패턴이거든요.
마무리
한 줄 정리: Drawgent는 코딩 에이전트와의 대화를 텍스트에서 화이트보드로 옮겨, 설계 단계의 협업을 시각적으로 바꾸려는 시도예요.
여러분은 AI 에이전트와 일할 때 텍스트 프롬프트만으로 충분하다고 느끼시나요, 아니면 그림으로 설명하고 싶었던 순간이 있었나요? 의견을 나눠 주세요!
🔗 출처: Hacker News