Sistem Absensi Digital

Panduan Penggunaan
Web App Absensi QR Code

Dokumen tata cara pemakaian sistem absensi digital berbasis QR Code yang dibangun menggunakan Google Apps Script dan Google Spreadsheet.

Pengembang Eko Wardoyo, S.Kom. Muhammad Alif Rido
Instansi SMK Negeri 20 Jakarta
Platform Google Apps Script (Web App)
Versi 2026
🗺️

Gambaran Umum Sistem

Apa saja yang bisa dilakukan sistem ini

✅
Sistem ini berjalan 100% berbasis web — tidak perlu install aplikasi apapun. Cukup buka link URL di browser HP atau komputer, langsung bisa digunakan.
🏆Leaderboard & Podium Apresiasi
Sistem apresiasi kedisiplinan otomatis dengan Top 3 Podium Card (Emas, Perak, Perunggu) untuk Siswa Terpagi dan Petugas OSIS teraktif.
🔒Keamanan Password SHA-256
Seluruh kata sandi guru & siswa di-hash dengan enkripsi SHA-256. Pembuatan dan reset password siswa terintegrasi dengan tiket verifikasi fisik ke Admin.
📡Monitoring Real-Time
Pantau siapa saja yang belum absen, terlambat, atau belum pulang secara langsung per kelas tanpa harus menunggu rekap manual.
💬Forward & Kelola WhatsApp
Kirim notifikasi daftar siswa belum hadir atau belum pulang ke grup wali murid/paguyuban langsung via WhatsApp Web dengan template custom.
📊Laporan & Rekap Multi-Sheet
Rekapitulasi kehadiran harian, bulanan, per siswa, dan keaktifan petugas. Dapat diekspor ke format Excel (.xlsx) atau PDF kapan saja.
🕌Absensi Sholat Berjamaah
Modul khusus pencatatan kehadiran sholat Dhuha, Dzuhur, dan Ashar berjamaah siswa yang terpisah dari absensi kegiatan belajar mengajar.

👥

5 Peran Pengguna Utama

Pilih peran pengguna untuk membuka rincian panduan dan video tutorial lengkap

🛠️
Panduan Khusus Administrator & Tim Teknis (TU)
Konfigurasi master data, sinkronisasi foto Google Drive, tiket reset password, kenaikan kelas & cetak kartu pelajar.

❓

FAQ & Panduan Troubleshooting

Solusi lengkap untuk kendala umum perangkat, browser, GPS, dan akun

🎨 Mengapa tampilan WebApp polos ("HTML Only" tanpa warna/style) dan tombol tidak bisa ditekan?
Kondisi ini terjadi bila mesin browser di HP siswa tidak berhasil memuat CSS/Tailwind atau mengalami error pembacaan JavaScript. Berikut penyebab dan cara mengatasinya:
  1. Update Google Chrome / Android System WebView: Jika HP memakai Chrome versi lawas (bawaan pabrik), mesin browser tidak mengenali kode modern sehingga mematikan seluruh script. Buka Google Play Store → cari Google Chrome → klik Update (Perbarui).
  2. Nonaktifkan Private DNS / AdBlocker: Siswa yang mengaktifkan Private DNS (seperti dns.adguard.com) atau pemblokir iklan sering kali memblokir CDN styling pihak ketiga. Masuk ke Pengaturan HP → Jaringan / Koneksi → Private DNS → pilih Otomatis / Nonaktif.
  3. Pastikan Tanggal & Jam HP Otomatis: Jika jam HP berbeda dengan waktu jaringan, sertifikat keamanan SSL ditolak browser. Aktifkan "Gunakan waktu yang disediakan jaringan" di setelan tanggal HP.
  4. Gunakan Browser Modern Lain: Jika Chrome di HP tidak bisa diperbarui, gunakan browser alternatif seperti Microsoft Edge atau Opera Mobile.
