Skip to content
All projects
LGU Developer 2025 – 2026

AMD — Mobile Daily Time Record

A browser-based biometric attendance system that lets field and satellite-office staff clock in from a phone, with on-device face recognition and geofencing standing in for a physical fingerprint scanner.

None

Install required

Face match + geofence

Punch verification

Any modern browser

Platforms supported

On the device

Face matching runs

01 · The problem

What was wrong

Attendance depended on biometric terminals physically installed in offices. That works until it does not: staff assigned to field work, satellite offices without a terminal, and travel-order duty all fell back to paper, which meant manual encoding, disputes, and delay.

The obvious fix — a mobile app — brings its own problem. Any remote punch system has to answer the question the terminal answered implicitly: is this actually the right person, actually at the right place?

02 · The approach

What I did

I built it as a mobile web application rather than a native app, so there was nothing to install, nothing to push through an app store, and nothing to maintain per platform.

  • Face recognition at punch time, running in the browser. HR registers each employee once; face-api.js turns that into a descriptor, and every later punch is matched against it on the device using the face_landmark_68 and face_recognition models, accepted only when the Euclidean distance falls within a tuned threshold. That is what actually stops buddy-punching — a photo alone would not.
  • The inference runs client-side on purpose. The face never leaves the phone to be matched, and the LGU needs no GPU tier to serve thousands of punches. The cost is ~7 MB of model weights, which is a caching problem — solved with immutable one-year cache headers, so only the first punch on a device ever pays for them.
  • Warmed the model up before it was needed, allocating WebGL shaders and tensors while the page was still loading rather than stalling the punch button for seconds at the moment somebody taps it.
  • Geofencing using the Geolocation API, validating the punch against the assigned office's coordinates and radius, so a punch outside the fence is flagged rather than silently accepted.
  • Travel-order handling, so staff legitimately working away from their station are not punished by the geofence — the exception is modelled in the system instead of handled by paper.
  • Built for the phones people actually have, not flagship devices: the capture path had to work on mid-range Android hardware over rural connectivity.

03 · The outcome

What changed

Field staff and satellite offices record attendance directly into the same system as terminal punches, and travel-order duty is captured without paper. The module is fully functional and integrated with the existing DTR processing in ACCESS.

Highlights

  • On-device face recognition (face-api.js / TensorFlow.js) — biometrics never leave the phone
  • Buddy-punching blocked by descriptor matching against an HR-registered face
  • ~7 MB of model weights made free after first use via immutable cache headers
  • Geofence validation against per-office coordinates and radius
  • Travel-order punches modelled as first-class, not exceptions handled on paper
  • Runs on mid-range Android hardware over rural connectivity

Built with

  • PHP 8.2
  • CodeIgniter 3
  • Microsoft SQL Server
  • JavaScript
  • face-api.js
  • TensorFlow.js
  • WebGL
  • MediaDevices API
  • Geolocation API
  • Responsive web

Next project

Pre-Audit Document Tracking

See how it was built