SeeCode Açık Kaynak Yayınlandı: Kodlama Ajanları Animasyonlu Diyagram Çiziyor
Haberler

SeeCode Açık Kaynak Yayınlandı: Kodlama Ajanları Animasyonlu Diyagram Çiziyor

· 3 DK

Yazar: KOZBA

İçindekiler
  1. Ne yapıyor?
  2. 45 diyagram tipi
  3. Nasıl çalışıyor?
  4. Dışa aktarma ve temalar
  5. Kurulum
  6. Teknik taraf
  7. Kimin için, kimin için değil?
  8. Rakamlarla
  9. Denendiğinde ne beklemeli?

Kodlama ajanlarına diyagram çizdiren açık kaynak bir yetenek (skill) yayınlandı. SeeCode, Claude Code, Codex, Cursor ve OpenCode gibi ajan barındıran araçlara kuruluyor; kısa bir tarif veriyorsunuz, o da tek bir HTML dosyası olarak etkileşimli ve animasyonlu diyagram üretiyor.

Ne yapıyor?

SeeCode'un çıktısı hareketsiz bir görsel değil. Fare ile bir bağlantının üzerine gelince zincir vurgulanıyor, tıklayınca detay paneli açılıyor, akışı adım adım yürüyebiliyorsunuz. Sıralama diyagramları mesajları sırayla oynatıyor, çubuk grafikler kendiliğinden büyüyor. Diyagramın tamamı tek bir HTML dosyası olduğu için paylaşmak için sunucu ya da eklenti gerekmiyor.

45 diyagram tipi

Proje README'sine göre mimari şemalar, sıralama diyagramları, Gantt ve Sankey grafikleri dahil 45 diyagram tipi destekleniyor. İzometrik modda nesneler parçalarına ayrılıp etiketlenebiliyor; yalnızca kod akışı değil, süreç ve organizasyon şemaları da çizilebiliyor.

Nasıl çalışıyor?

SeeCode bir "Agent Skill": ajanın kendisi kısa bir JSON spesifikasyonu üretiyor, SeeCode bunu diyagrama çeviriyor. Yani siz "checkout akışını göster: tarayıcı API'yi çağırıyor, API Postgres'e yazıyor" gibi bir cümle yazıyorsunuz; ajan önce çizilecek yapıyı çıkarıyor, sonra tek dosyalık HTML'i üretiyor.

Dışa aktarma ve temalar

Diyagramın kendi Export menüsü PNG, JPEG, SVG, GIF ve MP4 üretiyor; ayrıca bir şey kurmak gerekmiyor. Tema tarafında açık, koyu ve marka paleti seçenekleri var. "Marka" teması sayfanın CSS'ini okuyup arka plan, metin, vurgu ve bağlantı renklerini çıkarıyor; açık ve koyu iki sürüm üretip kontrastı okunur hâle getiriyor. Paleti kaydetmeden önce size gösteriyor.

Kurulum

Claude Code için eklenti pazarı üzerinden /plugin marketplace add Aryanutkarsh/seecode ve ardından /plugin install seecode@seecode komutları kullanılıyor. Cursor, Codex ve OpenCode gibi diğer Agent Skills barındırıcılarında npx skills add Aryanutkarsh/seecode -g yeterli. Claude.ai ve Claude Desktop için ise son sürümdeki seecode.zip dosyası Settings → Capabilities → Skills bölümünden yükleniyor.

Teknik taraf

Depo MIT lisanslı, JavaScript ile yazılmış ve sıfır bağımlılık iddiası taşıyor. Komut satırında SVG yalnızca Node gerektiriyor; diğer formatlar için makinedeki Chrome veya Edge kullanılıyor. Çıktı boyutu içeriğe göre ölçekleniyor: küçük bir grafik 3 katı çözünürlükte, yoğun sistem haritaları etiketleri okunur kalacak ölçekte üretiliyor.

Kimin için, kimin için değil?

Teknik dokümantasyon, mimari anlatımı ve ekip içi sunumlarda şema hazırlamakla uğraşanlar için pratik bir kısayol. Deponun kendi notu da var: her görselleştirme işi için doğru araç bu değil; basit bir kutu-ok şeması için elle çizmek hâlâ daha hızlı olabilir.

Rakamlarla

Depo 2 Ekim 2026'da açıldı ve 16 Ekim itibarıyla GitHub'da yaklaşık 490 yıldız topladı. Kodlama ajanlarının son aylarda kod yazmanın ötesine geçtiğini düşünürsek, bu tür yetenekler ajanın ürettiği işi ekibin geri kalanının okuyabileceği bir hâle getiriyor.

Denendiğinde ne beklemeli?

Kurulumdan sonra ilk diyagramı almak için ajana tek cümle yetiyor. Çıktı tek dosya olduğu için tarayıcıda açıp denetlemek, gerekirse sonraki turda "şu kutuyu şuraya al" demek mümkün. Zaman alan tek adım, marka paletinin öğrenilmesi: ajan sayfanın CSS'ini okuyup renk ve tipografi kararlarını çıkarıyor, paleti onaylamanızı bekliyor.

Paylaş