Workplace Scientifics | Chidike Vincent

The brief

Workplace Scientifics sent each inspection report to its client by email, one by one. The brief was one secure, searchable place for each client's reports, and one system for the company to run clients, scheduling and reporting.

Reports as a grid of cards, each with its company, site, assessment type and an Extracted badge, beside filters for company, branch, type, date and status — The reportsScreenshot, demo data2025 to 2026

The reports grid with measurements laid over it: type sizes, spacing, card and button sizes, and colour swatches — The reportsScreenshot, demo data2025 to 2026

Who it is for

Two sides use it. Staff at the company upload reports and manage clients, companies, branches and users. Each client organisation sees its own reports, and a company with several branches sees each one kept apart.

Company Management: search and country and city filters, totals for companies and branches, and a table of three demo companies — Managing client companiesScreenshot, demo data2025 to 2026

Company Management with measurements laid over it: type sizes, spacing, the search field and button sizes, radii and colour swatches — Managing client companiesScreenshot, demo data2025 to 2026

The admin dashboard: a welcome line, Upload Report and Schedule Inspection, four metric cards, the company list with three demo companies, and recent reports — The company's dashboardScreenshot, demo data2025 to 2026

The admin dashboard with measurements laid over it: type sizes, padding, gaps, a button size, card radius and colour swatches — The company's dashboardScreenshot, demo data2025 to 2026

Decisions

The admin and client sides are separate dashboards, each with its own interface and permissions.

A report opens at its summary. The executive summary, key findings and recommendations are pulled out of the PDF, so a client reads the gist first.

Visibility controls decide which of a company's branches a user can see.

Two things were hard at first: switching between a company's many branches, and pulling the summary out of report PDFs in pure Python. I worked out both.

A noise assessment report opened at its summary tab: the extraction marked a success, and the executive summary pulled out of the PDF, with tabs for recommendations and the PDF itself — A report, summary firstScreenshot, demo data2025 to 2026

One demo company: its details, the branch visibility switch set to a unified view across branches, and its two branches with inspection status — Branch visibilityScreenshot, demo data2025 to 2026

The company page with measurements laid over it: type sizes, padding, card and button sizes, radii and colour swatches — Branch visibilityScreenshot, demo data2025 to 2026

Flows

UploadThe company uploads an inspection report as a PDF.
ExtractThe summary, findings and recommendations are pulled out automatically.
FileThe report goes to its company and, inside it, its branch.
ReadThe client views, filters and downloads it.

From upload to dashboardDiagram, built in code2025 to 2026

ReminderInspection reminders are scheduled, and the client can see them.
Book or requestThe client books an inspection, or requests a new one.
ClarifyThe client asks about a report from the report itself.

Asking the companyDiagram, built in code2025 to 2026

Screens

Upcoming inspections as a list of cards, each with the company, its site, a Fire Risk Assessment chip and the date — InspectionsScreenshot, demo data2025 to 2026

The inspections list with measurements laid over it: type sizes, padding, gaps, chip and card sizes, and colour swatches — InspectionsScreenshot, demo data2025 to 2026

The reports page switching from a grid of report cards to a list and back — Grid and listScreen recording, demo data2025 to 2026

The notifications feed: report published and report uploaded entries, each with a priority chip and actions to mark as read or delete — NotificationsScreenshot, demo data2025 to 2026

The notifications feed with measurements laid over it: type sizes, padding, gaps, chip and card sizes, and colour swatches — NotificationsScreenshot, demo data2025 to 2026

The inspections page switching between upcoming and past inspections — Upcoming and pastScreen recording, demo data2025 to 2026

The settings page switching the whole app from light to dark and back — Light and darkScreen recording, demo data2025 to 2026

The sign-in page with measurements laid over it: type sizes, field and button sizes, spacing and colour swatches — Signing inScreenshot, demo data, photo replaced2025 to 2026

The reports page on a phone: an upload button, filters, a search box and the first report card, filed under its company and branch — Reports on a phoneScreenshot, demo data2025 to 2026

Signing in on a phoneScreenshot2025 to 2026

Where it stands

Built, and in user testing. The company is not using it with clients yet.

Dashboards, admin and client: 2
Levels of isolation, company and branch: 2
Businesses the company supported in 2025. The company's figure, not the portal's: 300+

Tokens

Read from the code I wrote.

primary: #414EC3, oklch(0.485 0.181 272.8)
background: #FFFFFF, oklch(1 0 0)
foreground: #0A0A0A, oklch(0.145 0 0)
muted-foreground: #737373, oklch(0.556 0 0)
border: #E5E5E5, oklch(0.922 0 0)
destructive: #EF4444, oklch(0.637 0.208 25.3)
radius: 8px (0.5rem)
radius md: 6px (0.375rem)
radius sm: 4px (0.25rem)
font: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif