Canvas: bir modelin yazdığı her şey için canlı önizleme paneli

Çoğu sohbet aracı size bir kod bloğu verir ve bol şans diler. Onu bir editöre kopyalarsınız, bir dosya kaydedersiniz, bir tarayıcı açarsınız, biraz yanlış olduğunu görürsünüz, sohbete geri dönersiniz, düzeltmeyi yapıştırırsınız ve tekrarlarsınız. Canvas, bu döngüdeki her adımı kaldırır — önemli olan iki adım dışında: sorun ve bakın.

Canvas nedir

Bir modelin yanıtı render edilebilir bir şey içerdiğinde, konuşmanın yanında bir önizleme paneli açılır ve onu canlı gösterir. HTML bir sayfa olarak render edilir. SVG görüntü olarak render edilir. Bir Mermaid bloğu diyagrama dönüşür. Markdown biçimlendirilmiş metne dönüşür. Model yazmayı bitirir bitirmez kaynağı değil, sonucu görürsünüz.

Sohbet solda, render edilmiş yapıt sağda kalır. Konuşmaya devam edersiniz — “başlığı küçült,” “daha koyu bir arka plan kullan,” “yeniden deneme yolu için bir düğüm ekle” — ve model revize ettikçe önizleme güncellenir. Kopyala yok, yapıştır yok, ikinci uygulama yok.

Hakkını verdiği yer

Bir angaryadan bir konuşmaya dönüştürdüğü birkaç şey:

• Landing bölümleri ve e-posta HTML’i. Bir hero bölümünü tarif edin, render edilişini izleyin, doğru görünene kadar düz dille boşluğa ve renge ince ayar yapın. Bir şeyin tarifi üzerinde değil, şeyin kendisi üzerinde tekrarlıyorsunuz.
• Diyagramlar. Bir kimlik doğrulama el sıkışmasının akış şemasını ya da bir isteğin sıra diyagramını isteyin. Mermaid onu anında render eder ve “şu iki adımı yer değiştir” elle yeniden çizmek yerine tek bir cümle olur.
• Grafikler ve SVG. Hızlı veri eskizleri, simgeler, basit illüstrasyonlar. Onları tam boyutta görür ve konuşarak iyileştirirsiniz.
• Uzun biçimli yazı. Markdown gerçek başlıklar ve yapıyla render edilir, böylece bir okuyucunun okuyacağı şekilde belgeyi okursunuz, ham yıldız işaretlerine gözlerinizi kısarak bakmazsınız.

Model seçiciyle çalışır

Canvas tek bir sağlayıcıya bağlı değil. Bir düzeni hızlı bir modelle taslaklayın, sonra zor kısmı daha güçlü bir modele dallandırın — önizleme kazanan dalı takip eder. Yapıt tek bir modelin kum havuzunun içinde değil, konuşmanın yanında yaşadığı için, model değiştirmek yapmakta olduğunuz işe mal olmaz. Render sadece yeni yanıta karşı yeniden çalışır.

Tüm studyonun üzerine kurulduğu ilke de bu: yararlı şey (burada, canlı bir yapıt) tek bir modelin duvarlarla çevrili özellik setine değil, sizin konuşmanıza aittir.

Dille tekrarlayın, kaynağı teslim alın

Önizleme doğru göründüğünde, kaynak tam orada, yanınızda götürmeniz için — HTML’i kopyalayın, SVG’yi dışa aktarın, Mermaid tanımını kapın. Canvas, yalnızca kendisinin okuyabileceği bir kara kutu değil; tamamen size ait olan kaynağa ulaşmanın daha hızlı bir yolu. Tekrarlamayı düz dille yaptınız ve sonunda prodüksiyona hazır çıktı aldınız.

Etkisi boyunu aşan küçük bir özellik

Canvas, modellerin sahip olmadığı bir yetenek eklemez — her zaman HTML yazabiliyorlardı. Kaldırdığı şey, yazılan ile görülen arasındaki boşluk. O boşluğu kapatmak çalışma şeklinizi değiştiriyor: modelin çıktısını sonra değerlendirilecek bir taslak gibi ele almayı bırakıyor ve onu tam şu anda, gerçek zamanlı, aynı pencerede şekillendirdiğiniz bir şey gibi ele almaya başlıyorsunuz. Bir aracı hızlı hissettiren şeyin çoğu da işte bu çıkıyor.