ProjectsJune 19, 2026

Panggih Sedulur: Kuisioner Minat Bakat UKM Unsoed

Panggih Sedulur Apps

Panggih Sedulur Apps adalah platform kuisioner interaktif untuk minat bakat UKM Unsoed. Sistem ini memadukan form biodata, tes minat bakat yang dilengkapi branching logic, dan kalkulasi rekomendasi personal yang akurat menggunakan integrasi Supabase.

🚀 Tech Stack

Sistem ini dikembangkan dengan tech stack modern untuk memastikan performa yang cepat dan pengalaman pengguna yang optimal:

Framework: Next.js (App Router)
Styling: Tailwind CSS
Form & Validasi: React Hook Form + Zod
Database: Supabase
Language: TypeScript

🎯 Kategori Utama & Alur Logika

Sistem scoring kuisioner ini difokuskan pada 5 kategori utama pada scoring level 1:

Olahraga
Seni
Penalaran
Pecinta Alam
Sosial & Disiplin

(Catatan: Kategori seperti Kerohanian, jalur KIP-K, dan spesifikasi Fakultas diterapkan secara dinamis sebagai pre-filter dari data biodata yang diinput oleh user).

Alur Implementasi Kuisioner:

Pengisian Biodata: Pengguna mengisi form di /kuisioner/biodata yang kemudian disimpan secara persisten di sesi browser (localStorage).
Soal Level 1: Pengguna menjawab 5 pertanyaan awal yang berfungsi menentukan skor dasar tiap kategori.
Branching Logic: Sistem mendeteksi 2 kategori tertinggi dari hasil scoring level 1. Selanjutnya, sistem secara pintar menampilkan pertanyaan lanjutan (level 2 dan 3) secara berurutan khusus untuk kategori teratas tersebut.
Kalkulasi Rekomendasi: Rekomendasi UKM terbaik dihasilkan dengan menggabungkan:
- Hasil jawaban dari branching (paling spesifik sesuai minat)
- Aturan Pre-filter dari biodata (Agama, KIP-K, Fakultas)
- Fallback scoring apabila alur branching tidak menghasilkan rekomendasi spesifik.
Penyimpanan Data: Seluruh hasil tes dan detail rekomendasi UKM direkam di tabel student_results di dalam database Supabase.
Result Page: Pengguna langsung diarahkan ke /kuisioner/result untuk melihat hasil rekomendasi secara interaktif.

📁 Struktur Implementasi

Sistem terorganisasi ke dalam modul-modul efisien:

Data & Validasi:
- lib/schema.ts (Validasi struktur data menggunakan Zod)
- lib/questions.ts (Bank soal dan skenario branching logic)
- data/UkmLogic.ts (Algoritma rekomendasi spesifik per UKM)
Komponen Interaktif:
- BiodataForm.tsx (Penanganan form interaktif untuk user)
- QuestionCard.tsx & ProgressBar.tsx (UI tes interaktif)
- UkmCard.tsx (Visualisasi detail hasil rekomendasi)
Backend & Database:
- lib/supabase.ts (Konfigurasi dan integrasi client Supabase)
- Sinkronisasi asinkron yang andal.

📋 Status Pengembangan

✅ Alur end-to-end (biodata -> tes -> hasil) telah berfungsi 100%.
✅ Fitur branching question interaktif berjalan lancar.
✅ Sistem penyimpanan data terintegrasi real-time ke backend Supabase.
✅ Routing yang rapi dan terlokalisasi di prefix /kuisioner.

Related projects

Rumio.id: Platform Marketing & Eksplorasi Properti Generasi Baru

Rumio.id adalah platform pemasaran dan eksplorasi properti komprehensif yang dirancang untuk menghubungkan pencari, pemilik, dan agen properti dengan pengalaman interaktif 360° menggunakan teknologi web modern.

Read case study View project

Website Resmi BEM Universitas Jenderal Soedirman

Pengembangan dan pengelolaan website resmi Badan Eksekutif Mahasiswa Universitas Jenderal Soedirman (BEM-U) menggunakan WordPress, Elementor, dan custom inject HTML.

Read case study View project

URL Shortener BEM Unsoed Edition

Pengembangan aplikasi pemendek URL profesional dengan antarmuka Glassmorphism untuk kebutuhan publikasi BEM Universitas Jenderal Soedirman.

Read case study View project

GrowTo: Platform Direktori Delivery Order Purwokerto

Pengembangan platform informasi layanan delivery order untuk area Purwokerto sebagai Final Project program Soedirman Digital School 2025.

Read case study View project

NiceGuy Sound Board

Buat para streamer laper yang pengen naik kereta Bigmo via Soundboard telah kami sediakan aplikasi yang sudah sepaket dengan sound2 yang sering digunakan oleh rektor kita BIGMO.

Read case study View project

Edu-Tajwid: Platform Edukasi Digital Ilmu Tajwid

TajwidApps adalah platform edukasi berbasis web yang dirancang untuk membantu pengguna mempelajari hukum bacaan Al-Qur'an (Tajwid), makharijul huruf, dan sifat huruf secara fasih dan tartil.

Read case study View project

Transformasi Digital Rabiha Tour & Travel: Branding dan Pengembangan Website

Pengembangan identitas visual, desain konten media sosial menggunakan CorelDRAW & Photoshop, serta pembangunan website company profile menggunakan WordPress Elementor.

Read case study

Najmi Calculator: Kalkulator Interaktif dengan Fitur Real-Time

Pengembangan aplikasi kalkulator responsif menggunakan Vanilla JavaScript dengan fitur Dark Mode dan sistem Error Handling kustom.

Read case study View project