Undangan Digital BFTX — Tautan per Tamu dan Check-in QR
Undangan pernikahan berbentuk halaman web yang saya buat untuk layanan Undangan Wedding di BFTX Creative. Tiap tamu mendapat tautan atas namanya sendiri, mengisi RSVP dan ucapan dari situ, lalu menunjukkan kode QR saat datang. Panitia memantau semuanya dari satu panel.
Masalah yang Ingin Diselesaikan
Banyak undangan digital berupa satu tautan yang sama untuk semua tamu, lalu disebar ke grup WhatsApp. Tautannya bisa sampai ke siapa saja, pasangan tidak tahu siapa yang sudah membukanya, dan jumlah tamu baru ketahuan di hari H. Saya ingin undangan yang terasa pribadi seperti kartu cetak, tetap gampang dikirim lewat WhatsApp, dan memberi panitia data yang bisa dipakai sebelum acara.
Fitur Utama
- Tautan pribadi untuk tiap tamu dengan kode acak 8 huruf. Nama, sapaan, dan jumlah tamu muncul di sampul, dan alamat tanpa kode yang terdaftar langsung ditolak, jadi tidak ada versi umum yang bisa disebar.
- Isi lengkap dalam satu halaman: kedua mempelai, kisah, waktu dan tempat beserta petunjuk lokasi, galeri, amplop digital, tombol simpan ke kalender, dan lagu pengiring.
- RSVP dan dinding doa. Tamu memilih hadir atau berhalangan, menentukan jumlah yang datang, dan menulis ucapan dari halamannya sendiri.
- Tiket QR atas nama tiap tamu. Di pintu masuk, penerima tamu memindainya dengan kamera HP dari panel, lalu check-in langsung tercatat.
- Panel panitia untuk menambah tamu atau menempel daftar dari Excel, mengirim tautan lewat WhatsApp, melihat siapa yang sudah membuka undangan, memantau RSVP dan check-in, menyembunyikan ucapan yang tidak pantas, dan mengekspor CSV.
Desain
Tampilannya bernuansa islami dengan warna zamrud, krem, dan emas: sampul bertirai dengan segel inisial, bingkai foto lengkung, ornamen emas, ayat Ar-Rum 21, dan doa untuk mempelai. Hurufnya Cormorant Garamond dan Great Vibes, dengan Amiri untuk teks Arab. Isi, foto, dan lagu bisa diganti untuk tiap pasangan.
Keamanan dan Data Tamu
Karena isinya data tamu, bagian ini saya perhatikan betul. Kode tamu diacak dari sekitar 1,1 triliun kemungkinan dan selalu dicek di server. Panel memakai sesi cookie HttpOnly dan SameSite, percobaan login dan pengiriman RSVP dibatasi, semua masukan dipotong dan di-escape, dan setiap halaman dikirim dengan header CSP. Data tamu disimpan di server sendiri, dan tiap pasangan mendapat subdomain serta basis data terpisah.
Teknologi
Aplikasinya dibangun dengan Node.js dan Express 5, halamannya dirender di server dengan EJS, dan datanya disimpan di SQLite bawaan Node. Kode QR dibuat dengan pustaka qrcode, sedangkan pemindai di panel memakai kamera HP dan jsQR. Semuanya dikemas dalam satu image Docker.
🔗 Studi kasus lengkap beserta demo dari sisi tamu: bftx.site/karya/undangan-digital