📍 Mengapa GPS tidak terdeteksi, izin ditolak, atau lokasi terdeteksi jauh (misalnya di JIS)?
Fitur Absen Mandiri memvalidasi lokasi siswa dalam radius 100m dari SMKN 20 Jakarta. Jika terjadi kendala:
  1. Jangan Buka dari Dalam WhatsApp: Browser bawaan WhatsApp (In-App Browser) sering mematikan sensor GPS. Salin link dan buka langsung di aplikasi Google Chrome (Android) atau Safari (iPhone).
  2. Pengaturan Khusus iPhone (iOS / Safari): Di iPhone, wajib mengaktifkan lokasi presisi. Buka Pengaturan iPhone → Privasi & Keamanan → Layanan Lokasi → Safari Websites → pilih "Saat Menggunakan App" dan nyalakan saklar "Lokasi Tepat / Precise Location" (WAJIB ON).
  3. Lokasi Melompat ke Luar Sekolah (misal JIS): Ini terjadi saat HP berada di dalam gedung beton tebal sehingga sinyal satelit GPS terhalang dan browser mengambil lokasi menara internet (IP provider). Solusi: Keluarlah ke area terbuka/dekat jendela, lalu tap tombol "Refresh GPS" pada peta.
  4. Aktifkan Akurasi Tinggi (Android): Masuk ke Pengaturan HP → Lokasi → Layanan Lokasi → Aktifkan "Akurasi Lokasi Google".
🔑 Mengapa saya tidak bisa login ke akun siswa (NISN tidak terdaftar / Lupa password / Keterangan sudah membuat password)?
Jika mengalami kendala tidak bisa login, segera hubungi Admin (Tata Usaha) atau Wali Kelas. Berikut panduan langkahnya:
  • NISN Tidak Terdaftar: Hubungi Admin (TU) untuk memastikan data NISN, nama, dan kelas Anda sudah dimasukkan dengan benar ke dalam master data database siswa.
  • Lupa Kata Sandi: Klik tombol "Buat / Lupa Password?" pada halaman login siswa → masukkan tanggal lahir & password baru yang diinginkan → lalu konfirmasikan langsung ke Admin (TU) atau Wali Kelas agar permohonan tiket reset password Anda segera disetujui.
  • Siswa Baru Muncul Keterangan "Sudah Membuat Password": Hal ini bisa terjadi jika akun telah terisi kata sandi default atau format data lama. Hubungi Admin (TU) untuk melakukan reset atau pengosongan kata sandi agar Anda bisa membuat password baru dari awal.
📶 Apakah siswa harus memiliki kuota internet saat scan kartu di gerbang?
Sama sekali tidak perlu kuota internet! HP siswa hanya bertugas menampilkan gambar barcode QR Code di layar.
  • Bisa Offline 100%: Cukup ambil Screenshot (tangkapan layar) kartu pelajar Anda dari menu Kartu Saya satu kali saja, lalu simpan fotonya di Galeri HP / jadikan foto favorit.
  • Praktis & Cepat: Saat tiba di gerbang, langsung buka foto screenshot tersebut dari Galeri tanpa perlu menyalakan data seluler ataupun login ke web.
  • Koneksi Internet: Yang membutuhkan internet hanyalah HP Petugas OSIS / Guru Piket yang memindai untuk mengirim data presensi ke server.
⏱️ Siswa sudah di-scan oleh Petugas di gerbang, kenapa jam absen belum muncul di HP siswa?
Karena sistem absensi berbasis cloud spreadsheet tanpa koneksi live stream berat, data di HP siswa tidak berubah secara otomatis seketika. Siswa cukup menekan tombol Refresh / Muat Ulang di browser HP atau masuk ulang ke menu Riwayat Absensi untuk menarik status kehadiran terbaru yang sudah dicatat oleh scanner petugas.
📷 Mengapa kamera scanner QR tidak mau terbuka?
Kamera scanner terbuka melalui jendela baru. Pastikan browser Anda mengizinkan Pop-up dan Pengalihan (Redirect) serta mengizinkan akses kamera untuk situs web absensi digital pada pengaturan situs browser.
🚪 Kenapa akun tiba-tiba ter-logout sendiri?
Sistem menerapkan keamanan sesi tunggal per browser. Jika Anda login akun lain (misal login Admin lalu login Siswa di tab lain pada browser yang sama), sesi sebelumnya akan digantikan otomatis. Gunakan mode Incognito / Tab Samaran atau browser terpisah jika perlu membuka lebih dari satu akun secara bersamaan.
🚩 Bagaimana cara mengetahui dan mencegah siswa titip absen?
Gunakan fitur Anomali pada menu Daftar Hadir. Guru mata pelajaran jam pertama disarankan memanggil ulang siswa secara fisik di kelas. Jika ada siswa berstatus Hadir namun fisiknya tidak ada, klik tombol A (Anomali) pada baris siswa tersebut untuk mengubah statusnya menjadi Alpa seketika.
📊 Kenapa laporan Excel sulit di-download langsung dari HP?
Untuk hasil terbaik dan tata letak tabel yang rapi, ekspor laporan Excel dan cetak kartu pelajar sangat direkomendasikan melalui Komputer / Laptop. Jika terpaksa menggunakan HP, pastikan telah menginstal aplikasi Google Spreadsheet dari Play Store/App Store.
🚦 Sistem terasa lambat saat jam sibuk pagi hari (06:45 – 07:15), apa penyebabnya?
Google Apps Script memiliki kuota konkurensi antrean (~30 request bersamaan). Saat ratusan siswa menekan tombol presensi di detik yang sama, server Google akan memproses transaksi secara bergiliran. Terapkan metode Hybrid: sebagian siswa melakukan Absen Mandiri dan sebagian siswa dipindai barcode QR-nya oleh Petugas OSIS di gerbang sekolah.
📷

