CaYaDev Logo
  • Ana Sayfa
  • Projeler
  • Paylaşımlar
  • Destek
  • Profil
    Ayarlar Çıkış
    Giriş Kayıt Ol
Paylaşımlara Dön

Sesle Çalışan Masaüstü Görselleştirici: CAYADEV Visualizer’ı Neden Bu Kadar Büyüttüm?

CaYatur C
Paylaşan CaYatur Yönetici hesabı · @CaYatur
01.10.2026 13:45
Genel
0
sand-save-1790851425767.png

Sesle Çalışan Masaüstü Görselleştirici: CAYADEV Visualizer’ı Neden Bu Kadar Büyüttüm?

Bir şarkıyı dinlerken ekranın da ritme katılmasını isterim. Tarayıcıda dönen hafif “visualizer” demoları güzel görünür ama OBS’ye taşımak, çok monitöre yaymak, şeffaf pencere açmak veya gerçek MilkDrop preset’lerini koşturmak istediğiniz anda çoğu oyuncak kalır. CAYADEV Visualizer tam bu boşluğu doldurmak için yazdığım, Windows · macOS · Linux’ta çalışan, Electron + WebGL2 tabanlı açık kaynak bir masaüstü görselleştirici.

Bu yazıda projeyi “ne yapar?” seviyesinde anlatıyorum: kendi motoru, MilkDrop katmanı, Timeline / Clip Deck, yayın çıktıları ve Spout/Syphon. Abartılı vaat yok — neyin ne için olduğunu net yazıyorum.

Ne işe yarar?

Kısaca: sistem sesinizi (veya seçtiğiniz uygulamayı / girişi) yakalar, WebGL ile sese tepki veren sahneler çizer ve bunu yerel pencerede, yayın overlay’inde veya GPU paylaşımında kullanmanıza izin verir.

Tipik kullanım senaryoları:

  • Canlı yayın / VJ — sahne katmanları, efekt zinciri, performans grid’i
  • Müzik videosu / kanal görseli — daha sakin “broadcast” düzenleri, logo ve şarkı bilgisi
  • Masaüstü ambiyans — şeffaf pencere, çok monitör, her zaman üstte

Ses yakalama platforma göre native: Windows’ta WASAPI, macOS’ta CoreAudio, Linux’ta PulseAudio / PipeWire hattı.

Kendi motoru: katmanlar, sahneler, kontrol

Temel motor “MilkDrop’un kopyası” değil. Kendi WebGL boru hattı var: katmanlar, karışım (blend), post-efektler, onlarca görselleştirici / arka plan modu, spektrum ölçümü (log / lin / mel / bark, dB, ayrı attack–release ballistics), 3D geometri / formüller, shader stüdyosu, projeksiyon mapping ve sahne geçişleri.

Kontrol paneli Scene · Audio · Lighting · Output · Control · Studio · Library diye bölünüyor; değişiklikler canlı yansıyor, Türkçe / İngilizce arayüz runtime’da değişiyor.

Üstüne performans odaklı iki araç oturuyor:

  • Timeline — DAW tarzı düzenleyici: clip’ler, fade, loop, marker, tempo haritası, undo / split / duplicate
  • Clip Deck — sahne / medya / shader slot’larıyla performans grid’i; çoklu deck, sürükle-bırak, beat çubuğu

Bunlar “tek bir güzel ekran görüntüsü” değil; canlıda sahneyi yönetmek için.

MilkDrop katmanı

Ayrı bir katman olarak klasik .milk (ve .milk2) preset’lerini koşturabiliyor. Kütüphane tarafında ZIP / klasör içe aktarma, küçük önizlemeler, etiket / favori / yazar arama, MIDI / OSC ve beat / track ile ilerleme, uygulama içi editör / üretici / mash-up gibi parçalar var.

Önemli ayrım: kendi motorunuzla VJ sahnesi kurabilir, MilkDrop preset’lerini de aynı uygulama içinde açabilirsiniz. İkisi birbirinin yerine geçmez; yan yana yaşar.

