Update Autentikasi: Implementasi Verifikasi OTP & Peningkatan UX
Pembaruan ini mengubah mekanisme verifikasi autentikasi dari yang sebelumnya berbasis magic link (tautan lewat email) menjadi kode OTP (One-Time Password). Selain itu, alur Sign Up dan Forgot Password kini dirancang ulang menjadi lebih ringkas, jelas, dan mudah diikuti dengan pendekatan step-by-step form.
ℹ️ Informasi Rilis
| Informasi | Detail |
|---|---|
| Tanggal Rilis | Sabtu, 22 Februari 2026 |
| Status | ✅ Deployed (Production) |
| Tipe Update | Security Enhancement & UX Improvement |
1. Latar Belakang Perubahan
Sistem verifikasi lama mengandalkan magic link yang dikirimkan ke email pengguna. Meski terlihat sederhana, pendekatan ini menimbulkan sejumlah masalah yang sering dialami pengguna di lapangan.
🚫 Metode Lama (Magic Link)
- Tautan kadang rusak atau tidak terbaca oleh mail client tertentu.
- Pengguna yang membuka email di perangkat atau browser berbeda tidak bisa melanjutkan proses verifikasi.
- Muncul unknown error yang sulit didiagnosis dan tidak memberi informasi jelas kepada pengguna.
✅ Metode Baru (OTP)
- Kode OTP 6 digit dikirim ke email dan diinput langsung di halaman yang sama.
- Tidak bergantung pada browser atau perangkat — cukup salin kode, masukkan, selesai.
- Pesan error lebih spesifik: kode kedaluwarsa, kode salah, atau limit percobaan terlampaui.
2. Perubahan Alur Verifikasi
🚫 Sebelum — Magic Link
Pengguna menekan tombol di email → browser baru terbuka → proses sering gagal di tengah jalan karena tautan rusak, sesi tidak cocok, atau error tidak diketahui.
✅ Sesudah — OTP
Pengguna membuka email → menyalin kode 6 digit → memasukkan kode di halaman yang sudah terbuka → verifikasi selesai tanpa berpindah sesi atau browser.
Kode OTP tidak bergantung pada integritas URL maupun konsistensi sesi browser. Selama pengguna bisa membaca email dan mengetikkan 6 angka, verifikasi akan berhasil.
3. Perubahan Alur Form: Step-by-Step dengan Indikator Progres
Sebelumnya, seluruh isian Sign Up maupun Forgot Password ditampilkan sekaligus dalam satu halaman. Kini, kedua alur tersebut dipecah menjadi langkah-langkah bertahap yang dilengkapi indikator progres di bagian atas halaman.
🚫 Alur Lama (Single Page Form)
Semua field ditampilkan sekaligus. Tidak ada panduan urutan, dan kesalahan di satu bagian membuat seluruh form terasa berat untuk diulang.
✅ Alur Baru (Multi-Step Form)
Setiap langkah fokus pada satu tugas. Indikator progres menampilkan langkah yang sudah selesai (✅), sedang aktif (🔵), dan belum dilalui (⚪).
4. Rincian Alur Baru
A. Alur Sign Up
Langkah 1 — Email & Password
Pengguna mengisi alamat email dan membuat kata sandi. Validasi format dilakukan langsung sebelum lanjut ke langkah berikutnya.
Langkah 2 — Verifikasi Email (OTP)
Kode OTP 6 digit dikirim ke email. Pengguna menyalin kode dan memasukkannya di halaman yang sama. Tersedia opsi kirim ulang kode dengan countdown timer.
Langkah 3 — Nama PIC & Perusahaan
Setelah email terverifikasi, pengguna melengkapi informasi profil berupa nama penanggung jawab (PIC) dan nama perusahaan.
B. Alur Forgot Password
Langkah 1 — Masukkan Email
Pengguna memasukkan alamat email yang terdaftar.
Langkah 2 — Verifikasi Email (OTP)
Kode OTP dikirim ke email tersebut. Pengguna memasukkan kode untuk membuktikan kepemilikan akun.
Langkah 3 — Buat Kata Sandi Baru
Setelah OTP terverifikasi, pengguna langsung diminta mengisi kata sandi baru beserta konfirmasinya.
5. Peningkatan Desain & Keterbacaan
tampilan antarmuka sesudah pembaruan desain.
- Hierarki visual lebih bersih — judul, instruksi, dan field input memiliki jarak dan ukuran yang proporsional, tidak lagi terasa penuh.
- Pesan instruksi lebih eksplisit — setiap langkah dilengkapi keterangan singkat tentang apa yang perlu dilakukan dan mengapa.
- Penanganan error lebih informatif — pesan kesalahan kini menjelaskan penyebab spesifik,
- Tombol aksi lebih kontekstual — teks tombol menyesuaikan langkah aktif (misalnya "Lanjutkan ke Verifikasi", "Verifikasi", "Selesaikan Pendaftaran").
Kombinasi OTP dan alur bertahap ini secara signifikan mengurangi kebingungan dan kegagalan di tengah proses. Pengguna kini tahu di mana mereka berada, apa yang harus dilakukan, dan mendapat umpan balik yang jelas jika terjadi kesalahan.