LITERA-AI Web Platform merupakan pusat kendali terintegrasi (Control Center) yang dirancang untuk mengelola seluruh ekosistem LITERA-AI (Literacy Intelligent Assistant). Proyek ini dibangun sebagai solusi digital inovatif di bawah naungan inisiatif P-LIDM (Platform Inovasi Teknologi AI dengan Asesmen Diagnostik Adaptif), dengan misi utama memulihkan dan meningkatkan kemampuan literasi membaca serta penalaran kritis (logical reasoning) bagi generasi muda Indonesia.
Berdasarkan data asesmen standar nasional dan PISA (Program for International Student Assessment), tingkat literasi membaca dan pemahaman teks sastra di kalangan murid sekolah Indonesia memerlukan intervensi taktis dan adaptif. Litera-AI memecahkan masalah ini dengan menyediakan jalur pembelajaran sastra yang dipersonalisasi:
- Bagi Siswa: Menggunakan aplikasi mobile untuk pengerjaan kuis adaptif berbasis AI, asisten membaca karya klasik, dan editor penulisan.
- Bagi Guru: Menggunakan dashboard web ini untuk memonitor hasil belajar, melacak kelemahan individu/kelas secara real-time, dan membagikan materi pengajaran digital.
- Bagi Orang Tua: Menggunakan portal web ini untuk mendampingi perkembangan kognitif literasi anak dengan arahan rekomendasi asisten AI di rumah.
Melalui integrasi dengan Google Gemini AI API, platform ini secara otomatis merumuskan soal kuis sastra dengan tingkat kesulitan berjenjang (Taksonomi Bloom) berdasarkan buku sastra klasik Indonesia pilihan guru (seperti angkatan Balai Pustaka, Pujangga Baru, hingga angkatan 45).
Sistem Litera-AI bekerja secara end-to-end melalui tahapan berikut untuk memberikan bimbingan belajar literasi sastra yang adaptif:
- Pendaftaran Akun & Penentuan Peran (Multi-Role Authentication):
- Pengguna (Murid, Guru, Orang Tua) mendaftar dan masuk ke sistem menggunakan autentikasi JWT-OTP yang aman di aplikasi mobile atau web control center.
- Asesmen Diagnostik Awal (Initial Diagnostic Assessment):
- Saat murid pertama kali membuka aplikasi mobile, mereka wajib mengikuti kuis asesmen awal untuk menilai tingkat pemahaman membaca (reading level: Pemula, Menengah, Mahir).
- Pemetaan Jalur Belajar Personal (Personalized Learning Path):
- Berdasarkan hasil asesmen, mesin AI menentukan daftar novel sastra klasik Indonesia yang paling cocok untuk dibaca oleh murid tersebut.
- Membaca dengan Asisten Interaktif (Interactive Reading):
- Murid membaca naskah sastra klasik di aplikasi. Saat menemui kosakata sulit atau majas, murid dapat menekan teks tersebut untuk mendapatkan penjelasan konteks instan dari asisten AI.
- Kuis Evaluasi Adaptif (Adaptive Quizzing & DDA):
- Setelah menyelesaikan bab membaca, murid mengerjakan kuis. Mesin AI (DDA) memantau akurasi jawaban dan durasi pengerjaan untuk menentukan tingkat kesulitan soal berikutnya secara dinamis.
- Pemantauan Guru & Orang Tua (Teacher & Parent Monitoring):
- Seluruh data keaktifan dan perkembangan kognitif murid disinkronkan ke server. Guru dapat memantau dispersi nilai kelas di dashboard web, dan orang tua dapat membaca rekomendasi panduan membaca dari AI untuk diterapkan di rumah.
Sistem Litera-AI didasarkan pada metodologi pedagogi modern dan arsitektur rekayasa perangkat lunak terdistribusi berikut:
- Asesmen Diagnostik Adaptif (Adaptive Diagnostic Assessment): Pendekatan evaluasi kognitif awal menggunakan klasifikasi berbasis kemahiran membaca (Reading Proficiency Level). Asesmen tidak hanya menilai benar/salah jawaban, tetapi juga memetakan kemampuan interpretasi alur, pengenalan gaya bahasa (majas), dan pemahaman semantik teks.
- Dynamic Difficulty Adjustment (DDA): Sistem penyesuaian kesulitan kuis secara real-time yang memposisikan belajar murid dalam Zone of Proximal Development (ZPD). Algoritma DDA memantau parameter rasio kebenaran (accuracy) dan latensi respon pengerjaan (response time) untuk menentukan tingkat kesulitan soal berikutnya secara dinamis, guna meminimalkan rasa frustrasi (jika soal terlalu sulit) atau kebosanan (jika soal terlalu mudah).
- Knowledge Tracing (Penelusuran Pengetahuan): Menganalisis akumulasi riwayat kuis murid untuk memetakan kekuatan dan kelemahan spesifik kognitif sastra mereka (misalnya, pengenalan majas personifikasi vs metafora).
- Modul Keamanan & Autentikasi (Auth & Security Hub):
- Fungsi: Mengatur izin akses multi-role (Guru, Orang Tua, Siswa, Admin).
- Logika Keamanan: Implementasi OTP token berdurasi pendek berbasis JWT (Json Web Token) untuk login aman serta logging IP Address pada audit log.
- Mesin Pembuat Soal Gemini AI (Gemini AI Quiz Generation Engine):
- Fungsi: Membuat soal kuis sastra secara otomatis.
- Logika: Menerima naskah novel dari pustaka digital, memproses prompt terstruktur (Taksonomi Bloom) melalui API Gemini, menghasilkan array JSON soal berformat terstandarisasi.
- Modul Sinkronisasi Data Luar Jaringan (Offline Data Sync Hub):
- Fungsi: Sinkronisasi database klien seluler dengan database server PostgreSQL.
- Logika: Menggunakan SQLite/Hive di sisi klien untuk antrean outbox, kemudian diproses dalam mode batch request oleh API backend FastAPI untuk pembaruan record
StudentProgressdan analitik monitoring kelas guru.
- Dashboard Analitik Guru & Orang Tua (Visual Analytics & Recommendations):
- Fungsi: Pengolahan data statistik keaktifan dan skor kuis menjadi visualisasi chart dispersion, serta penayangan tips bimbingan AI bagi orang tua.
- Analitik Visual & Dispersi Skor (Visual Analytics):
- Grafik interaktif untuk melacak waktu rata-rata membaca teks per halaman.
- Peta pemahaman membaca kelas (distribusi nilai kuis, penguasaan majas, pemahaman alur cerita).
- Identifikasi otomatis bagi murid yang membutuhkan perhatian khusus (students at risk).
- Mesin Pembuat Kuis AI Otomatis (Generative AI Quiz Builder):
- Guru memilih novel sastra klasik Indonesia (misal: Siti Nurbaya, Salah Asuhan, Ronggeng Dukuh Paruk).
- AI memproses naskah dan menghasilkan pertanyaan pilihan ganda atau esai pendek dengan rentang kesulitan kognitif yang bervariasi.
- Manajemen Bahan Ajar & Tugas Kelas:
- Distribusi buku membaca digital (.pdf / epub) langsung ke antrean aplikasi siswa.
- Pengaturan batas waktu pengerjaan tugas (due dates).
- Laporan Kinerja Berkala:
- Rekap mingguan pengerjaan latihan menulis esai dan kuis membaca anak.
- Perbandingan progress kognitif anak terhadap standar kurikulum nasional.
- Rekomendasi Pendampingan Belajar Rumah (AI Home-Reading Guide):
- Chatbot rekomendasi yang dilatih khusus untuk menyarankan buku sastra alternatif dan topik diskusi keluarga berdasarkan riwayat belajar anak.
- Dual OTP (One-Time Password) Token Flow:
- Setiap upaya login untuk peran guru dan administrator melewati verifikasi OTP berbasis SMS/Email yang dienkripsi menggunakan Token JWT (Json Web Token) berdurasi pendek (short-lived tokens).
- Logging Audit Log Komprehensif:
- Mencatat seluruh jejak audit administratif (siapa mengakses data apa, waktu login, dan perubahan parameter kelas) untuk mencegah kebocoran data.
Proyek ini menggunakan Prisma ORM untuk mendefinisikan relasi database PostgreSQL. Berikut adalah model utama yang diimplementasikan:
// Ringkasan Model Utama
model User {
id String @id @default(uuid())
email String @unique
name String
role Role
createdAt DateTime @default(now())
classrooms Classroom[] // Relasi bagi Guru
studentProgress StudentProgress? // Relasi bagi Murid
auditLogs AuditLog[]
}
enum Role {
ADMIN
EDUCATOR // Guru
STUDENT // Murid
PARENT // Orang Tua
}
model Classroom {
id String @id @default(uuid())
code String @unique // Kode unik akses siswa
name String
subject String
teacherId String
teacher User @relation(fields: [teacherId], references: [id])
students Student[]
quizzes Quiz[]
}
model StudentProgress {
id String @id @default(uuid())
studentId String @unique
student User @relation(fields: [studentId], references: [id])
readingLevel String @default("Pemula") // Pemula, Menengah, Mahir
points Int @default(0)
quizzesTaken Int @default(0)
averageScore Float @default(0.0)
}
model Quiz {
id String @id @default(uuid())
title String
classId String
classroom Classroom @relation(fields: [classId], references: [id])
questions Json // Menyimpan array soal buatan Gemini AI
createdAt DateTime @default(now())
}
model AuditLog {
id String @id @default(uuid())
userId String
user User @relation(fields: [userId], references: [id])
action String // Tindakan (Login, Generate Quiz, Add Material)
ipAddress String
createdAt DateTime @default(now())
}Platform web melayani pertukaran data API asinkron dengan rincian berikut:
| Route Path | Method | Auth | Deskripsi |
|---|---|---|---|
/api/auth/login |
POST |
None | Autentikasi awal pengguna menggunakan Email & Password. Menghasilkan session cookie. |
/api/auth/send-otp |
POST |
None | Mengirimkan kode verifikasi OTP ke kontak pengguna yang terdaftar. |
/api/auth/verify-otp |
POST |
None | Memverifikasi OTP dan menerbitkan token otentikasi JWT permanen. |
/api/auth/me |
GET |
Bearer Token | Memperoleh data profil login pengguna yang aktif beserta hak aksesnya. |
/api/assessment/submit |
POST |
Student Token | Mengirimkan respon jawaban asesmen diagnostik untuk evaluasi level kognitif literasi. |
/api/otp/audit-logs |
GET |
Admin Token | Mengambil daftar logs aktivitas audit sistem keamanan OTP untuk keamanan transaksi data. |
src/
βββ app/ # File routing utama berbasis Next.js App Router
β βββ (app)/ # Halaman aplikasi setelah terautentikasi
β β βββ guru/ # Modul guru (assignments, attendance, calendar, classes, materials, reports, settings)
β β βββ orang-tua/ # Modul orang tua (monitoring perkembangan kognitif anak)
β β βββ siswa/ # Modul visualisasi data kuis siswa web
β βββ admin/ # Panel audit administratif sistem
β βββ api/ # Route API endpoints (OTP, Auth, Assessment)
β βββ forgot-password/ # Halaman pemulihan password
β βββ register/ # Pendaftaran akun multi-role
β βββ page.tsx # Landing page utama Litera-AI (interaktif dengan landing page premium)
βββ components/ # Komponen UI global & reusable layouting
β βββ layout/ # Sidebar, Header, AppLayout yang responsif
β βββ auth-guard.tsx # Halaman pembatas akses otentikasi peran (role restriction guard)
βββ lib/ # Utilitas sistem, instance Prisma, dan Zustand global store
βββ repositories/ # Layer repository pattern untuk interaksi langsung dengan database PostgreSQL
βββ server/ # Konfigurasi asisten AI
β βββ ai/ # Gemini API Client wrapper
β βββ prompt-registry.ts# Template prompt sistem untuk pembuatan bank soal terstruktur
βββ services/ # Layer business logic aplikasi (OTP verification, Auth logic, DB sync)
Untuk memastikan keandalan pemrosesan asinkron dan estetika antarmuka premium, platform web Litera-AI menggunakan pustaka utama berikut:
| Pustaka (Library) | Versi | Peran & Alasan Penggunaan (Purpose) |
|---|---|---|
next |
16.2.10 |
Framework utama React untuk rendering Server-Side (SSR) & routing halaman asinkron secara cepat. |
@google/genai |
^2.10.0 |
Integrasi langsung dengan API Generative AI Google (Gemini) untuk pemrosesan teks sastra dan pembuatan kuis otomatis. |
@prisma/client |
^7.8.0 |
Object Relational Mapper (ORM) tipe-aman untuk komunikasi data yang efisien ke PostgreSQL. |
zustand |
^5.0.14 |
Manajemen state global client yang sangat ringan untuk mengelola status peran login tanpa overhead re-render. |
next-auth |
^5.0.0-beta |
Sistem pengelolaan sesi otentikasi multi-role yang aman dan teruji. |
framer-motion |
^12.42.2 |
Engine animasi mikro untuk transisi dashboard dan accordion FAQ yang smooth dan premium. |
nodemailer |
^7.0.13 |
Pengiriman email berisi token OTP untuk verifikasi masuk lapis ganda. |
bcryptjs |
^3.0.3 |
Enkripsi hashing password pengguna sebelum disimpan ke database PostgreSQL. |
Pastikan Node.js v18/v20+ dan PostgreSQL telah terpasang dan berjalan di server lokal.
Buat file .env pada direktori root proyek Next.js:
DATABASE_URL="postgresql://postgres:password123@localhost:5432/litera_web_db?schema=public"
GEMINI_API_KEY="AIzaSyA..."
OTP_SECRET="your-super-secret-jwt-key"npm installProses ini akan membuat tabel relasi database PostgreSQL secara otomatis dan mengisinya dengan materi sastra awal:
npx prisma db push
npx prisma db seednpm run devAplikasi web dapat diakses langsung pada port default http://localhost:3000.
Anda juga dapat membangun image dan menjalankan aplikasi ini di dalam container:
docker build -t litera-web-platform .
docker run -p 3000:3000 --env-file .env litera-web-platformBerikut adalah diagram alur visual bagaimana interaksi antar peran diatur dan terhubung secara internal dengan database PostgreSQL serta model generatif Gemini AI:
graph TD
A[Browser Client] -->|Routes| B[Next.js App Router]
subgraph Pages [Pages & Roles]
B -->|/guru| C[Teacher Dashboard]
B -->|/orang-tua| D[Parent Portal]
B -->|/siswa| E[Student Visualizer]
end
subgraph Backend_Services [Backend Services]
C & D & E -->|actions / handlers| F[Services & Logic Layer]
F -->|ORM mapping| G[Prisma Client]
G -->|reads/writes| H[(PostgreSQL DB)]
F -->|Generates Questions| I[Gemini AI Client]
end
Untuk memberikan gambaran yang lebih jelas tentang bagaimana data mengalir di platform ini, berikut adalah dua skenario penggunaan utama:
- Pilihan Novel: Guru masuk ke
/guru/materialsdan memilih naskah novel klasik Siti Nurbaya. - AI Generation: Guru mengklik tombol "Buat Kuis dengan AI". Tindakan ini memicu pemrosesan template prompt kognitif di
server/ai/prompt-registry.ts. - Penyimpanan JSON: API Gemini membalas dengan struktur array soal kuis (soal, pilihan jawaban, kunci, tingkat Bloom). Soal disimpan dalam field
Quiz.questionsberformat JSON di database PostgreSQL melalui Prisma. - Push Notification: Sistem memberitahu seluruh siswa kelas tersebut melalui WebSocket/Polling bahwa kuis membaca baru telah tersedia.
- Pengerjaan Soal: Siswa menyelesaikan kuis di aplikasi mobile. Data nilai, tingkat kesulitan, dan durasi pengerjaan dikirim ke server.
- Pembaruan Profil: Server memproses dan memperbarui record
StudentProgress(misalnya, mengubah status tingkat membaca siswa dari "Pemula" menjadi "Menengah"). - Visualisasi Dashboard: Guru membuka
/guru/reportsdan melihat chart dispersi nilai kelas terupdate, lengkap dengan identifikasi klaster siswa yang mengalami kesulitan membaca. - Rekomendasi Orang Tua: Wali murid masuk ke
/orang-tuadan menerima instruksi taktis berbasis AI: "Siswa mengalami kesulitan memahami majas sarkasme di Novel Salah Asuhan. Mohon dampingi dengan membacakan teks halaman 45-50 bersama."
LITERA-AI Web Platform memegang peran krusial sebagai pusat administrasi, visualisasi, dan pemantauan bagi guru serta orang tua untuk berkolaborasi mendampingi tumbuh kembang literasi anak secara sinergis. Kombinasi arsitektur Next.js 15 yang modern dan serverless-ready, data mapping aman Prisma, serta kecerdasan buatan Gemini AI menjamin bahwa Litera-AI siap digunakan dalam skala luas di sekolah-sekolah di Indonesia.
- Fase 1 (Selesai): Struktur dasar dashboard, login multi-role aman, generator soal adaptif dengan Gemini AI, dan koneksi Prisma DB.
- Fase 2 (Dalam Pengembangan): Implementasi analitik grafik interaktif yang menampilkan klaster kognitif siswa secara visual (Clustering Analysis) dan otomatisasi publikasi paket Docker di GitHub Packages (Selesai).
- Fase 3 (Mendatang): Modul evaluasi berbicara (speech-to-text pronunciation analyzer) guna menilai aspek pelafalan murid secara interaktif di browser.
