RedArk Solutions
Back to Portfolio
Case Study

Northstone

Construction · Website

Industry

Construction

Platform

Web

Type

Concept Website

Built With

React + Three.js

Project Overview

Construction, shown as it's built.

Northstone is a concept website for a construction, engineering and infrastructure company, designed to show how a building business can look as technically capable online as it is on site.

It is a full multi-page site rather than a landing page: a homepage with a scroll-driven 3D building animation, a sector-filterable project portfolio with individual case studies, services and sectors pages, and a digital construction section where visitors toggle structure, MEP, facade and site layers on a live 3D model. Built as a showcase of frontend and 3D web development, not a delivered client engagement.

01

Requirements

The site needed to feel as substantial as the projects it represents, with real depth of content and something distinctive enough to be remembered.

  • Credible identity for a construction and engineering business
  • A homepage that shows the build process, not just describes it
  • Filterable project portfolio with individual case studies
  • Clear service and sector pages for different client types
  • A digital construction (BIM) section that explains modern methods
  • Fully responsive from site office to boardroom
02

Our Solution

We built a full multi-page site around interactive 3D, structured project data and a restrained industrial design system used consistently throughout.

  • Scroll-driven 3D building animation, from foundation to completion
  • Live 3D model with switchable structure, MEP, facade and site layers
  • Sector-filterable project archive with dedicated detail pages
  • Dedicated services, sectors and digital engineering pages
  • Charcoal, concrete and construction-orange design system
  • Mobile-first layouts with reduced-motion support
03

Skills & Technology

A modern, route-based React frontend with real-time 3D and scroll-driven animation, built to stay smooth and responsive across devices.

ReactViteThree.jsReact Three FiberGSAPTailwind CSS

Scroll-Driven 3D Build

A building that rises from foundation to completion as you scroll.

Digital Construction Viewer

Switch structure, MEP, facade and site layers on a live 3D model.

Industrial Identity

Charcoal, concrete and construction orange with editorial typography.

Your Project

Looking for a digital experience built around your brand?

Discuss Your Project