01 - Overview
About this project
Typhon Steel Structures is a roofing and structural engineering firm based in South India. They needed a professional web presence that conveyed trust, technical credibility, and showcased their portfolio of industrial and residential steel projects.
02 - Problem
The Challenge
Operating without a digital presence meant Typhon was losing potential leads to competitors. They needed a site that could generate enquiries, showcase completed projects, and work well on mobile devices used by clients visiting sites.
03 - Solution
My Approach
Designed a bold, industrial-inspired UI in Figma before developing it with Next.js and Tailwind CSS. The design uses strong typography, high-contrast sections, and subtle Framer Motion entrance animations to convey precision and scale.
04 - Process
How it was built
Brand & Visual Direction
Established a steel-and-precision visual language - dark backgrounds, structured grids, and industrial accent colours.
UI Design in Figma
Designed all pages in Figma from scratch, including a projects gallery, services breakdown, and contact section.
Next.js Development
Translated designs pixel-perfectly into Next.js components with TypeScript. Built a dynamic projects section with filtering.
Mobile Optimisation
Ensured every section was fully usable on mobile - critical for a client base that often accesses the site from construction sites.
05 - Results & Impact