+371 20 212 368 Get in touch
HSC Nordic

Website development · Construction

A construction portfolio with its own management system

Client — HSC Nordic construction company.

We developed a website where a large collection of architecture and interior work remains easy to browse. Alongside the public site, we built a separate environment for managing projects, descriptions and images.

View the website Request a quote
HSC Nordic website shown on desktop and mobile
hscnordic.eu · responsive presentation

Brief

Present a large body of work without a crowded catalogue

Completed work is the strongest proof for a construction company. The site needed to organise dozens of architecture and interior projects and let the team update the portfolio without involving a developer for every content change.

75 portfolio projects
44 architecture projects
31 interior projects
9 projects per loading step

Content management

One entry reaches every required view

The team does not need to build a page or process each file manually. Every project follows one predictable publishing path.

01

Input

Name, category, year, area, location, description and images.

02

Processing

Data is saved while images are resized and converted to WebP automatically.

03

Portfolio

The work appears in the main grid and the matching architecture or interiors filter.

04

Project page

The same data generates a dedicated page with project information and gallery.

Delivered

From visual direction to project publishing

The public site and content management work as one system: information entered in the panel appears in the right portfolio views.

A01

Visual direction

We created a restrained architectural design with a full-screen opening image, generous spacing and a neutral palette that keeps focus on the work.

A02

Filterable portfolio

Projects are divided into architecture and interiors. Filters update the grid in place, and each category can be opened with a direct link.

A03

Project pages

Every work has a dedicated page with a cover, location, area, year, description and full-width gallery.

A04

Custom admin panel

We built a protected area for adding, editing and deleting projects, their details and galleries.

A05

Image uploads

The cover and multiple gallery files can be uploaded in the browser. The system prepares the image versions required by the site.

A06

Contacts and enquiries

We created a contact page with company details, a map and a form. Messages are delivered by email, with basic checks against automated submissions.

Image processing

One upload, three uses

Construction imagery is detailed and heavy. To avoid loading gallery-sized files in the grid, the system prepares a dedicated WebP version for each context.

01 Original

source file retained

02 900 px

thumbnail for the portfolio grid

03 1600 px

optimised project-page image

Loading strategy

The 75 projects do not load at once

Work is revealed progressively. The first content is available immediately, while later groups and their images are activated only as the visitor approaches them.

01

Progressive batches

Nine works are shown first; subsequent groups of nine are added while scrolling.

02

Deferred images

The browser receives hidden image URLs only shortly before the items are revealed.

03

Priority cover

The home and project hero images are requested with high priority.

04

Right-sized WebP

The grid and gallery use separate files instead of one heavy original.

Technical solution

Technologies

The website and admin panel run on PHP. Project data is stored in structured JSON, while the GD library handles server-side image processing.

PHP 8 JavaScript Tailwind CSS JSON GD / WebP SMTP

Need a portfolio for a large body of work and images?

We will build a website and management system where publishing stays simple and the public catalogue remains fast and clear.

Start a project View the website

Questions and answers

About the HSC Nordic website

01Does publishing a project require a developer?

No. The HSC Nordic team can add details, a cover and a full gallery in the admin panel, then edit or remove the entry later.

02How does the site handle so many images?

Uploads generate WebP thumbnails and larger gallery versions. Projects load in batches, and hidden images are not requested in advance.

03What did KVANTS develop for this project?

We developed the visual design and public site, project catalogue and pages, custom admin panel, image processing and contact-form delivery.

Other projects

You may also like these projects.