Setelah mengulas latar belakang dan potensi disruptif dari Canva Code 2.0 pada artikel seri pertama, sekarang saatnya kita masuk ke ranah praktis. Bagaimana sebenarnya cara memanfaatkan teknologi text-to-code ini untuk kebutuhan proyek kampus, portofolio mahasiswa, atau landing page kegiatan organisasi?
Berikut adalah tutorial singkat langkah demi langkah bagi pemula untuk menghasilkan website fungsional penuh tanpa menulis satu baris kode pun secara manual.
Langkah 1: Mengakses Ruang Kerja Canva Code 2.0
Buka platform melalui peramban web atau aplikasi desktop Anda. Pada halaman utama, pilih menu “Create a Design” lalu cari opsi “AI Website Builder (Code 2.0)”. Anda akan diarahkan ke kanvas kerja hibrida yang menggabungkan elemen visual dan konsol perintah AI.
Langkah 2: Merumuskan Prompt (Instruksi Teks)
Kunci utama keberhasilan website yang dihasilkan AI terletak pada seberapa detail instruksi yang Anda berikan. Hindari kalimat yang terlalu singkat seperti “Buat website kampus”. Sebaliknya, gunakan struktur prompt yang mencakup tujuan, elemen visual, dan fitur fungsional yang diinginkan.
-
Contoh Prompt untuk Portofolio Mahasiswa:
"Buat sebuah website portofolio akademik untuk mahasiswa teknik informatika. Gunakan tema warna modern dengan dominasi biru gelap dan aksen neon cyan. Halaman harus memiliki 4 bagian: Banner perkenalan diri, galeri proyek riset dengan efek hover, daftar keahlian menggunakan progress bar visual, dan formulir kontak interaktif yang terhubung ke email."
Langkah 3: Proses Generation dan Preview
Masukkan prompt tersebut ke dalam kolom instruksi di bagian kiri layar, lalu tekan tombol “Generate Website”. AI akan mulai menyusun kode, tata letak, dan logika fungsional dalam waktu sekitar 30 hingga 60 detik. Setelah selesai, Anda dapat langsung melihat pratinjau (live preview) interaktif halaman tersebut di sisi kanan kanvas.
Langkah 4: Kustomisasi Visual dan Logika Tambahan
Jika ada elemen yang kurang sesuai, Anda tidak perlu membongkar baris kode. Cukup klik pada komponen yang ingin diubah (misalnya area tombol atau skema warna), lalu ketikkan perintah revisi pada asisten AI yang tersedia, seperti:
"Ubah bentuk tombol menjadi sedikit melengkung (rounded) dan ganti teksnya menjadi 'Lihat Portofolio'."
Langkah 5: Penerbitan (Deployment)
Jika dirasa sudah sempurna, klik tombol “Publish Website” di pojok kanan atas. Sistem akan memberikan opsi untuk menggunakan domain gratis bawaan platform atau menghubungkannya ke domain institusi kampus Anda. Klik konfirmasi, dan dalam hitungan detik, website Anda sudah aktif secara global dan dapat diakses oleh siapa saja.
Tips Tambahan untuk Mahasiswa: Manfaatkan fitur ini untuk membuat purwarupa cepat saat mengikuti kompetisi bisnis digital atau hackathon. Fokuslah pada inovasi ide, dan biarkan AI menyelesaikan infrastruktur web dasar Anda!