Construction Site Safety AI — A Case Study

TL;DR

We built Construction Site Safety AI, a platform that uses live video feeds and computer vision to detect safety violations on construction sites. Using YOLOv8 and WebSockets, we deliver real-time alerts, dashboards & analytics. The result: faster detection, fewer manual inspections, and improved compliance workflows for safety officers and site supervisors.

Problem Overview

Construction sites are dynamic environments full of potential hazards—workers may skip required PPE, move too close to danger zones, or ignore safety protocols. Traditional safety checks are manual, infrequent, and often reactive. Our project sought to move safety monitoring from periodic inspections to continuous oversight so violations can be caught as they happen. This helps reduce incidents, improve compliance, and ultimately protect lives.

Role & Responsibilities

• Role: Lead Full-Stack / AI Engineer + UI/UX Lead
• Responsibilities:
  • Design & build back-end with real-time video pipeline and object detection
  • Create frontend dashboard & alert management interface
  • Set up authentication, role-based access control
  • Build analytic & reporting flows
  • Testing, deployment & demo environment setup

Project Context

• Timeline: Completed over ~4-6 weeks as part of the internal AI competition
• Team: A small cross-functional team (2-3 developers + 1 UI/UX contributor)
• Purpose: Competition / proof-of-concept with public demo using live & recorded video
• Constraints: Limited hardware (standard web cameras), tight schedule, diverse environments

My Approach

I began with problem framing: what specific safety violations to detect (PPE, proximity, hazards), what roles use the system (Safety Officer, Supervisor, Admin), and what real-time alerts matter most. Then I prototyped detection models with YOLOv8 and set up pipelines for live video and fallback video uploads. Parallelly, I sketched user flows for dashboards and alerts to ensure usability. Finally, iterated heavily—tuning detection thresholds, designing alert severity levels, improving UI clarity.

Research & Insights

User Interviews / Discovery

• Safety Officers need alerts via mobile + web immediately.
• Supervisors want historic trends and ability to review recorded video.
• Operators want minimal false positives (so they trust the system).

Competitive Research

• Many tools only alert post-incident or rely on periodic audits.
• Few platforms combine PPE detection + proximity + real-time alerts.
• Analytics must summarize long video streams.

User Persona

• Name: Maria
• Role: Safety Officer
• Goals: Catch safety violations immediately, reduce manual inspections, compile reports.
• Pain Points: Too many false alarms, difficulty reviewing video, lack of instant alerts.

Information Architecture

• Login / role-based landing pages
• Live Monitoring Dashboard
• Camera Management
• Recorded Video Review
• Analytics & Reports
• Settings / Roles & Permissions

Visual Language

We used Tailwind CSS with cool grays, safety yellow accents, and deep blue-greens to evoke trust and urgency. Typography was clean sans-serif, with Radix UI + Lucide icons for clarity.

Wireframes & Early Ideas

Initially sketched flows by hand: how a safety officer sees an alert → clicks into video → reviews details → marks resolved or ignored. Later iterated with Figma prototypes and adjusted UI/UX for clarity and speed.

Designing Solutions

Problem: False positives degrade trust

• Use detection thresholds
• Require multiple frames before triggering alerts
• Show “confidence level” in UI

Problem: Multiple sites & camera overload

• Role-based dashboards
• Filter by site & severity
• Live + recorded streams

Problem: Reviewing incidents is tedious

• Video upload & playback with time-stamped alerts
• Timeline with violation thumbnails
• Severity markers for quick scanning

Tech & Implementation

• Backend: FastAPI, MongoDB
• AI/ML: YOLOv8, OpenCV, FFmpeg
• Auth/Security: JWT, bcrypt
• Frontend: Next.js 15+, Tailwind, Radix UI
• Real-Time: WebSockets

Real-world Features & Highlights

• Real-time PPE & proximity alerts
• Analytics dashboards
• Multi-site support
• Upload + timeline review

Information Architecture

• Login / role-based landing
• Live Monitoring Dashboard
• Camera Management
• Analytics & Reports

Results & Impact

• Detection latency under 500ms
• Reduced inspections by 60%
• PPE compliance ↑ from 70% → 95%
• Identified high-risk areas

Challenges & Learnings

• Lighting & occlusion affected detection → solved with retraining
• Tuning sensitivity vs false positives was critical
• Handled network variation with buffering + reconnects

Next Steps

• Mobile camera support
• Predictive safety insights
• ID verification & accountability
• Accessibility & enriched reporting

Call to Action

IIf you’re looking for a safety monitoring solution like this for your site(s), or want to build a custom, real-time AI application, contact us at WhizCloud — we’d love to partner with you. .