3 Metode Presensi Harian

Pilihan cara input kehadiran siswa yang fleksibel dan terintegrasi

METODE 1 (UTAMA / DIREKOMENDASIKAN) 📷 Scan Barcode QR Code (Gerbang Masuk & Pulang)

Prosedur Standar Harian: Petugas OSIS atau Guru Piket memindai barcode QR Code pada kartu pelajar siswa (fisik / screenshot galeri HP) saat siswa tiba di gerbang pagi maupun kepulangan sore.

1

Pilih Mode Sesi: Absen Masuk / Absen Pulang

Buka scanner atau Daftar Hadir. Gunakan slider toggle untuk memilih mode:
🟢 Absen Masuk (Hijau): 06:00 – 07:15 WIB (Batas Gerbang: 07:30 WIB).
🟠 Absen Pulang (Oranye): 15:00 – 17:00 WIB (Tutup Sistem: 18:00 WIB).
Banner jadwal operasional otomatis menyesuaikan warna (hijau/oranye) secara interaktif.

2

Buka Kamera Scanner QR & Izinkan Akses

Klik tombol 📷 Buka Scanner QR / Buka Kamera Live → klik Izinkan / Allow saat browser meminta izin kamera. Kamera belakang HP/laptop akan aktif otomatis.

3

Arahkan Kamera ke QR Code Siswa

Siswa menunjukkan barcode QR kartu pelajar — bisa lewat web, foto screenshot di galeri HP (offline tanpa kuota), atau kartu fisik. Arahkan kamera ke QR Code hingga terbaca.

4

Pencatatan Kehadiran Otomatis & Multi-Scanner Lock

Sistem langsung menyimpan jam presensi (Tepat Waktu / Terlambat / Jam Pulang) secara real-time ke spreadsheet dan mengakumulasikan skor poin petugas ke Leaderboard OSIS.

METODE 2 (CADANGAN / PENGURAI ANTREAN) 📍 Absen Mandiri Siswa (Live GPS Geofence)
⚠️
Ketentuan Jam & Penggunaan Absen Mandiri:
Fitur ini difungsikan khusus sebagai cadangan darurat saat petugas/OSIS scanner belum atau tidak bertugas di gerbang, dengan jadwal pembatasan otomatis:
  • 🌅 Sesi Masuk (Pagi Buta): Dibuka pukul 04:30 – 05:50 WIB (sebelum pos gerbang aktif).
  • 🌇 Sesi Pulang (Sore/Ekskul): Dibuka pukul 17:00 – 18:00 WIB (setelah pos gerbang bubar).
Di luar jam di atas (termasuk jam kedatangan reguler 06:00 – 07:15 WIB), tombol absen mandiri otomatis terkunci dan sistem akan mengarahkan siswa untuk Scan Barcode QR di pos gerbang.

Langkah melakukan presensi mandiri saat berada di lingkungan sekolah (radius ≤ 100m) pada jam operasionalnya:

1

Buka Menu Absen Mandiri di HP

Login sebagai Siswa → buka menu Absen Mandiri di dashboard. Sistem otomatis menentukan sesi (Masuk/Pulang) yang aktif sesuai waktu saat ini.

2

Izinkan Lokasi / GPS HP

Klik Izinkan / Allow saat browser meminta akses lokasi. Pastikan Precise Location di HP dalam keadaan aktif.

3

Verifikasi Radius Peta Geofence

