MonoSketch - ASCII Tabanlı Diyagram Oluşturma Aracı

• Yalnızca metinle fikirleri görsel tasarıma dönüştürebilen yalnızca istemci tarafında çalışan bir web uygulaması
• Kotlin ile yazılıp ardından JS'ye derlenen açık kaynaklı bir proje. SASS/Tailwind kullanıyor
• Dikdörtgen, çizgi, metin kutusu gibi temel şekil bloklarını birleştirerek karmaşık yapıları veya sistem diyagramlarını ifade edebiliyor
• Biçimlendirme özellikleri sayesinde basit ASCII karakterlerini farklı stillerde görsel öğelere dönüştürüyor
• PowerPoint veya Google Slides olmadan da sunum hazırlama ve görsel anlatım sağlayan bir araç

---

Genel Bakış

• MonoSketch, fikirleri görsel olarak ifade etmeyi sağlayan bir ASCII eskiz ve diyagram oluşturma uygulaması
  • Metin tabanlı arayüz üzerinden karmaşık şemalar, sistem yapıları, ağ akışları gibi unsurları ASCII karakterleriyle oluşturabiliyor
  • “Unleash your ideas with ASCII” sloganıyla, yalnızca basit metin kullanarak görsel tasarım yapmayı mümkün kılıyor

Temel Bileşenler

• Rectangle, Line, Text box gibi temel çizim işlevleri sunuyor
  • Çeşitli kenarlık stilleri, dolgu karakterleri, ok süslemeleri destekleniyor
  • Yuvarlatılmış köşeler ile görsel bütünlük artırılıyor
• Düzenleme işlevleri odaklı etkileşimli bir ortam
  • Sonsuz tuval ile serbest kaydırma ve yakınlaştırma/uzaklaştırma desteği
  • Otomatik kaydetme ve çoklu proje yönetimi özellikleri sunuluyor
  • Kopyala, kes, yapıştır, çoğalt gibi standart düzenleme komutları destekleniyor
  • Katman yönetimi ve akıllı hizalama yakalama ile şekiller hassas şekilde hizalanabiliyor
  • Karanlık mod desteği
• Dışa aktarma özellikleri
  • Seçili alanı veya tüm diyagramı anında metin olarak kopyalama
  • Kısayol desteği: macOS Cmd + Shift + C, Windows/Linux Ctrl + Shift + C
• Gelecek yol haritası
  • Gruplama özelliği ile karmaşık yapılardaki şekilleri yönetme
  • Boyama aracı ile serbest eğriler ve karakter tabanlı çizim
  • GitHub Gist paylaşımı ve URL'den yükleme gibi işbirliği özelliklerinin genişletilmesi planlanıyor

Uygulama ve UI

• Web üzerinden app.monosketch.io adresinde kullanılabiliyor
  • Arama çubuğu, düğmeler, çalışma alanı, panel gibi UI öğelerini ASCII ile ifade eden mockup'lar içeriyor
  • Giriş ekranı, kayıt formu gibi bölümler de ASCII biçiminde görselleştiriliyor
• Sunum oluşturma özelliği sayesinde PowerPoint veya Google Slides olmadan da sunum materyali hazırlanabiliyor

Teknoloji Yığını ve Lisans

