Deni The Setiawan
AI,  Coding

Drawgent: Coding Agent yang Bisa Gambar & Edit Diagram Langsung di Kanvas

Author

Deni Setiawan

Date Published

Drawgent: Coding Agent yang Bisa Gambar Sekaligus Ngoding di Kanvas Excalidraw

Ada proyek open source baru bernama Drawgent yang lagi ramai dibahas di Hacker News. Intinya, Drawgent menyambungkan coding agent seperti Claude Code, Codex, atau opencode langsung ke kanvas Excalidraw — jadi kita bisa gambar diagram, kasih anotasi "AGENT: ...", terus agent-nya yang edit kanvas itu secara live sambil ngecek hasilnya sendiri.

Beberapa poin pentingnya:

  • Cara pakainya: minta diagram lewat chat panel, atau tulis catatan "AGENT: ..." di sebelah bagian gambar yang mau diubah. Agent bakal lihat kanvas (screenshot + scene), edit langsung, verifikasi hasil, lalu tandai "DONE".
  • Shape di kanvas bisa di-link ke file, baris kode, atau symbol tertentu — jadi diagram arsitektur bisa nyambung langsung ke kodenya.
  • Ada fitur "laser gesture": panah untuk pindah/hubungkan elemen, coretan untuk hapus, lingkaran untuk seleksi.
  • Bisa juga kebalikannya — kita gambar perubahan yang diinginkan di kanvas, lalu agent yang mengimplementasikan perubahan kodenya.
  • Arsitekturnya terdiri dari browser editor, server Drawgent, dan coding agent kita sendiri yang tersambung lewat MCP (Model Context Protocol). Perubahan diagram di-track pakai Git.
  • Masih proyek alpha yang di-hosting di Tangled (alternatif GitHub), tapi development-nya cukup aktif.

Sumber: