🏠 Kembali ke Portal Utama (tawau.netlify.app) Bengkel AI Agentic TVET 2026
Lembaran Amali 3 Pentaksiran Formatif Harian Localhost TVET Server & CQI

Sistem Exit Ticket Formatif & Automasi Laporan CQI Localhost

Panduan Pengarahan Berfasa Kepada Antigravity IDE untuk Membina Sistem Pentaksiran Makmal Serta-Merta
Matlamat Utama Menguasai Arahan Prompting Ejen Antigravity
Persekitaran Sasaran Localhost / XAMPP Makmal TVET (Wi-Fi LAN)
Output Akhir Pensyarah Web Pelajar + Papan Kawalan CQI AI
Masa Perlaksanaan 35 Minit Amali Berpandu

1. Pengenalan & Matlamat Hands-On

Dalam amali ini, pensyarah BUKAN perlu menaip beratus baris kod secara manual. Sebaliknya, pensyarah akan belajar cara mengarahkan Antigravity IDE (*Agentic Prompting*) secara berfasa untuk membina sebuah sistem pentaksiran formatif (*Exit Ticket*) yang berjalan sepenuhnya di atas pelayan komputer makmal (*Localhost*).

🎯 Kelebihan Sistem Localhost untuk TVET:
1. Bebas Masalah Internet: Pelajar boleh akses menggunakan telefon pintar melalui Wi-Fi makmal dengan membuka alamat IP pensyarah (contoh: http://10.12.30.82:8088/exitticket).
2. Fleksibel Mengikut Topik: Pensyarah boleh menukar set soalan bila-bila masa mengikut topik kuliah hari tersebut.
3. Penjana Ulasan CQI 1-Klik: AI terus merumuskan refleksi pengajaran & pelan intervensi berdasarkan soalan yang pelajar gagal kuasai hari ini.

2. Alur Pengarahan Antigravity IDE (Fasa Demi Fasa)

Sila salin dan laksanakan arahan prompt mengikut turutan fasa di bawah di dalam tetingkap chat Antigravity IDE anda:

FASA 01 Mengarahkan AI Membina Struktur Data & Bank Soalan Topik
📌 Objektif Pensyarah: Meminta ejen mencipta fail konfigurasi soalan.json yang mengandungi soalan formatif aneka pilihan (MCQ) mengikut topik TVET.
[ROLE] Anda ialah Arkitek Sistem Penilaian TVET & Pembangun PHP/JSON. [TASK] Cipta satu fail bernama `soalan.json` yang menyimpan bank soalan formatif mengikut topik kursus STM21673 Web Development. [CONTEXT & STRUCTURE] Sertakan sekurang-kurangnya 2 topik: - Topik 1: "Asas Sintaks & Pembolehubah PHP" (3 soalan) - Topik 2: "Operasi CRUD & Pangkalan Data MySQL" (4 soalan) Setiap soalan mesti mengandungi atribut: id, soalan, pilihan (A, B, C, D), jawapan_betul (A/B/C/D), aras_bloom (C1-C4), dan penerangan_jawapan.
✅ Semakan Output: Antigravity akan mencipta fail soalan.json secara automatik di direktori projek anda.
FASA 02 Mengarahkan AI Membina Antaramuka Pelajar (Exit Ticket Mobile Form)
📌 Objektif Pensyarah: Meminta ejen membina halaman web index.php yang mesra telefon bimbit (responsif) untuk pelajar menjawab kuiz.
[ROLE] Anda ialah Pakar Frontend & PHP Developer. [TASK] Bina fail `index.php` untuk antaramuka pelajar menjawab Exit Ticket Formatif harian di telefon pintar. [REQUIREMENTS] 1. Reka bentuk bersih berteraskan Apple/Stripe UI (font Plus Jakarta Sans, card-bg putih, border-radius lembut). 2. Borang mengandungi medan wajib: "Nama Penuh Pelajar" dan "Nombor Matrik". 3. Skrip membaca soalan secara dinamik daripada `soalan.json` berdasarkan topik aktif yang dipilih oleh pensyarah. 4. Apabila pelajar menekan butang "Hantar Jawapan", proses pengiraan markah berlaku dan simpan rekod respon ke dalam fail `respon_pelajar.json` (mengandungi timestamp, nama, matrik, markah, dan jawapan setiap soalan). 5. Paparkan skor serta-merta kepada pelajar berserta mesej motivasi.
✅ Semakan Output: Fail index.php siap dicipta. Pelajar boleh membuka borang ini dari mana-mana pelayar web.
FASA 03 Mengarahkan AI Membina Papan Kawalan Pensyarah (Admin Live Dashboard)
📌 Objektif Pensyarah: Meminta ejen membina admin.php untuk menukar topik soalan, memantau kemasukan respon pelajar secara langsung, dan menganalisis kadar peratusan lulus soalan.
[ROLE] Anda ialah Pembangun Dashboard TVET & Analitik Data. [TASK] Bina fail `admin.php` sebagai Pusat Kawalan Pensyarah untuk memantau pentaksiran formatif makmal secara langsung. [FEATURES] 1. Dropdown untuk pensyarah memilih "Topik Aktif Hari Ini" daripada `soalan.json`. 2. Kad Metrik Bento: - Jumlah Pelajar Menjawab (Live Counter) - Purata Skor Kelas (%) - Kadar Lulus Keseluruhan 3. Jadual Analisis Soalan: Menunjukkan % pelajar yang menjawab betul bagi setiap soalan (membantu mengesan soalan mana yang pelajar gagal faham). 4. Senarai Rekod Pelajar (Nama, Matrik, Masa, Skor). 5. Butang Pintas "⚡ Jana Rumusan CQI Harian (AI)".
✅ Semakan Output: Fail admin.php siap dicipta. Pensyarah boleh melihat statistik pelajar dalam masa nyata.
FASA 04 Mengarahkan AI Mengintegrasikan Enjin Refleksi & Ulasan CQI Harian
📌 Objektif Pensyarah: Meminta ejen mencipta fungsi pemprosesan AI untuk membaca peratusan kegagalan soalan dan menjana perenggan ulasan CQI rasmi sedia tampal ke Buku Rekod Mengajar (BRM).
[ROLE] Anda ialah Pakar Penjaminan Kualiti Akademik TVET (MQA/JPPKK Auditor). [TASK] Bina skrip `cqi_engine.php` (atau modal interaktif di `admin.php`) yang mengambil data analitik respon pelajar hari ini dan menjana Laporan CQI Harian secara automatik. [OUTPUT FORMAT] Hasilkan ulasan profesional mengandungi: 1. **Refleksi Pengajaran & Analisis Penguasaan:** Merumuskan tahap pencapaian kelas dan mengenal pasti punca salah faham konsep (misconception) bagi soalan yang mendapat peratusan terendah. 2. **Pelan Intervensi & Tindakan Pembetulan (3 Poin):** Tindakan pemulihan praktikal yang perlu dilakukan pada 15 minit permulaan kelas seterusnya sebelum beralih ke topik baharu. 3. Sediakan butang "Salin Teks CQI" untuk memudahkan pensyarah menyalin terus ke e-Portfolio / BRM.
✅ Semakan Output: Sistem kini mempunyai butang jana CQI yang menghasilkan ulasan akademik tulen berasaskan data jawapan pelajar hari tersebut.
FASA 05 Uji Lari Pelayan Localhost & Akses Melalui Wi-Fi Makmal
📌 Objektif Pensyarah: Menjalankan pelayan web tempatan PHP terbina dalam terminal Antigravity dan mendapatkan alamat IP rangkaian makmal.
# 1. Jalankan pelayan PHP Localhost di Terminal Antigravity IDE: php -S 0.0.0.0:8080 # 2. Dapatkan Alamat IP Komputer Makmal Anda (PowerShell / CMD): ipconfig # (Cari alamat IPv4 Address anda, contohnya: 10.12.30.82 atau 192.168.1.50) # 3. Pautan untuk telefon pelajar menjawab di makmal: http://[ALAMAT_IP_ANDA]:8080/index.php
✅ Uji Lari Rakan Sebelah: Minta rakan pensyarah sebelah anda membuka pautan IP anda di telefon bimbit mereka dan cuba menjawab kuiz formatif tersebut!

3. Lampiran: Contoh Kod Penuh Rujukan Sistem

*(Nota: Kod di bawah disediakan sebagai rujukan semakan. Ejen AI Antigravity anda akan menjana kod serupa secara automatik apabila anda memasukkan arahan prompt di atas).*

📄 Lampiran A: Struktur Data soalan.json
{
  "topik_aktif": "topik_2",
  "senarai_topik": {
    "topik_1": {
      "nama": "Topik 1: Asas Sintaks & Pembolehubah PHP",
      "soalan": [
        {
          "id": 1,
          "soalan": "Simbol manakah yang digunakan untuk mengisytiharkan pembolehubah dalam PHP?",
          "pilihan": {"A": "@", "B": "$", "C": "#", "D": "&"},
          "jawapan_betul": "B",
          "aras": "C1"
        }
      ]
    },
    "topik_2": {
      "nama": "Topik 2: Operasi CRUD & Pangkalan Data MySQL",
      "soalan": [
        {
          "id": 1,
          "soalan": "Apakah fungsi utama pembolehubah $conn di dalam fail sambungan pangkalan data?",
          "pilihan": {
            "A": "Menyimpan objek sambungan aktif ke pelayan MySQL",
            "B": "Memadam data jadual secara automatik",
            "C": "Menukar nama pangkalan data",
            "D": "Menghasilkan borang HTML"
          },
          "jawapan_betul": "A",
          "aras": "C2"
        },
        {
          "id": 2,
          "soalan": "Apakah risiko utama sekiranya arahan 'DELETE FROM produk;' dijalankan tanpa klausa WHERE?",
          "pilihan": {
            "A": "Hanya satu baris data terpadam",
            "B": "Keseluruhan rekod di dalam jadual produk akan dipadamkan",
            "C": "Pangkalan data akan menghasilkan ralat sintaks",
            "D": "Jadual produk akan dibuang (DROP)"
          },
          "jawapan_betul": "B",
          "aras": "C4"
        }
      ]
    }
  }
}
📄 Lampiran B: Contoh Logik Pemprosesan index.php (Pelajar)
<?php
// Baca soalan aktif daripada soalan.json
$data = json_decode(file_get_contents('soalan.json'), true);
$topik_key = $data['topik_aktif'];
$topik = $data['senarai_topik'][$topik_key];

$mesej_skor = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $nama = htmlspecialchars($_POST['nama']);
    $matrik = htmlspecialchars($_POST['matrik']);
    $jawapan_pelajar = $_POST['jawapan'] ?? [];
    
    $betul = 0;
    $jumlah_soalan = count($topik['soalan']);
    
    foreach ($topik['soalan'] as $s) {
        $id = $s['id'];
        if (isset($jawapan_pelajar[$id]) && $jawapan_pelajar[$id] === $s['jawapan_betul']) {
            $betul++;
        }
    }
    
    $skor_peratus = round(($betul / $jumlah_soalan) * 100);
    
    // Simpan respon ke fail respon_pelajar.json
    $respon_file = 'respon_pelajar.json';
    $senarai_respon = file_exists($respon_file) ? json_decode(file_get_contents($respon_file), true) : [];
    $senarai_respon[] = [
        'timestamp' => date('Y-m-d H:i:s'),
        'topik' => $topik_key,
        'nama' => $nama,
        'matrik' => $matrik,
        'skor' => $skor_peratus,
        'jawapan' => $jawapan_pelajar
    ];
    file_put_contents($respon_file, json_encode($senarai_respon, JSON_PRETTY_PRINT));
    
    $mesej_skor = "Tahniah $nama ($matrik)! Skor anda: $betul / $jumlah_soalan ($skor_peratus%)";
}
?>
Teks prompt berjaya disalin!