MB.22.31°N · 73.18°E

Software engineer · Security researcher

  1. 01Calibrating orbit loom
  2. 02Weaving glass ribbons
  3. 03Loading case studies & writeups
  4. 04Signal locked

000%

Skip to content
MB.
Back to Projects

// Project case study

Classic Infrastructure Projects

A corporate website for a civil-engineering contracting firm established in 2008 — bringing company information, capabilities and field-project evidence into one authoritative presence.

Live site
Role
Lead software engineer · Velocity Web
Duration
Sep 2026
Stack
React 19TanStack StartTypeScriptTailwind CSS v4WebP pipelineNodemailer

The Problem

A capable contractor's company story, services and field evidence were scattered — hard for procurement teams to verify.

The Approach

A company → capability → project journey with five service disciplines, an image-led field gallery, a dossier and a tender desk.

The Outcome

A live corporate site that lets inspectors evaluate the firm from a phone and send quotation or RFP enquiries directly.

Product film — Classic Infrastructure ProjectsPlays when in view

Client project delivered through Velocity Web (now Qavironel Technologies).

Who it's for

Government procurement teams, field inspectors and prospective partners who need to verify a contractor's capability before issuing an enquiry or RFP.

The challenge

The work was there; the structure wasn't. Company background, service categories and project photography were scattered, so procurement teams couldn't quickly answer who the firm is, what it does and where it has delivered.

What I built

A clear company-to-capability-to-project journey: five service disciplines (pipeline, stormwater drainage, protection works, roads and mechanical engineering), an image-led field gallery using the firm's own site photography, a printable company-profile dossier, and a tender desk that routes quotation and RFP enquiries straight to the company inbox.

Why it matters

For an infrastructure contractor, credibility is evidence. Real field photographs, a clear capability taxonomy and a fast mobile experience let an inspector evaluate the firm from a phone on site — and make the first enquiry easy.

How it works

  1. 01Meet the company — establish who the firm is and the context for its civil-engineering practice.
  2. 02Explore the relevant work — move from a service category into the matching project gallery.
  3. 03Bring a specific brief — use the quotation and RFP path to send an enquiry to the company directly.

Scope note

Client project delivered through Velocity Web (now Qavironel Technologies). Site imagery is the client's own field photography.

System Architecture

  1. 01

    Procurement teams

    Mobile & desktop

  2. 02

    Frontend

    React 19 · TanStack Start

  3. 03

    Media

    WebP image pipeline

  4. 04

    Enquiries

    Nodemailer → company inbox

  • React 19 with TanStack Start as the application foundation for company, services and project pages.
  • Tailwind CSS v4 styling for responsive layouts and image-led project pages.
  • High-density WebP image pipeline to balance visual detail with mobile performance in the field.
  • Nodemailer notifications route quotation and RFP enquiries to the company's existing inbox.

// Learnings

What this project taught me

  • 01For B2B infrastructure, real field photography beats any stock imagery.
  • 02A clear capability taxonomy shortens the path to an enquiry.
  • 03Mobile performance matters most when the audience is on site.
Visit the live site

// Related work

AI Voice Assistant

K.A.L.K.I.

Desktop assistants either do too little or open an uncontrolled bridge into the host machine.

Civic Admin Platform

Civic Sathi

Civic complaints are triaged by hand, duplicated across channels and rarely tracked to resolution.

Next project

Z Tees E-Commerce