Lewati ke konten
← Semua artikel
2 min read Any AI Studio

Canvas: panel pratinjau langsung untuk semua yang ditulis model

Saat model menulis HTML, SVG, diagram Mermaid, atau Markdown, Anda semestinya tak perlu menyalinnya ke tempat lain untuk melihatnya. Canvas merendernya di samping chat dan memperbaruinya saat Anda beriterasi.

  • fitur
  • canvas

Kebanyakan tool chat menyerahkan Anda satu blok kode dan mendoakan Anda beruntung. Anda menyalinnya ke editor, menyimpan file, membuka browser, melihatnya sedikit salah, kembali ke chat, menempel perbaikannya, dan mengulang. Canvas menghapus setiap langkah dalam lingkaran itu kecuali dua yang penting: bertanya, dan melihat.

Apa itu Canvas

Saat jawaban model mengandung sesuatu yang bisa dirender, sebuah panel pratinjau terbuka di samping percakapan dan menampilkannya langsung. HTML dirender sebagai halaman. SVG dirender sebagai gambar. Blok Mermaid menjadi diagram. Markdown menjadi teks terformat. Anda melihat hasilnya, bukan kode sumbernya, persis saat model selesai menulisnya.

Chat tetap di kiri, artefak yang dirender di kanan. Anda terus berbicara — “buat headernya lebih kecil,” “pakai latar yang lebih gelap,” “tambah node untuk jalur retry” — dan pratinjaunya diperbarui saat model merevisi. Tanpa menyalin, tanpa menempel, tanpa aplikasi kedua.

Di mana ia menunjukkan nilainya

Beberapa hal yang ia ubah dari tugas menjemukan menjadi percakapan:

  • Bagian landing dan HTML email. Deskripsikan sebuah hero section, saksikan ia dirender, sesuaikan jarak dan warnanya dalam bahasa biasa sampai tampak pas. Anda beriterasi pada bendanya itu sendiri, bukan pada deskripsi bendanya.
  • Diagram. Minta flowchart sebuah auth handshake atau diagram sekuens sebuah request. Mermaid merendernya seketika, dan “tukar dua langkah ini” cukup satu kalimat alih-alih menggambar ulang manual.
  • Chart dan SVG. Sketsa data cepat, ikon, ilustrasi sederhana. Anda melihatnya dalam ukuran penuh dan memperhalusnya dengan berbicara.
  • Tulisan panjang. Markdown dirender dengan heading dan struktur sungguhan, jadi Anda membaca dokumen sebagaimana pembaca akan membacanya, bukan memicingkan mata pada tanda bintang mentah.

Ia bekerja dengan pemilih model

Canvas tak terikat ke satu provider. Buat draf tata letak dengan model cepat, lalu cabangkan bagian sulitnya ke model yang lebih kuat — pratinjau mengikuti cabang yang menang. Karena artefaknya hidup di samping thread alih-alih di dalam sandbox satu model, mengganti model tak membuat Anda kehilangan pekerjaan yang sedang berjalan. Rendernya tinggal dijalankan ulang terhadap jawaban yang baru.

Itu prinsip yang sama yang menjadi dasar seluruh studio: hal yang berguna (di sini, sebuah artefak langsung) milik percakapan Anda, bukan milik set fitur tertutup satu model.

Beriterasi dalam bahasa, ship sumbernya

Saat pratinjaunya tampak pas, sumbernya ada di situ untuk Anda bawa — salin HTML-nya, ekspor SVG-nya, ambil definisi Mermaid-nya. Canvas bukan kotak hitam yang hanya ia sendiri yang bisa membaca; ia adalah cara lebih cepat untuk mencapai sumber yang sepenuhnya Anda miliki. Anda beriterasi dalam bahasa biasa dan mendapat output siap produksi pada akhirnya.

Fitur kecil dengan efek di luar ukurannya

Canvas tak menambah kemampuan yang sebelumnya tak dimiliki model — mereka selalu bisa menulis HTML. Yang ia hapus adalah jurang antara ditulis dan dilihat. Menutup jurang itu mengubah cara Anda bekerja: Anda berhenti memperlakukan output model sebagai draf untuk dievaluasi nanti dan mulai memperlakukannya sebagai sesuatu yang sedang Anda bentuk saat ini, secara real-time, di jendela yang sama. Ternyata itulah sebagian besar dari yang membuat sebuah tool terasa cepat.


Menemukan typo atau ingin berkomentar? Email kami .

Coba produk di balik tulisan ini.
studio.

Tier gratis. Tanpa kartu kredit. Masuk dengan Google atau Apple.