Skills Depth About Contact
Back to Projects
production Automate Systems Ltd
React 18ViteMaterial UINode.jsExpress

Workforce Hours Manager

Streamlining field workforce operations for Automate Systems Ltd

Architecture

React 18 + Vite Material UI | PWA Node.js + Express Socket.io | Redis | Auth Socket.io Redis PostgreSQL + Prisma Timesheets | Jobs | Users what3words PDF Reports Field Workers PWA Offline Real-time Sync External

Before & After

Before

Manual paper-based timesheets with error-prone spreadsheet calculations, no real-time visibility into field worker locations or job statuses, and no integrated holiday or overtime tracking.

After

Centralized digital platform with real-time field worker tracking via what3words, automated timesheet calculations, integrated leave management, and PDF export capabilities. PWA supports offline data entry synced when connectivity returns.

Results

40+ hrs
Time Saved Weekly
+67% efficiency
99.2%
Timesheet Accuracy
85+
Field Workers
+120% capacity
500+/mo
Reports Generated

Technical Challenge

Real-time PWA with Offline-First Architecture

The Problem

Field workers operate in areas with poor cellular coverage. The original system required constant connectivity—timesheets couldn't be submitted until workers returned to areas with signal. This caused delays in billing and frustration for workers who had completed jobs but couldn't record them.

The Solution

Built an offline-first PWA using Service Workers and IndexedDB. When offline, timesheets are queued locally with a timestamp. On reconnect, the sync manager drains the queue in order, handling conflicts (same timesheet edited on two devices) by preferring the latest timestamp but preserving an audit trail.

Combined with Socket.io real-time updates, managers see timesheets appear moments after workers save them—even from remote job sites.

Tech Decisions

Material UI for Enterprise UX

Workforce apps are used by workers of all technical abilities. Material UI provides a familiar, consistent interface that reduces training time. The component library's accessibility features (ARIA labels, keyboard navigation) were essential for meeting WCAG requirements.

Prisma + PostgreSQL

Prisma's type-safe queries eliminated an entire category of runtime errors. Complex relational queries (workers -> jobs -> timesheets -> customers -> invoices) become trivial with Prisma's join syntax. The migration system also made schema evolution safe during the initial development phase.

what3words for Field Navigation

Traditional addresses don't work for job sites—large warehouses, outdoor construction areas, and rural locations lack street addresses. what3words provides precise 3-word coordinates that field workers can easily communicate and navigate to, eliminating the "where exactly?" problem in dispatch.