• Tüm uygulama Kotlin/JS tabanlı olarak geliştirildi (Kotlin ile yazılıp JS'ye derleniyor)
• Stil için SASS ve Tailwind CSS kullanılıyor
• Gradle derleme sistemi kullanılıyor (hot reload geliştirme modu desteğiyle)
• Python 3.11+ ve Pipenv üzerinden alternatif geliştirme sunucusu seçeneği sunuluyor
• Apache License 2.0 açık kaynak

[GN⁺]

Hacker News yorumları

• Ben Monodraw kullanıyorum
  Şimdiye kadar yaptığım en memnun edici satın alma oldu

  • Ben de Monodraw kullanıyorum ama tek bir eksik yanı var
    metin düzenleme açılır penceresini ESC tuşuyla kapatma özelliği hâlâ yok
    Her seferinde ESC'ye basıyorum ama tepki vermeyince sinir bozucu oluyor
    İkili dosyayı kendim patch'lemeye çalıştım ama güncelleme mekanizması bozulduğu için vazgeçtim
  • Mac'ten Windows'a geçtikten sonra en çok özlediğim uygulama Monodraw olmuştu
    Ama bu yeni çıkan araç oldukça iyi bir alternatif gibi görünüyor, o yüzden mutlaka deneyeceğim
  • Diyagram, karalama ya da yapılandırma dosyası başlıklarını süslerken fig, kutular ve gölgeleri birleştirerek kullanmak gerçekten çok kullanışlıydı
  • Mac'i bıraktıktan sonra bile hâlâ özlediğim uygulamalardan biri
  • Eskiden Mac'te Monodraw'ı gerçekten çok seviyordum
    Şimdi ana sistem olarak Linux kullanıyorum ve bir alternatif arıyordum; bu araç şimdiye kadar gördüklerim içinde en yakın seçenek gibi duruyor

• Benzer araçlar arasında TextPaint, Archetype (archive), Textik, Asciiflow, Fsymbols Draw da var

  • Bir de JavE unutulmamalı

• Başlıktaki devre şeması o kadar özensiz ki resmen yapay zekanın yanlış ürettiği bir devre şeması gibi görünüyor
  Sembol stilleri tutarsız, pin etiketleri yok ve sol üstteki kapasitör kısa devre edilmiş

  • Sorun, uzmanların bu hataları hemen fark etmesi değil; yeni başlayanların bunu yanlış öğrenmesi
    Böyle öğrenirlerse geleceğin uzmanları hatalı bir temel üzerinde yetişir
  • Kapasitörün kısa devre olduğunu fark etmemiştim ama kısa çizgiyi (genelde negatif kutup) “+” ile işaretleyip doğrudan GND'ye bağlamalarına şaşırdım

• ‘ASCII’ kelimesini kullananlara bir şey söylemek istiyorum
  Monosketch aslında yalnızca ASCII kullanmıyor
  Örneğin “◎”(U+25CE) gibi Unicode karakterleri kullanıyor

  • Buna rağmen landing page'de kocaman “Unleash your ideas with ASCII” yazması biraz komik geldi :-)
  • Tarihsel olarak çizgi ve kutu çizim karakterleri IBM PC döneminde Code page 437 ile eklendi; yani gerçek ASCII değiller
    Gerçek ASCII ile kutu çizmek istiyorsanız sadece | ve - kullanmanız gerekir

• Emacs kullanıyorsanız uniline paketi oldukça faydalı

• Markdeep de ASCII art ile diyagram çizebiliyor
  Oldukça olgun bir araç

• HTML'de spellcheck niteliğini false yapmayı öneririm
  Yoksa “GND”, “uF” gibi etiketlerin altında kırmızı çizgiler çıkıyor ve görüntü rahatsız edici oluyor

• Graph-Easy varsayılan olarak ASCII üretir ama kutu karakterleri, SVG, PNG gibi farklı çıktı biçimlerini de destekler
  WYSIWYG tarzı değil; diyagramı metinle tanımlıyorsunuz ve sonuç üretiliyor

• Az önce bu araçla birkaç basit diyagram oluşturdum; kullanımı kolaydı ve dışa aktarma kalitesi de iyiydi
  Yine de geliştirilirse iyi olacak noktalar var

  1. Küçük dikdörtgenleri taşırken yakınlaştırma yerine taşıma yapılacağını anlatan UI geri bildirimi daha net olabilir
  2. Monosketch'i başka bir sekmede açınca aynı anda yeni diyagram oluşturulamıyor — sekmeler arasında bağlam paylaşılıyor gibi görünüyor

• macOS için yerel uygulama olarak Monodraw da var

  • Ama Monodraw şu anda bakım modunda ve ücretli
    İsme bakılırsa Monosketch onun bariz alternatifi gibi görünüyor