Aplikasi web interaktif terstandarisasi untuk mengevaluasi potensi kecerdasan, tipe kepribadian karir, dan metode belajar optimal seseorang. Dirancang dengan antarmuka modern premium, visualisasi radar chart dinamis, dan integrasi pengumpulan data secara real-time.
-
Coba Aplikasi (Live Demo):
👉 Aplikasi Tes Potensi Diri (Vercel) -
Database Hasil Tes (Google Sheets):
👉 Spreadsheet Data Hasil Tes
Aplikasi ini mencakup tiga instrumen tes psikologi & edukasi terstandarisasi:
-
Kecerdasan Majemuk (Multiple Intelligences)
- Berdasarkan teori Howard Gardner.
- Terdiri dari 80 pertanyaan yang mengevaluasi 8 bidang kecerdasan (Linguistik, Logis-Matematis, Spasial, Kinestetik, Musikal, Interpersonal, Intrapersonal, dan Naturalis).
-
Kepribadian & Karir RIASEC
- Berdasarkan teori karir John Holland.
- Terdiri dari 42 pertanyaan untuk menganalisis kecenderungan minat karir berdasarkan 6 tipe kepribadian (Realistic, Investigative, Artistic, Social, Enterprising, Conventional).
-
Gaya Belajar (Visual-Auditori-Kinestetik / VAK)
- Terdiri dari 27 pertanyaan untuk menentukan metode penyerapan informasi terbaik (Visual, Auditori, atau Kinestetik) lengkap dengan rekomendasi jurusan kuliah serta pilihan karir pendukung.
- Aestetika Premium: Menggunakan layout grid modern bergaya Bento-Box pada halaman awal dan kombinasi warna HSL harmonis untuk membedakan kategori tes.
- Visualisasi Chart Dinamis: Hasil skor masing-masing dimensi divisualisasikan menggunakan Radar Chart (berbentuk segitiga untuk VAK, heksagon untuk RIASEC, dan oktagon untuk Kecerdasan Majemuk) yang digambar secara presisi menggunakan SVG dinamis.
- Responsive Layout: Sepenuhnya dioptimalkan untuk perangkat mobile maupun desktop.
- Timbul & Elevasi Efek: Kartu pemilihan tes dirancang statis dengan efek elevated shadow interaktif ketika di-hover (bergerak sedikit ke atas secara mulus).
Setiap pengguna menyelesaikan tes, sistem akan meminta data diri (Nama dan Email) sebelum menampilkan grafik hasil. Data tersebut beserta skor masing-masing dimensi dan hasil dominannya dikirim langsung ke Google Sheets secara real-time melalui integrasi Google Apps Script:
[Web Application (Next.js)]
│
▼ (Fetch API JSON Payload)
[Google Apps Script Web App Connector]
│
▼ (Append Row)
[Google Sheets Database (Tiga Tab Berbeda)]
Setiap kategori tes memiliki tab tersendiri di dalam file Spreadsheet yang sama demi kerapian data.
- Framework: Next.js 15+ (dengan React & TypeScript)
- Styling: TailwindCSS & Vanilla CSS
- Icons: Lucide React
- Integrasi Data: Google Apps Script API
- Deploy: Vercel