Smart Classroom Attendance System · V1

We BuildDigital Excellence

A collaborative masterpiece by three passionate student developers from the Institute of Computer Engineers of the Philippines Student Edition (ICpEP.SE).

Scroll

The System

What is ClassTrack?

ClassTrack is a Smart Classroom Attendance System designed for Northwestern University. It combines biometric fingerprint scanning, IoT infrastructure, and real-time analytics to fully automate attendance tracking across campus.

Instructors generate dynamic QR codes from their dashboard, which students scan via their personal portal to log attendance instantly. Alternatively, students interact with ESP32-powered biometric kiosks for fingerprint verification — no paper, no manual counting, no errors.

Built on a modern full-stack: Next.js 14, Supabase (PostgreSQL + WebSockets), and custom embedded firmware — delivering a seamless, real-time experience for every role in the institution.

Biometric AuthInfrastructure HealthReal-time AnalyticsQR VerificationAdministrator Control

Roles

Administrator, Dept Admin, Instructor, Student

Multi

Departments

Fully scoped data isolation per department

ESP32

IoT Kiosks

Hardware biometric logging at classroom level

Offline

Kiosk Mode

Local data buffer when internet drops

Data Journey

The Life of a Log

Click any step to see what happens inside. Every attendance record makes this exact journey — in under 2 seconds.

👆

// 01

Touch

Student places finger on AS608. Optical scan captures template in ~400ms.

[AS608] Optical scan → ID:0x03 [AS608] Confidence: 97 → MATCH [UART] Payload ready → sending

⚡

// 02

Process

ESP32 receives UART, packages event, fires HTTPS POST to Supabase.

[ESP32] UART: 0xEF01 received [ESP32] WiFi POST /attendance Body:{id:3,ts:1700000000} [ESP32] HTTP 200 OK ✓

☁️

// 03

Cloud

Supabase validates, stores to PostgreSQL, broadcasts real-time event.

[PG] INSERT attendance row [RLS] Policy check → pass [RT] Broadcast → all clients [WS] Event fired ✓

🖥️

// 04

Dashboard

Admin browser receives WS event. Row animates in. Toast notification fires.

[WS] attendance:INSERT [UI] Row injected at index 0 [UI] Toast: "Juan → Present" [UI] Analytics recalculated

The Machines

Hardware Components

Click either hardware component to explore its full spec sheet, technical role, and how it fits into ClassTrack.

Click to explore

ESP32-S3 Touch LCD

// MICROCONTROLLER + DISPLAY UNIT

The brain and face of the kiosk. Dual-core LX7 processor with integrated 7" capacitive touch display — handles all I/O, WiFi communication, and UI rendering.

Dual-Core 240MHz7" Touch LCDWiFi 2.4GHzBLE 5.0UART + SPI

Click to explore

AS608 Fingerprint Sensor

// OPTICAL BIOMETRIC INPUT

Optical fingerprint sensor with onboard DSP. Stores up to 162 templates, matches in under 1 second at 500 DPI. Communicates via UART at 57600 baud directly with the ESP32-S3.

162 Templates<1s Match500 DPIUART 57600Onboard DSP

Interactive

The Lab

A fully interactive ClassTrack kiosk simulator. Try scanning, failing, and rebooting the device.

CLASSTRACK KIOSK v1.1

READY

Place finger on sensor

🫆

Try the Kiosk

Simulate real classroom conditions. Tap the fingerprint sensor for a successful attendance log, trigger a failed scan for an unrecognized finger, or reboot to restart the device boot cycle.

[SYS] ClassTrack Kiosk Online

[AS608] UART handshake → OK

[NET] WiFi → Connected

[READY] Awaiting finger input...

Features

System Overview

🔐

Biometric Authentication

AS608 optical sensor captures and matches fingerprints with onboard DSP. Up to 162 enrolled templates per device with sub-second matching accuracy.

📱

QR Verification

Instructors generate unique QR codes per session from their dashboard. Students scan via their portal — a fast, secondary attendance method.

📊

Real-time Analytics

WebSocket-powered live dashboard. Attendance events propagate instantly from ESP32 → Supabase → Admin UI. No refresh needed, ever.

🛡️

Administrator Control

Full CRUD over students, sections, subjects, and schedules. Role-based access control ensures each user sees only what they're permitted to.

Under the Hood

Tech Stack

▲

Next.js 14

// Frontend Framework

App Router, Server Components, and API Routes power the entire admin platform with blazing performance and SSR.

⚡

Supabase

// Backend + Realtime

PostgreSQL hosting, Row-Level Security, Auth, and WebSocket real-time subscriptions for live attendance updates.

🐘

PostgreSQL

// Primary Database

Relational schema with attendance, students, sections, subjects. ACID compliance and optimized query performance.

🔲

ESP32-S3

// Embedded Controller

Dual-core LX7 MCU running custom firmware. UART with AS608, WiFi HTTPS POST, touch LCD rendering, LED GPIO.

🫆

AS608 Sensor

// Biometric Hardware

Optical fingerprint sensor with onboard DSP. 500 DPI, 360° rotation, UART output, up to 162 stored templates.

🌐

Vercel

// Deployment

Edge-optimized deployment for Next.js. Automatic CI/CD from Git, global CDN, serverless function support.

The Builders

Meet the Team

Arden Hero Damaso

Full Stack Developer

"Building ClassTrack taught me that great software lives at the intersection of hardware, data, and UX — all three have to sing together."

Clemen Jay Luis

Frontend Developer

"Every pixel is a decision. Making ClassTrack feel premium meant obsessing over the details no one notices — until they do."

Ace Donner Dane Asuncion

Backend Developer

"The database schema is the foundation of trust. When attendance data is accurate, everything else falls into place."

What's Next

Future Roadmap

Researching

🤖

AI Analytics

Predictive attendance patterns, anomaly detection, and smart insights powered by machine learning models.

Planned

📱

Mobile App

Dedicated mobile experience for students and instructors with push notifications and quick check-ins.

Exploring

👁️

Face Recognition

Camera-based facial recognition as a secondary biometric layer for contactless attendance.

Planned

🏫

Multi-Campus

Support for multiple campuses under one administrator account with cross-campus reporting.

In Progress

🌡️

Smart Sensors

Integrating environmental sensors for room temperature and air quality monitoring alongside attendance.

Planned

👥

Parent Portal

Real-time attendance tracking and instant SMS/Email alerts for parents and guardians.

By The Numbers

Lines of Code

Bugs Crushed

Efficiency Boost

Coffee Consumed