Yayın ve GPU çıktısı

Streaming overlay OBS veya tarayıcı için. OBS eklentisi değil: Browser Source / stream URL üzerinden bağlanırsınız. Şeffaf arka plan yerel pencerede ve overlay’de çalışacak şekilde tasarlandı; düz tarayıcı sekmesi her zaman kendi arka planını boyadığı için “masaüstü şeffaflığını” orada beklemeyin — OBS Browser Source’da görürsünüz.

Spout (Windows) / Syphon (macOS) GPU üzerinden başka uygulamalara görüntü gönderir. Bu paylaşılan doku alpha taşıyamadığı için Spout/Syphon yolu opak kalır; şeffaf overlay istiyorsanız yerel pencere veya OBS browser kaynağını kullanın.

Ayrıca kayıt / dışa aktarma, çok monitör ve otomatik güncelleme yolu da var.

Nasıl bakılır?

Kaynak ve indirme GitHub’da:

  • Proje: github.com/CaYatur/SoundVisualizer
  • Site sayfası: cayadev.com/project/cayadev-sound-visualizer

Lisans MIT. Marka: cayadev.com.

Özetle: tarayıcı demosu değil; sesi native yakalayan, kendi WebGL motoru + MilkDrop + Timeline / Clip Deck + yayın / Spout-Syphon çıktıları olan bir masaüstü araç. Beğenirseniz yıldız bırakmanız veya bir sahne paylaşmanız yeterli — gerisi zaten açık kaynakta.

Ek Görseller

sand-save-1790848654678.gif
Büyütmek için tıklayın
sand-save-1790851425767.png
Büyütmek için tıklayın

Yararlı Linkler

Github Sayfası

Diğer Paylaşımlar

Web Geliştirme

Kendi Blog Altyapınızı Sıfırdan Yazmak: Markdown'dan SEO Dostu HTML'e

Kendi Blog Altyapınızı Sıfırdan Yazmak: Markdown'dan SEO Dostu HTML'e Bir geliştiricinin blog açmak için önünde hazır onlarca seçenek var: W

26 Ağustos 2026
Web Geliştirme

Socket.IO ile Oda Tabanlı Gerçek Zamanlı Oyun Geliştirmek: Kelime Sayar'dan Dersler

Socket.IO ile Oda Tabanlı Gerçek Zamanlı Oyun Geliştirmek: Kelime Sayar'dan Dersler Kelime Sayar, arkadaş gruplarının oda kurup birlikte oyn

14 Temmuz 2026
Sunucu Yönetimi

Node.js Sitenizi Cloudflare Arkasında Yayınlamak: Sertifikalar, Gerçek IP ve Önbellek

Node.js Sitenizi Cloudflare Arkasında Yayınlamak: Sertifikalar, Gerçek IP ve Önbellek Bu site, ilk günden beri Cloudflare arkasında çalışıyo

16 Haziran 2026
Güvenlik

Express.js Uygulamanızı Güvene Almak: Oturumlar, CSRF ve Hız Sınırlama

Express.js Uygulamanızı Güvene Almak: Oturumlar, CSRF ve Hız Sınırlama Express ile bir uygulamayı ayağa kaldırmak yarım saat sürer; onu inte

14 Haziran 2026

Tüm paylaşımları görüntüle →

1 / 1

CaYaDev

CaYaDev — kişisel projelerimi, kod örneklerimi ve teknoloji içeriklerimi paylaştığım platform. Geliştiriciler için kaynak ve ilham kaynağı.

Hızlı Bağlantılar

  • CaYaDev Projeleri
  • CaYaDev Paylaşımları
  • Destek
  • Hakkımızda

İletişim

  • İletişim
  • Gizlilik Politikası
  • Kullanım Şartları
  • Sorumluluk Reddi

CaYaDev Topluluğu

CaYaDev ile geliştirici topluluğuna katılın ve projelerimizden ilham alın.

Uygulama Portalı

© 2026 CaYaDev. Tüm hakları saklıdır.