Kodunuzu 'Görebiliyor': Kimi k2.5'in Görsel Kodlama Yeteneklerine Derinlemesine Bir Bakış

Önceki makalede, OpenClaw ve Kimi k2.5'in nasıl "Muhteşem Bir İkili" haline geldiğinden bahsetmiştik. Birçok okuyucu, Kimi k2.5'in temel "Görsel Kodlama" (Visual Coding) özelliğiyle yakından ilgilendi.

"Görüntüden kod yazmak" aslında yeni bir şey değil; ChatGPT ve Claude bunu bir süredir yapabiliyor. Peki, Moonshot AI bu sefer nasıl bir "siyah teknoloji" ortaya çıkardı da geliştiriciler "frontend geliştiriciler işsiz kalacak" diye haykırmaya başladı? Bugün, teknik detayları ortaya çıkaralım.

"Yerel Görsel Kodlama" Nedir?

Kimi k2.5'in en büyük teknik atılımı "Yerel" (Native) olmasında yatmaktadır.

Önceki YZ'ler görüntüleri nasıl görüyordu?

Çoğu çok modlu model "yama işidir": Görüntüleri görmek için özel bir göze (görsel kodlayıcı) ve düşünmek için özel bir beyne (dil modeli) sahiptirler. Bir görüntüden kod yazdığınızda, YZ aslında görüntüyü bir metin açıklamasına "çeviriyor" ve ardından bu açıklamaya dayanarak kod yazıyordu. Bu süreçte, ince gölgeler, animasyonların ritmi ve hassas düzen oranları gibi birçok ayrıntı genellikle kayboluyordu.

Kimi k2.5 görüntüleri nasıl görüyor?

Kimi k2.5, Yerel Çok Modlu Mimari (Native Multimodal Architecture) benimser. Eğitim verileri 15 trilyon karışık metin-görüntü token'ı içerir. Bu, onun için görüntü piksellerinin tıpkı kod karakterleri gibi olduğu anlamına gelir — ana dilinin bir parçasıdır. Görüntüyü "çevirmesine" gerek yoktur; görsel tasarımı doğrudan "okuyabilir".

Bu mimari, niteliksel bir sıçrama getiriyor:

• Hassasiyet: Tasarımınızdaki 2px'lik bir kenar farkını tanımlayabilir.
• Dinamik: Videolardaki zaman akışını anlayabilir, böylece animasyon efektlerini mükemmel bir şekilde kopyalayabilir.

Üç Temel Uygulama Senaryosu

1. Videodan Koda (Video-to-Code): Etkileşim Kopyalamanın Kutsal Kasesi

Bu, Kimi k2.5'in en çarpıcı özelliğidir. Artık "Tıkladıktan sonra fade-in/fade-out efekti istiyorum" diye tarif etmek için çaba harcamanıza gerek yok; sadece şunları yapmanız yeterli:

1. Ekran Kaydı: Beğendiğiniz bir web sitesi etkileşimini veya Uygulama animasyonunu kaydedin.
2. Besleme: Videoyu Kimi k2.5'e atın.
3. Üretme: UI değişikliklerini kare kare analiz edecek ve aynı CSS animasyonları ve JS etkileşim mantığına sahip kodu doğrudan üretecektir.

Gerçek Dünya Örneği: Bir geliştirici, karmaşık bir Paralaks Kaydırma (Parallax Scrolling) web sayfasını kaydetti. Kimi k2.5 sadece düzeni geri yüklemekle kalmadı, aynı zamanda kaydırma ile tetiklenen animasyon zaman çizelgesini de doğru bir şekilde kopyaladı ve hatta yumuşatma işlevi (Easing Function) parametrelerini neredeyse mükemmel bir şekilde ayarladı.

📺 Video Demo: New Kimi K2.5: Build and Automate ANYTHING!

Öne Çıkanlar: Bu video, en akıl almaz özelliği gösteriyor — ekran kaydından koda. İçerik oluşturucu, karmaşık paralaks kaydırma animasyonlarına sahip bir web sitesini kaydetti ve ardından videoyu Kimi'ye verdi; Kimi tüm etkileşim efektini neredeyse mükemmel bir şekilde kopyaladı.

Aşağıdaki içerik YouTube içerik oluşturucuları tarafından herkese açık olarak paylaşılmıştır ve yalnızca teknik gösterim ve eğitim amaçlıdır. Video telif hakkı orijinal yazara aittir. Video sahibi bağlantıyı kaldırmak isterse, lütfen bizimle iletişime geçin, hemen ilgilenelim.

2. Otonom Görsel Hata Ayıklama (Autonomous Visual Debugging)

Frontend kodu yazmanın en acı verici kısmı nedir? "Kodu değiştir -> Tarayıcıyı yenile -> Hizalanmamış olduğunu gör -> Kodu tekrar değiştir" döngüsüdür. Kimi k2.5, Kapalı Döngü Görsel Hata Ayıklama yeteneklerini sunar:

• Kodu ürettikten sonra, sonucu kendisi "render" eder.
• Render edilen sonuç ile sağladığınız orijinal tasarım arasında piksel düzeyinde bir karşılaştırma yapar.
• Farklılıklar (örneğin, bir düğme 5px solda) bulursa, görsel efekt tamamen tutarlı olana kadar kodu otomatik olarak değiştirir.

Tüm süreç sizin müdahalenizi gerektirmez; mükemmel olana kadar durmayacak OKB'li bir tasarımcı gibidir.

3. Eskizden Tam Fonksiyonel Uygulamaya

Sadece statik sayfalar değil, Kimi k2.5 tüm bir uygulamanın mantıksal akışını anlayabilir.

• Ona bağlantı çizgileriyle dolu bir beyaz tahta eskizi verin ve "Bu giriş sayfası, ana sayfaya bağlı, açılır pencere için buraya tıklayın" diye tanıyabilir.
• Yönlendirme, durum yönetimi ve hatta arka uç arayüz simülasyonu dahil olmak üzere eksiksiz frontend proje kodunu doğrudan üretebilir.
• Hatta karmaşık görsel labirentleri çözdüğünü ve görselleştirilmiş bir BFS (Genişlik Öncelikli Arama) algoritması demosu yazdığını gösteren durumlar bile var, bu da onun sadece görselleri "taklit etmediğini", aynı zamanda gerçek görsel akıl yürütme gerçekleştirdiğini kanıtlıyor.

Bu Neden Önemli?

Kimi k2.5'in görsel kodlaması sadece kodlamayı hızlandırmakla kalmaz; "Niyet İletişimi" eşiğini düşürür.

Geçmişte, YZ'yi düzenleri değiştirmeye yönlendirmek için profesyonel terminolojiyi (Margin, Padding, Flexbox) bilmeniz gerekiyordu. Şimdi, sadece görüntüdeki bir noktayı daire içine alıp "Bu doğru değil, videodaki gibi hareket ettir" demeniz yeterli ve o anlıyor. Bu, ürün yöneticilerine, tasarımcılara ve hatta sıradan kullanıcılara ilk kez doğrudan yüksek kaliteli prototipler oluşturma yeteneği veriyor.

Moonshot AI bu deneyime "Vibe Coding" (Ortam Kodlaması) diyor — siz sadece ortamı (vibe) yönetin ve kirli işi Kimi'ye bırakın.

Kendiniz denemek ister misiniz? Kimi k2.5 şu anda OpenClaw ve Fireworks AI platformlarında yayında ve API çağrılarını destekliyor. Tasarımlarınızı ve ekran kayıtlarınızı hazırlayın ve sınırlarını zorlayın.