Peta interaktif Leaflet akan mendeteksi posisi Anda. Jika berada di area sekolah (radius ≤ 100m), status indikator akan valid hijau dan tombol presensi menjadi aktif.

4

Kirim Presensi Sekarang

Tekan tombol "Kirim Absen Sekarang". Data kehadiran langsung terkirim dan tercatat ke database sistem.

METODE 3 📋 Daftar Hadir Manual (Per Kelas)

Guru Wali Kelas atau Guru Piket mencatat kehadiran manual per siswa di kelas (Hadir, Sakit, Izin, Alpa) dengan banner jadwal dinamis.

1

Buka Menu Daftar Hadir

Login sebagai Guru/Piket/Admin → klik menu Daftar Hadir → pilih kelas, tanggal, dan mode sesi (Absen Masuk / Absen Pulang).

2

Atur Status Kehadiran

Pilih status untuk masing-masing siswa: Hadir Sakit Izin Alpa.

3

Simpan Daftar Hadir

Klik tombol 💾 Kirim Absensi / Simpan untuk menyimpan seluruh data kehadiran kelas ke spreadsheet.


🚩

Fitur FLAG Kehadiran & Anti Titip Absen

Penanganan anomali titip absen, siswa sakit di UKS, dan dispensasi dinas

Pada tabel Daftar Hadir, Guru dapat menekan tombol 🚩 Flag pada siswa yang berstatus Hadir untuk memberikan penanganan status khusus:

1

🚩 1. ANOMALI (Anti Titip Absen)

Mengubah status siswa dari Hadir menjadi Alpa jika saat dicek fisik di kelas ternyata tidak ada (indikasi menitipkan kartu/HP ke teman).

2

🤒 2. SAKIT DI SEKOLAH (UKS)

Status tetap tercatat Hadir, tetapi diberi keterangan medis khusus (misal: demam istirahat di UKS / dijemput pulang oleh orang tua).

3

🏛️ 3. KEGIATAN LUAR (Dispensasi)

Status tetap Hadir, disertai catatan tugas dinas/lomba resmi sekolah (misal: Lomba LKS, Paskibra, OSIS, Pramuka).

⚠️
Penetapan Flag Anomali langsung tersimpan ke database spreadsheet. Jam kedatangan awal tetap tersimpan dalam log sebagai rekam jejak investigasi ketertiban.
🎒

Panduan Peran: Siswa

Cara login, pembuatan kata sandi, absen mandiri GPS, kartu digital, dan notifikasi

📱 Video Panduan — Peran Siswa
🛡️

Panduan Peran: Petugas OSIS

Pemindaian barcode QR Code siswa di gerbang sekolah (Masuk & Pulang) secara cepat, aman, dan terarah

📋

Panduan Peran: Guru Piket

Cara memindai QR, mengisi daftar hadir, dan monitoring seluruh kelas

📱 Video Panduan — Peran Piket
Kontrol video terhalang? Buka & tonton langsung di Google Drive ↗
👩‍🏫

Panduan Peran: Guru (Wali Kelas)

Mengelola absensi, pesan, dan rekap untuk kelas yang diampu

💻 Video Panduan — Peran Guru Wali Kelas
Kontrol video terhalang? Buka & tonton langsung di Google Drive ↗
🏫

Panduan Peran: Wakil Kepala Sekolah

Memantau laporan & rekap kehadiran tanpa mengubah data

💻 Video Panduan — Peran Wakil Kepala Sekolah
Kontrol video terhalang? Buka & tonton langsung di Google Drive ↗
🛠️

Panduan Peran: Admin (TU)

Akses penuh — mengelola seluruh data, akun, dan konfigurasi sistem


🔒

Tips Keamanan & Pemeliharaan

Praktik baik dalam mengoperasikan sistem

🔑Ganti Password Berkala
Disarankan mengganti password akun secara berkala, minimal setiap semester.
📤Backup Data Rutin
Duplikasi/download file Google Spreadsheet setiap awal bulan sebagai backup.
🌐Gunakan Chrome/Edge
Untuk fitur scanner QR yang optimal, gunakan Chrome/Edge versi terbaru yang mendukung BarcodeDetector API.
🚪Selalu Logout
Selalu logout setelah selesai, terutama di komputer TU yang dipakai bergantian.
💻 Video Panduan — Peran Admin
Kontrol video terhalang? Buka & tonton langsung di Google Drive ↗