/tutorial/Membuat Quiz Online dari Canva AI yang Terhubung ke Google Spreadsheet

Membuat Quiz Online dari Canva AI yang Terhubung ke Google Spreadsheet

Oleh Tutupinono • 03 Oct 2025

Di era digital, pembelajaran interaktif semakin penting untuk meningkatkan motivasi siswa. Salah satu cara kreatif yang bisa dilakukan adalah membuat quiz online berbasis Canva AI, yang tidak hanya menyenangkan tetapi juga dapat menyimpan hasil jawaban otomatis ke Google Spreadsheet. Dengan begitu, guru bisa memantau nilai siswa secara real-time.

Tutorial ini akan memandu langkah demi langkah mulai dari Google Form → ChatGPT → Google Sheet → ChatGPT → Canva AI → Netlify, hingga quiz online siap digunakan siswa.

1. Buat Form di Google Form

  1. Buka Google Drive.

  2. Klik + Blank Form untuk buat form baru.

  3. Tambahkan kolom:

    • Nama → pilih Short Answer.

    • Kelas → pilih Dropdown atau Short Answer.

    • Skor → pilih Short Answer (atau Number kalau mau angka aja).

  4. Simpan form. Otomatis, Google Form akan membuat Google Spreadsheet untuk menyimpan data jawaban.

2. Buat Spreadsheet untuk Menyimpan Data

  1. Klik ikon spreadsheet di Google Form (⚡ Link to Sheets).

  2. Pastikan nama sheet default = Sheet1.

  3. Catat ID Spreadsheet dari URL.

    • Contoh: https://docs.google.com/spreadsheets/d/1PRmANKHJs1tnGC6DDqGWiIPZXBASgzqPmJKxXnqIM0Y/edit#gid=0

      Maka ID nya adalah = 1PRmANKHJs1tnGC6DDqGWiIPZXBASgzqPmJKxXnqIM0Y.

3. Buat Script di Google Apps Script

  1. Buka Google Apps Script.

  2. Klik New Project.

  3. Di file Code.gs, tempel script berikut:
    function doPost(e) { var ss = SpreadsheetApp.openById("1PRmANKHJs1tnGC6DDqGWiIPZXBASgzqPmJKxXnqIM0Y"); // ganti dengan ID spreadsheet kamu var sheet = ss.getSheetByName("Sheet1"); var nama = e.parameter.nama; var kelas = e.parameter.kelas; var skor = e.parameter.skor; sheet.appendRow([new Date(), nama, kelas, skor]); return ContentService.createTextOutput("Success").setMimeType(ContentService.MimeType.TEXT); }

  1. Klik Deploy → New Deployment.

  2. Pilih Web App.

    • Execute as: Me (owner).

    • Who has access: Anyone (atau sesuai kebutuhan).

  3. Salin URL Web App.
    Contoh:
    https://script.google.com/macros/s/AKfycbzpudZ_pTkiBCFDtqPKDwioPSxC1nnmRdbgiCFXFXmJxICklreVurVgvBBjy3v-nSBf/exec

4. Buat Soal Quiz dengan ChatGPT untuk Canva AI

Prompt yang bisa digunakan di ChatGPT:

"Buatkan 5 soal ujian online untuk Mata Pelajaran Ilmu Pengetahuan Alam dan Sosial (IPAS) dengan tema Peduli Lingkungan. Soal berbentuk pilihan ganda dengan 4 opsi jawaban. Setelah siswa menjawab, hitung nilainya: jika nilainya 80 atau lebih, berikan pujian yang membangun. Jika kurang dari 80, berikan semangat dan arahkan siswa untuk menekan tombol 'Ulangi'. Sertakan ilustrasi, animasi ringan, dan tombol navigasi. Gunakan font yang kekanak-kanakan, layout responsif di HP, dan elemen desain yang menyenangkan agar siswa Sekolah Dasar termotivasi belajar."

ChatGPT akan memberikan kode HTML/JS yang bisa dipakai di Canva AI (Code App).

5. Integrasikan Quiz ke Spreadsheet

Di bagian script fetch (HTML/JS hasil dari ChatGPT), gunakan: fetch("https://script.google.com/macros/s/AKfycbzpudZ_pTkiBCFDtqPKDwioPSxC1nnmRdbgiCFXFXmJxICklreVurVgvBBjy3v-nSBf/exec", { method: "POST", mode: "no-cors", body: new URLSearchParams({ "nama": nama, "kelas": kelas, "skor": skor }) });

Dengan ini, nilai dari quiz Canva akan otomatis tersimpan ke Google Sheet.

6. Buat Tampilan Quiz di Canva AI

  1. Buka Canva AI + Code.

  2. Masukkan kode HTML/JS hasil dari ChatGPT.

  3. Tambahkan elemen visual: ilustrasi, warna cerah, animasi ringan.

  4. Gunakan font yang ramah anak (misalnya Comic Sans, Baloo, atau Fredoka).

  5. Uji coba quiz langsung di Canva.

7. Publish dengan Netlify 🚀

  1. Export file HTML/JS dari Canva AI.

  2. Buka Netlify.

  3. Login → klik New Site from Git / Deploy Manually.

  4. Drag & drop file quiz HTML/JS ke Netlify.

  5. Netlify akan memberi link (contoh: quiz-anak.netlify.app).

Membuat Quiz Online dari Canva AI yang Terhubung ke Google Spreadsheet
← Kembali